CODEWITHSUNDEEP
javascriptjsondom
Developer404
Developer404

Reputation: 5962

How to get the id name of the Node?

I have a div tag as follows:

<div id="DataEntryForm" style="position:absolute; left:100px;top:175px;width:350px;  z-index:2;background-color:yellow; visibility:hidden;border-top-color: black;">
    <table id="DataEntryFormTable" style=" width:100%" style="margin-top: -50px;">
        <tr><td>&nbsp;Build Name</td><td> <input type="text" id="BuildName" name="BuildName" value="" /></td></tr>
        <tr><td>&nbsp;Build Description</td><td> <input type="text" id="BuildDesc" name="BuildDesc" value="" /></td></tr>
        <tr><td>&nbsp;Software Details</td><td> <input type="text" id="SoftwareDetail" name="SoftwareDetail" value="" /> </td></tr>
        <tr><td>&nbsp;Hardware Details</td><td> <input type="text" id="HardwareDetail" name="HardwareDetail" value="" /> </td></tr><br>
        <tr><td>&nbsp;</td></tr>
        <tr>
            <td>
                <input type="button" value="Save" onclick="saveRecord()" /></td>
            <td> <input type="button" value="Cancel"  onclick="cancelOperation()"/></td>
        </tr>
        <br>
    </table>
</div>

I want to load the values from the database to the input type text. So, I need to get the id of each node in order to match with my json value and node id and to assign the value to it. I'm trying with the following to achieve this. But, I cannot get the id value. Anyone, please help me out on this. Thanks .. 

var nodes = deform.childNodes;
index =0;

// Load the first record in the collection.
// It is expected to have only one object in JS Object collection
var dbRecord= dbRecords[0];

while (index < nodes.length)
{
    if(nodes[index].type=="text")
    {
        nodes[index].value = dbRecord[nodes[index].id];
    }

    index++;
}

Upvotes: 0

Views: 5219

Answers (1)

undefined
undefined

Reputation: 6463

id is the correct property. the problem is that you are not retrieving the nodes that you are trying to retrieve from your table. Using .children() or .childNodes(), only gets direct children of your element, so you need to drill down further into your table to access the text inputs your are trying to fill. Alternatively, if you want to use jQuery, a single selector could do the trick:

$("#DataEntryFormTable input[type='text']")

If you don't use jQuery, I would use .children() recursively to find the elements you're looking for.

edit: Also, make sure you include parenthesis when calling a function, so var nodes = deform.childNodes; would be var nodes = deform.childNodes();

edit again: ... I didn't see the data that you provided. since you have the ID's that you need in your JSON data, you can look up the elements directly using those ids. Try this:

dbRecord= [{"HardwareDetail":"[B","BuildDesc":"Testing1","BuildID":"BL002","BuildName":"Se­cond Name","SoftwareDetail":"ss"}];
record = dbRecord[0];
for (attr in record){
    el = document.getElementById(attr);
    if (el)
        document.getElementById(attr).value = record[attr];
    else
        console.debug('no HTML element with ID ' + attr);
}

I don't think console.debug works in some browsers (IE?), so you'll want to take that part out when you're finished testing.

Upvotes: 1

Related Questions