Question

Does anyone have any idea why the following callback doesn’t execute the code within? I have a window.onload script (the only one) in my main .html page which is called, for some reason, immediately after the fadeTo.

$("#newentryform").fadeTo("fast", .25, function () {
    var newentry = prompt("Please enter a new item:", "");
    if ((newentry != null) && (newentry != "")) {
        var verify = confirm("Press 'OK' to confirm you wish to create a new entry:" + "\n" + newentry);
        if (verify == true) {
            processnewentry(newentry, dropid);
        }
    }
});

The above function is called from an onclick event in the main .HTML page.

EDIT–code requested in comments

This is the HTML around the button and onclick in question. The call is to the makenewitem function
which is the function above.

<div id="entryinput">
<p>Item<input type="text" id="createitem" readonly /><button  id="createitembutton"onClick="showbuttons(this.id)">Select...</button><button id="createnewitembutton" onClick="makenewitem(this.id)">+ New</button><button id="itemReset" onClick="resetbuttons(this.id)">Reset</button>
<input type="text" id="createitemval" style="display:none" readonly/>
<input type="text" id="createitemindex" style="display:none" readonly/>
</p>
</div>

This is the processnewentry function:

function processnewentry (newentryvalue, dropid)
{

if (dropid=="createnewitembutton")
{
    dropid="createitem";
}

    else
{
          dropid="olditem";
}

var createnewItm=document.getElementById(dropid);
    createnewItm.value=newitemvalue;
var createnewitemval=document.getElementById(dropid+"val");
    createnewitemval.value="";
var createnewitemindex=document.getElementById(dropid+"index");
    createnewitemindex.value="1";


        $("#newitemform").fadeTo("fast", 1);

        var currentPage="newitembuttonpressed";
        toggleStatus(currentPage);  //disable inputs and buttons in form


    var hidebutton=document.getElementById(dropid+"button").style.display="none";
    var subdropid=dropid.substr(6);
    var hidenewbutton=document.getElementById("createnew"+subdropid+"button").style.display="none";
    var displaycreateinput=document.getElementById(dropid).style.display="inline";

}

Answer 1

If your onclick is placed on a submit button or an a tag, that might have something to do with it.

You should add return false to your button onclick calls, like this:

<button [...] onClick="showbuttons(this.id); return false;" />

This prevents the default button action (which is submit) to occur.