如何从特定 ID 调用特定模型

Question

在这里，我正在添加用户保险详细信息，并添加他们的通知警报系统。

以下是添加保险的简单方法：

当用户添加他们的各种保险详细信息时，它会在下面的临时表中显示他们的保险数据：

用户还可以从保险详情模型中添加他们的通知选项像这样：

但问题是，当我从保险详细信息行调用通知模型时。那么它在添加多个保险详细信息行的情况下不起作用。

这是我的 jquery 代码

 <script type="text/javascript">
                                    var id = 1;
                                    function add_ins(){




                                      var mode = $('#Mode').val();
                                      var term = $('#term').val();
                                      var mat_amt = $('#mat_amt').val();
                                      var premium = $('#premium').val();
                                      var ins_date = $('#ins_date').val();

                                      // var id = 1;
                                      // alert(mode);

                                      $('#insurance_temp').append('<tr><td>'+id+'</td><td>'+mat_amt+'<input type="hidden" name="mat_amt[]" value="'+mat_amt+'"><input type="hidden" name="term[]" value="'+term+'"></td><td>'+ins_date+'<input type="hidden" name="ins_date[]" value="'+ins_date+'"></td><td>'+mode+'<input type="hidden" name="Mode[]" value="'+mode+'"></td><td>'+premium+'<input type="hidden" name="premium[]" value="'+premium+'"></td><td><a style="cursor: pointer;" data-toggle="modal" data-target="#notifier'+id+'"><span class="fa fa-pencil"></span>&nbsp;Notfication</a></td><td>Edit</td><td>Delete</td></tr>');

                                      $('#notifier').attr('id','notifier'+id);

                                      id++;

                                      $('#frm_add_insurance')[0].reset();

                                    }

这是我的 HTML 模型

<div class="modal fade" id="notifier" role="dialog">
                        <div class="modal-dialog col">

                          <!-- category delete Modal content-->
                          <div class="modal-content">
                            <div class="modal-header">
                              <button type="button" class="close" data-dismiss="modal">&times;</button>
                              <h4 class="modal-title">Add Notification<script type="text/javascript">id</script></h4>
                            </div>
                            <div class="modal-body">

                                <div class="container">  

            <div class="form-group">  

                      <div class="table-responsive">  
                           <table class="table table-bordered" id="dynamic_field">  
                                <tr> 

                                    <td><select class="form-control"  name="notify_type[]">
                                      <option value="sms">SMS</option>
                                    </select>
                                    </td>  
                                     <td><input type="text" name="units[]" value="10" class="form-control name_list" /></td>  
                                     <td><select class="form-control" name="unit_type[]">
                                      <option value="months">Months</option>
                                      <option value="weeks">Weeks</option>
                                      <option value="days">Days</option>
                                    </select>
                                    </td>
                                     <td><button type="button" name="add" id="add" onclick="add_not_field();" class="btn btn-success">Add More</button></td>  
                                </tr>  
                           </table>  

                      </div>  
                 <!-- </form>   -->
            </div>  
       </div>  

请建议我，我哪里出错了。提前致谢。

Answer 1

通知 td 的 Onclick 只需从表中获取保险 id 并像这样更新模态。它可以通用。

$(document).ready(function(){

  $(document).on('click','.notifier_click',function(){
  
  
     var ins_id = $(this).closest('tr').find('td.insurance_main_id').text();
     
     $('.insurance_modal_id').val(ins_id);
  
  });
 


});

 
 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  
 <table border="1px">
	<thead>
	<tr>
	  <th>insurance id</th>
	  <th>notification</th>
	</tr>
	</thead>
	<tbody>
		<tr>
		  <td class="insurance_main_id">1</td>
		  <td><a style="cursor: pointer;" data-toggle="modal" data-target=".notifier" class="notifier_click"><span class="fa fa-pencil"></span>&nbsp;Notfication</a></td>
		<tr>
		<tr>
		  <td class="insurance_main_id">2</td>
		  <td><a style="cursor: pointer;" data-toggle="modal" data-target=".notifier" class="notifier_click"><span class="fa fa-pencil"></span>&nbsp;Notfication</a></td>
		<tr>
	</tbody>
 </table>
 
 
 <div class="modal fade notifier" role="dialog">
                        <div class="modal-dialog col">

                          <!-- category delete Modal content-->
                          <div class="modal-content">
                            <div class="modal-header">
                              <button type="button" class="close" data-dismiss="modal">&times;</button>
                              <h4 class="modal-title">Add Notification<script type="text/javascript"></script></h4>
                            </div>
                            <div class="modal-body">

                                <div class="container">  

            <div class="form-group">  

                      <div class="table-responsive">  
                           <table class="table table-bordered" id="dynamic_field">  
                                <tr> 
                                    <td ><input type="text" name="insurance_id" class="insurance_modal_id"/> </td>
                                    <td><select class="form-control"  name="notify_type[]">
                                      <option value="sms">SMS</option>
                                    </select>
                                    </td>  
                                     <td><input type="text" name="units[]" value="10" class="form-control name_list" /></td>  
                                     <td><select class="form-control" name="unit_type[]">
                                      <option value="months">Months</option>
                                      <option value="weeks">Weeks</option>
                                      <option value="days">Days</option>
                                    </select>
                                    </td>
                                     <td><button type="button" name="add" id="add" onclick="add_not_field();" class="btn btn-success">Add More</button></td>  
                                </tr>  
                           </table>  

                      </div>  
                 <!-- </form>   -->
            </div>  
       </div>  
          </div>  
       </div>