|
|
Hi,
I have a question about checkbox in IE data binding. I am using IE data binding to display a table in HTML. One of the columns in my table is checkbox. The table is inside a form. After submitting the form, my script want to know which rows have been selected by checking the checkbox in the row.
In regular HTML, this can be easily achieved by sending name-value pair using the following code.
<input type="checkbox" value="row_id">
However, in IE data binding, the value of a checkbox is only "on" or "off". After submitting the form, only checked checkbox are submitted, and its value is always "on". I can only know the number of rows checked, but have no way to know which rows have been checked. My code is attached below.
I have struggled on this problem for quite a while and my boss is very angry that I right now.
Can anyone help me?
Thank you.
rong
<form action="/forum/script.html" method="post" name="MyForm" id="MyForm">
<table DATASRC="#dataBindId">
<THEAD>
<th><div>Check Box</div></th>
<th><input type="Button" value="ID" onClick="document.all.dataBindId.sort='ID';dataBindId.Reset();"></th>
<Th><input type="Button" value="col1" onClick="document.all.dataBindId.sort='col1';dataBindId.Reset();"></Th>
</thead>
<TBODY>
<td><div><input type="checkbox" name="id_checked" value="yes"></div></td>
<td><div DATAFLD="ID"></div></a></td>
<td><div DATAFLD="Col1"></div></a></td>
</tbody>
<input type="submit" />
</form>
|
|
|
|
I don't have time to actually code a working example, but here is one idea for you. Instead of a type=submit button, use a type=button button with an onclick event that calls a javascript function. That javascript function will find which rows have the checkbox checked and build a value, store it in a hidden variable, then submit the form. Something like:
var table1 = document.getElementById("MyTable")
var rows = table1.rows;
var rowCnt = rows.length;
for (var rowIdx = 0; rowIdx < rowCnt; rowIdx++) {
cells = rows[rowIdx].cells;
cellCnt = cells.length;
for (var cellIdx = 0; cellIdx < cellCnt; cellIdx++) {
alert("Row: "+rowIdx+"\nCell: "+cellIdx);
}
} |
|
The code above shows you how you can programmatically iterate through the rows and cells of an HTML table. You must give your table an ID. Also, your table is missing <TR> tags--you should put those in. By looping through the rows and cells, you can check each checkbox to see if it is checked, if so, then check the next cell to grab the ID. Then append the ID to a hidden form element named "Checked_IDs" or something like that. As you append your checked IDs, delimit the string with spaces or commas or underscores or something. Then when you submit the form using document.forms[0].submit(), you can Split() the value in your server-side code to have an array of all the checked IDs.
Good luck!
|
|
|
|
|
|
|
|
|
// |
rong
Troy Wolf
