php - Smarter way to update td content in jQuery -
i'm running html , jquery code works looks ugly me. appreciate suggestion more smarter.
goal: update cells of php generated table using input field. each cells contains basic value should multiplied input.
currently, read value of input, take basic value of each cell hidden input , rewrite whole html of each cell ( hidden input + updated data).
html code:
<table id='tbl'> <thead> <tr> <th colspan="2">quantity: <input type="text" id="quantity" name="quantity" value="1"> </th> </tr> </thead> <tbody> <tr> <td> <input name="1_1" type="hidden" value="11"><span>11</span> </td> <td> <input name="1_2" type="hidden" value="12"><span>12</span> </td> </tr> <tr> <td> <input name="2_1" type="hidden" value="21">21 </td> <td> <input name="2_2" type="hidden" value="22">22 </td> </tr> <tr> <td> <input name="3_1" type="hidden" value="31">31 </td> <td> <input name="2_2" type="hidden" value="32">32 </td> </tr> </tbody> </table>
script:
$('#quantity').keyup(function () { var quantity = parsefloat($(this).val()); if (quantity == "" || isnan(quantity)) quantity = 1; $('#tbl tbody tr td').map(function () { var $row = $(this); var $refvalue = $row.find(':input[type=hidden]').val(); var $refname = $row.find(':input[type=hidden]').attr('name'); $row.html('<input name="' + $refname + '" type="hidden" value="' + $refvalue + '">' + $refvalue * quantity); }); });
fiddle : http://jsfiddle.net/5kkrd/
is there better way ? i'm able change both table, js , on.
regards
this approach - use data
attribute (instead of hidden input) pass multiplier, e.g.:
<td class="cell" data-value="11">11</td>
with - can grab value using jquery, e.g.:
$('.cell').data('value')
Comments
Post a Comment