get the value of 3 hidden fields in a html tablerow where the checkbox has been checked

Question

Hello all,

i need to get the value of 3 hidden fields in a gridviewrow where the checkbox has been checked & build a querystring with them. I can only use Javascript, it's not possible to use postback in our framework :s Any ideas?

thanks

Answer 1

Hi sam,

If you are use jquery in you framework just use jQuery.getJSON() to update the state

Answer 2

this is probably easier that it seems.

first lets get a reference to the gridview (rendered as a table)

var t = document.getElementById('<% =GridView1.ClientID %>'); // use your gridview's id

then we'll need a list of checkboxes

var tableInputs = t.getElementsByTagName('input'); // gets all input elements within the table
var chkList = []; // array where we'll keep track of marked checkboxes

for(var i=0; i<tableInputs.length; i++) {

// see if it's a checkbox and whether or not it's checked
    if (tableInputs[i].type.match(/checkbox/i) && tableInputs[i].checked) {
        // it is and it is, so add it to the list
        chkList.push(tableInputs[i]);
    }
}

now you can use the checkboxes to get reference to specific rows and find the hidden elements

var fields;
var tr = null;

for (var j = 0; j < chkList.length; j++) {
    // look up the heirarchy until you find the table row
    tr = chkList[j].parentNode;
    while (!tr.nodeName.match(/tr/i)) {
        tr = chkList[j].parentNode;
    }

    // repeat the checkbox process for hidden fields
    fields = tr.getElementsByTagName('input'); // all inputs in the same row
    for (var k = 0; k < fields.length; k++) {
        // see if it's a hidden field
        if (fields[k].type.match(/hidden/i)) {
            //TODO: here's a hidden field, do something

        }
    }
    tr = null;
}

I don't always remember when tag names are case sensitive so i default to case-insensitive regex.

Answer 3

If you are using jQuery

var values = [];
$.each($("#gridid .hiddenfields"), function(i, item) {
    values.push($(item).val());
});

this will get you an array with the values, also the hidden fields must be class = "hiddenfields", hope this helps.