在这里,我正在努力添加用户保险详细信息,并添加他们的通知警报系统。
以下是添加保险的快照:
当用户添加各种保险详细信息时,它会在下面的临时表中显示他们的保险数据:
用户还可以从保险详细信息模型中添加他们的通知选项,如下所示:
但问题是,当我从保险详情行调用通知模型时。然后,如果添加了多个保险详细信息行,它就不起作用。
这是我的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> 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">×</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>
请建议我,我哪里出错了。提前致谢。
答案 0 :(得分:0)
点击通知td只需从表中获取保险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);
});
});
&#13;
<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> 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> 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">×</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>
&#13;