javascript - Disable next form field on dynamically inserted form elements -
i know has been asked many times before none of solutions seem work in situation.
i need checkbox on each row disable next text field. each table row created on fly (js clone). first row static. each subsequent row, name , id appended new number (formfield1, formfield2, etc) , happen after page has loaded.
html
<div class="add_rec_container" id="fuel_stop" style="display:block;"><!--open #fuel_stop--> <p class="label">enter fuel stop:</p> <table width="100%" border="0" cellspacing="0" cellpadding="0" id="fuel_stop_table" class="fuel_data"> <tbody> <tr> <td><select name="data_fuel_state1" id="data_fuel_state1" class="state_menu"> <option value="az">az</option> <option value="ca" selected="selected">ca</option> <option value="nm">nm</option> <option value="nv">nv</option> <option value="or">or</option> <option value="ut">ut</option> </select> </td> <td><input type="tel" name="data_total_gal1" id="data_total_gal1" class="help total_gal_field" title="gallons"/></td> <td><input type="checkbox" name="data_yard1" id="data_yard1" class="enableppg" value="yes" onclick="disableppg(this);"/> yard </td> <td>$ <input type="tel" name="data_price1" id="data_price1" class="help price_field" title="ppg" /></td> </tr> </tbody> </table> <a id="add_fuel_row" class="add_btn">+ state</a> </div><!--close #fuel_stop--> <input type="submit" name="submit" class="send_button" value="send"/> </form> </div><!--close .record_entry_container-->
js (not working think should)
function disableppg() { $(this).click(function() { if ($(this).is(':checked')){ $(this).next('.price_field').prop('disabled', true); } else { $(this).next('.price_field').prop('disabled', false); } }); }
the following js works on first row of form elements, not solution multiple rows when added.
function disableppg() { $(this).click(function() { if ($('#data_yard1').is(':checked')) { $('#data_price1').prop('disabled', true); } else { $('#data_price1').prop('disabled', false); } }); }
any appreciated.
$(".enableppg").on("click", function() { if($(this).is(":checked") == true) $(this).parent().next().children().attr("disabled", "disabled"); else $(this).parent().next().children().removeattr("disabled"); });
Comments
Post a Comment