StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POperformance problem looping through table rows
text
Body
copied!<p>I am using jquery to loop through table rows and save the data. If the table has 200 rows it is performing slow. I am getting the javascript message "Stop Running this script" in IE when I call this method. Following is the code I am using to loop through table rows. Can you please let me know if there is a better way to do this. </p> <pre><code> function SaveData() { var $table = $('#' + gridid); var rows = $table.find('tbody > tr').get(); var transactions = []; var $row, empno, newTransaction, $rowChildren; $.each(rows, function(index, row) { $row = $(row); $rowChildren = $row.children("td"); if ($rowChildren.find("input[id*=hRV]").val() === '1') { empno = $rowChildren.find("input[id*=tEmpno]").val(); newTransaction = new Array(); newTransaction[0] = company; newTransaction[1] = $rowChildren.find("input[id*=tEmpno]").val(); newTransaction[2] = $rowChildren.find("input[id*=tPC]").val(); newTransaction[3] = $rowChildren.find("input[id*=hQty]").val(); newTransaction[4] = $rowChildren.find("input[id*=hPR]").val(); newTransaction[5] = $rowChildren.find("input[id*=tJC]").val(); newTransaction[6] = $rowChildren.find("input[id*=tL1]").val(); newTransaction[7] = $rowChildren.find("input[id*=tL2]").val(); newTransaction[8] = $rowChildren.find("input[id*=tL3]").val(); newTransaction[9] = $rowChildren.find("input[id*=tL4]").val(); newTransaction[10] = $rowChildren.find("input[id*=tL5]").val(); newTransaction[11] = $rowChildren.find("input[id*=tL6]").val(); newTransaction[12] = $rowChildren.find("input[id*=tL7]").val(); newTransaction[13] = $rowChildren.find("input[id*=tL8]").val(); newTransaction[14] = $rowChildren.find("input[id*=tL9]").val(); newTransaction[15] = $rowChildren.find("input[id*=tL10]").val(); newTransaction[16] = $rowChildren.find("input[id*=tSF]").val(); newTransaction[17] = $rowChildren.find("input[id*=tCG]").val(); newTransaction[18] = $rowChildren.find("input[id*=tTF]").val(); newTransaction[19] = $rowChildren.find("input[id*=tWK]").val(); newTransaction[20] = $rowChildren.find("input[id*=tAI]").val(); newTransaction[21] = $rowChildren.find("input[id*=tWC]").val(); newTransaction[22] = $rowChildren.find("input[id*=tPI]").val(); newTransaction[23] = "E"; var record = newTransaction.join(';'); transactions.push(record); } }); if (transactions.length > 0) { var strTransactions = transactions.join('|'); //send data to server //here ajax function is called to save data. } } </code></pre> <p>The html structure for the table row is like this</p> <pre><code><tr class="rgRow" id="ctl00_c_PETV2_1_gB_ctl00__12"> <td> <a href="javascript:" id="lD" onclick="DeleteRow(this)">Delete</a> </td><td> <input type="text" value='385 ' id="tEmpno" /> <input name="ctl00$c$PETV2_1$gB$ctl00$ctl28$hRV" type="hidden" id="ctl00_c_PETV2_1_gB_ctl00_ctl28_hRV" value="1" /> <input name="ctl00$c$PETV2_1$gB$ctl00$ctl28$hRC" type="hidden" id="ctl00_c_PETV2_1_gB_ctl00_ctl28_hRC" value="0" /> </td><td style="width:100px;"> <input type="text" value='Barron, Pamela J.' id="tEE" readonly="readonly" /> </td><td> <input type="text" value='OT ' id="tPC" /> </td><td> <input type="text" value='7.00' id="tQty" class="right" /> <input type="hidden" name="ctl00$c$PETV2_1$gB$ctl00$ctl28$hQty" id="ctl00_c_PETV2_1_gB_ctl00_ctl28_hQty" value="7.00000" /> </td><td> <input type="text" value='22.00' id="tPR" class="right" /> <input type="hidden" name="ctl00$c$PETV2_1$gB$ctl00$ctl28$hPR" id="ctl00_c_PETV2_1_gB_ctl00_ctl28_hPR" value="22.000000" /> </td><td> <input type="text" value='231.00' id="tAmt" class="right" readonly="readonly" /> </td><td> <input type="text" value='300 ' id="tJC" /> </td><td> <input type="text" value='50 ' id="tL1" /> </td><td> <input type="text" value='23 ' id="tL2" /> </td><td> <input type="text" value='001 ' id="tL3" /> </td><td> <input type="text" value=' ' id="tL4" /> </td><td> <input type="text" value='1 ' id="tSF" /> </td><td> <input type="text" value='1' id="tCG" /> </td><td> <input type="text" value='B' id="tTF" /> </td><td> <input type="text" value='0' id="tWk" /> </td><td> <input type="text" value='Y' id="tAI" /> </td><td> <input type="text" value='8810 ' id="tWC" /> </td><td style="width:50px;"> <input type="text" value='' id="tPI" /> </td> </tr> </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload