How can I combine that javascript and jQuery function to hide a button?

Question

I downloaded the File upload script called Simple Photo Manager. Since I'm more familiar with jQuery functions I want to use them in combination with the already existing JS code from that script.

I basically want to hide the Delete button when it's clicked. Why is the Delete button not being hidden after I click on it? (Note: the JS files are correctly included into the HTML file) Also, the delLink.removeChild and delLink.appendChild are useless here because it was originally intended for a Delete/Restore switch link, but I decided to go for a button instead.

Thanks a lot if you can help me.

The html code is:

<input type='button' id='deleteit' onClick="deleteLinkOnClick
(this, 'delFlag<?=$imgid?>')">

The JS code for creating that element when an image is uploaded is:

var image_del_link = par.createElement('input');
image_del_link.type = "button";
image_del_link.value = "Delete";
imgdiv.appendChild(image_del_link);

The function for the onclick is: (I tried to write the jQuery function at the bottom)

function deleteLinkOnClick(delLink, delFlag) {
    var par = window.document;
    var imgDiv = delLink.parentNode;
    var image_hidden = delFlag == '' ? imgDiv.childNodes[2] : par.getElementById(delFlag);

    if (image_hidden.value == '1') {

        image_hidden.value = '0';
        delLink.removeChild(delLink.childNodes[0]);
        delLink.appendChild(par.createTextNode("Restore"));
        delLink.style.color = '#FF0000';
    }
    else {
        image_hidden.value = '1';
        delLink.removeChild(delLink.childNodes[0]);
        delLink.appendChild(par.createTextNode("Delete"));
        delLink.style.color = '#64B004';
    }

    $(document).ready(function(){
        $(image_del_link).click(function(){
            $(this).hide();
            });
        });
}

Hi, thanks for your response. I removed the document.ready but it had no incidence.. — eric01
– eric01, Commented Mar 18, 2012 at 17:53

Taha Paksu · Accepted Answer · 2012-03-18 17:34:01Z

1

Here it is.

$("#deleteit").click(function(){
    $(this).hide();
})

answered Mar 18, 2012 at 17:34

Taha Paksu

15.6k2 gold badges50 silver badges83 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

eric01 Over a year ago

Hi Thanks for your response. Unfortunately, it doesn't have any effect on the button it's still there. In my original post i had forgotten to add that: imgdiv.appendChild(image_del_link); (see edited code above). Could this be not overrulable? This is quite confusing..

Taha Paksu Over a year ago

put my code right after your imgdiv.appendChild(image_del_link); code.

eric01 Over a year ago

You just made my day :D. Thanks a lot for that. How come it doesn't work if I put it in the function? Thanks again

eric01 Over a year ago

Actually, I got it. It's probably because when that function is executed, the onClick already happened. Cheers

Nemoy · Accepted Answer · 2012-03-18 17:46:23Z

0

Try :

$("#deleteit").live("click", function(){
    $(this).hide();
});

answered Mar 18, 2012 at 17:46

Nemoy

3,4471 gold badge17 silver badges14 bronze badges

1 Comment

eric01 Over a year ago

Hi Thanks for your response. You code works too, but in fact it was a problem of placement within the code. I had to put that outside of the function. Regards

Collectives™ on Stack Overflow

How can I combine that javascript and jQuery function to hide a button?

2 Answers 2

4 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related