CODEWITHSUNDEEP
javascript
chris
chris

Reputation:

obj is null, javascript

function init()

{

alert("init()");
    /**
     * Adds an event listener to onclick event on the start button.
     */
     xbEvent.addEventListener(document.getElementById("viewInvitation"), "click", function()
    {
        new Ajax().sendRequest("31260xml/invitations.xml", null, new PageMaster());

         xbEvent.addEventListener(document.getElementById("declinebutton"), "click", function ()
        {
           declineInvitation();
        });
     });

ok so what I have here is a event listerner function, the case is when viewInvitation is clicked , the program will fetch my xml file and run page master function where I created my decline button with id="declinebutton", however this does not work, the error message that i get is obj=null or the program could not find id = declinebutton, why is it so? I have created it when I called page master using dom. any help will be appreciated.

function PageMaster()
{
    this.contentDiv = document.getElementById("content");
}

/**
 * Builds the main part of the web page based on the given XML document object
 *
 * @param {Object} xmlDoc   the given XML document object
 */
var subjectList;
var i;

PageMaster.prototype.doIt = function(xmlDoc)
{
    alert("PageMaster()");

alert("Clear page...");
this.contentDiv.innerHTML = "";

if (null != xmlDoc) 
{
    alert("Build page...");

    //create div Post
    var divPost = document.createElement("div");
    divPost.className = "post";

    //create h1 element
    var h1Element = document.createElement("h1");
    var headingText = document.createTextNode("Invitations");
    h1Element.appendChild(headingText);

    //insert h1 element into div post
    divPost.appendChild(h1Element);

    subjectList = xmlDoc.getElementsByTagName("subject");   
    var groupList = xmlDoc.getElementsByTagName("group");

    for (i = 0; i < subjectList.length; i++) //for each subject
    {
        var divEntry = document.createElement("div");
        divEntry.className = "entry";

        var subjectNum = subjectList[i].attributes[0].nodeValue;
        var subjectName = subjectList[i].attributes[1].nodeValue;
        var groupId = groupList[i].attributes[0].nodeValue;
        var groupName = groupList[i].attributes[1].nodeValue;
        var ownerId = groupList[i].attributes[2].nodeValue;

        //set up the invitation table attributes    


        var table=document.createElement("table");
        table.width = 411;
        table.border = 3;
        table.borderColor = "#990000"

        var input=document.createElement("p");
        var inputText=document.createTextNode("You are invited to join " + groupName + "(groupId : " + groupId +")");
        input.className="style11";
        var blank=document.createElement("nbps");
        input.appendChild(inputText);

        var acceptButton=document.createElement("input");
        acceptButton.type="button";
        acceptButton.id="acceptbutton";
        acceptButton.value="accept";

        var declineButton=document.createElement("input");
        declineButton.type="button";
        declineButton.id="declinebutton";
        declineButton.value="decline";

        table.appendChild(input);
        table.appendChild(acceptButton);
        table.appendChild(declineButton);
        divEntry.appendChild(table);

        var blankSpace = document.createElement("p");
        divEntry.appendChild(blankSpace);
        divPost.appendChild(divEntry);
    }

    //insert div post into div content
    this.contentDiv.appendChild(divPost);
    }
};

/**function getValueOf()
{
    return i;
}**/
function declineInvitation()
{
    alert("decline");
}
function acceptInvitation()
{
    alert("hello");
    /**var pos=getValueOf();
    alert(subjectList[pos].attributes[0].nodeValue);**/
}

That's my page master function, and I definitely have created the button. but it does not work.

Upvotes: 1

Views: 1292

Answers (4)

user113054
user113054

Reputation:

As far as I understand, you create button with id="declinebutton" for each entry from xml, is that right? If yes, I'd suggest you to generate different id's for each button (for example, append line index to 'declinebutton', so you have buttons 'declinebutton0', 'declinebutton1' an so on), and assign event listener to buttons separately in the loop.

Upvotes: 1

Robert Harvey
Robert Harvey

Reputation: 180787

You have a listener inside a listener. Is that right?

What about this?:

function init(){

alert("init()");

/**     * Adds an event listener to onclick event on the start button.     */
xbEvent.addEventListener(document.getElementById("viewInvitation"), "click", function()    
{        
     new Ajax().sendRequest("31260xml/invitations.xml", null, new PageMaster());
}

xbEvent.addEventListener(document.getElementById("declinebutton"), "click", function ()        
{                   
      declineInvitation();        
});

Upvotes: 1

Lucas Wilson-Richter
Lucas Wilson-Richter

Reputation: 2324

The example you gave doesn't create the "Decline" button, as your question suggests it should. If it should, you might want to look at that.

Of course, if the button already exists, please disregard this answer.

Upvotes: 1

Robert Harvey
Robert Harvey

Reputation: 180787

Try calling your function like this:

window.onload=init;

The javascript runs as the page loads. At that point, the element does not yet exist in the DOM tree. You'll need to delay the script until the page has loaded.

Upvotes: 2

Related Questions