How to remove div using id ?

Question

5.00/5 (1 vote)

See more:

I am working on MVC 5,

After remove the image from folder, the div contain image is now removing.

JavaScript

$(document).on("click", ".deleteProImg", function (e) {
    debugger
    if (confirm("Are you sure you want to delete?")) {       

        var imgId = $(this).attr('id');
        var _imgId = imgId.substring(10);       
        $.ajax({
            url: '/Product/DeleteProImage/',
            type: "POST",
            data: { proFileName: _imgId },
            success: function (data) {
                $('#' + _imgId).remove();
            }
        });
    }
    return false;
});

What I have tried:

View,

HTML

<div id="uploadedImages">
        <div id="25cb10a7-3ae0-41a7-9b40-964ea0e74308.png"><img id="undefined" src="../Product/Image?imageName=25cb10a7-3ae0-41a7-9b40-964ea0e74308.png" width="135" height="135"> <button class="deleteProImg" id="btnProImg_25cb10a7-3ae0-41a7-9b40-964ea0e74308.png">Delete</button> <input type="hidden" value="25cb10a7-3ae0-41a7-9b40-964ea0e74308.png" name="img_81"></div></div>

How can I remove the $('#25cb10a7-3ae0-41a7-9b40-964ea0e74308.png') div ?

Posted 2-May-17 0:40am

Member 12955507

Updated 2-May-17 3:07am

Add a Solution

Comments

ZurdoDev 2-May-17 6:49am

$("#divID").remove()

Member 12955507 2-May-17 6:52am

yes I did tried. $('#' + _imgId).remove(); here _imgId = "25cb10a7-3ae0-41a7-9b40-964ea0e74308.png" but not happening.

ZurdoDev 2-May-17 6:56am

Then debug it. You'll need to make sure $("#25cb10a7-3ae0-41a7-9b40-964ea0e74308.png").length > 0.

Member 12955507 2-May-17 6:59am

yes, I did debug then _imgId = "25cb10a7-3ae0-41a7-9b40-964ea0e74308.png". but still the div is not removing.

ZurdoDev 2-May-17 7:04am

And what is $("#25cb10a7-3ae0-41a7-9b40-964ea0e74308.png").length ?

Member 12955507 2-May-17 7:12am

zero

ZurdoDev 2-May-17 7:20am

That means there is no element with an id of 25cb10a7-3ae0-41a7-9b40-964ea0e74308.png. Click View Source and see what the id is.

Member 12955507 2-May-17 7:22am

please look my html code, after ajax result I did wright $('#' + _imgId).remove(); this code but still the div is showing there as above html.

ZurdoDev 2-May-17 7:54am

You are not listening to me. Because .length was 0 means it does not exist. So, view source and find out what the id is. Or simplify the id. That's one crazy id so it's possible that is causing the problem.

Member 12955507 2-May-17 8:30am

Excuse me! here, each div is dynamically creating with image name, that is div id. then setting the image name as div id again appending to the div 'uploadedImages'

F-ES Sitecore 2-May-17 8:42am

It's likely to be the "." that is giving you problems as when you do "#a.b" in a jQuery selector it means something with the ID of "a" that has a class of "b" so jQuery is really looking for an id called 25cb10a7-3ae0-41a7-9b40-964ea0e74308 with a class of png.

When you dynamically create the ids I'd remove the period so your id is actually 25cb10a7-3ae0-41a7-9b40-964ea0e74308png

ZurdoDev 2-May-17 9:05am

Good catch.

ZurdoDev 2-May-17 10:16am

You should post as solution.

F-ES Sitecore 2-May-17 12:12pm

He'll only ask "give me code" and I CBA lol

ZurdoDev 2-May-17 9:05am

Then jQuery is lying. I'm not sure what you want if you won't do what we ask you to do.

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Ramesh Kumar Barik · Accepted Answer · 2017-05-02T03:07:00

Solution 1

When ever we are creating any dynamic id for HTML control we should follow some rules.
Once your id is correct then your jquery will work fine.

Please refer this link, it may help you.

What are valid values for the id attribute in HTML? - Stack Overflow[^]

Posted 2-May-17 3:07am

Ramesh Kumar Barik

Comments

Nirliptananda 9-Jun-17 11:18am

Thanks Buddy !!