JQuery: How to correct this Add New Table Row Function -


i have html table , want tried write add new row function using jquery.but not working. here sample jquery code:

$('tr td input[type="checkbox"].yes').change(function() {     $(this).closest('tr').find(":input:not(.yes)").prop('disabled', !this.checked);     $(this).closest('tr').find(":input.no").prop('checked', !this.checked); }); $(".addmore").click(function() {     var data = "<tr><td><input class='yes' type='checkbox' checked/></td><td><input type='text' value='4444'/></td><td><select><option>a</option><option>b</option></select></td><td><input type='text' value='dddd'/></td><td><select><option>a</option><option>b</option></select></td></tr>";     $('table').append(data); }); 

here link given bellow:

jsfiddle source code link

please help.thanks

i think looking adding rows in table clicking add more button. here working code adding rows in table.

$(".addmore").click(function(){      var data= "<tr><td><input class='yes' type='checkbox'/></td><td><input type='text' value=''/></td><td><select><option>a</option><option>b</option></select></td><td><input type='text' value=''/></td><td><select><option>a</option><option>b</option></select></td></tr>";     $('table tbody').append(data);        });    $('tr td input[type="checkbox"].yes').change( function() {     $(this).closest('tr').find(":input:not(.yes)").prop('disabled', !this.checked);     $(this).closest('tr').find(":input.no").prop('checked', !this.check);  });
table {      border-collapse: collapse;  }  table, th, td {      border: 1px solid black;      padding: 2px;  }    table, th, td {      text-align: center;  }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <table >    <thead>    <tr>      <th>enable/disable</th>      <th>text</th>      <th>select</th>      <th>textinput</th>      <th>select 2</th>    </tr>      </thead>    <tbody>    <tr>      <td><input class="yes" type="checkbox" checked/></td>      <td><input type="text" value="1111"/></td>      <td><select><option>a</option><option>b</option></select></td>      <td><input type="text" value="aaaaa"/></td>      <td><select><option>a</option><option>b</option></select></td>    </tr>    <tr>      <td><input class="yes" type="checkbox" checked/></td>      <td><input type="text" value="2222"/></td>      <td><select><option>a</option><option>b</option></select></td>      <td><input type="text" value="bbbb"/></td>      <td><select><option>a</option><option>b</option></select></td>    </tr>    <tr>      <td><input class="yes" type="checkbox" checked/></td>      <td><input type="text" value="3333"/></td>      <td><select><option>a</option><option>b</option></select></td>      <td><input type="text" value="cccc"/></td>      <td><select><option>a</option><option>b</option></select></td>    </tr>    </tbody>  </table>  <button type="button" class='addmore'>+ add more</button>


Comments

Popular posts from this blog

ios - RestKit 0.20 — CoreData: error: Failed to call designated initializer on NSManagedObject class (again) -

java - Digest auth with Spring Security using javaconfig -

laravel - PDOException in Connector.php line 55: SQLSTATE[HY000] [1045] Access denied for user 'root'@'localhost' (using password: YES) -