码迷,mamicode.com
首页 > 其他好文 > 详细

bootstrap模态框的调用

时间:2017-03-29 13:09:38      阅读:255      评论:0      收藏:0      [点我收藏+]

标签:row   nbsp   java   amp   cli   led   mis   text   js调用   

1、<a href="JavaScript:void(0);" class="bs-tooltip remark-item" rel="{$bill.id},{$bill.username},{$bill.remark}"><i class="icon-pencil"></i>备注</a>

2、<!-- 模态框(Modal) -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content"><div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-hidden="true"> &times; </button><h4 class="modal-title" id="myModalLabel"> 备注 </h4></div>
<form class="form-horizontal row-border" method="post" role="form" id="remark">
<input type="hidden" name="id" id="bill_id" value=""/>
<div class="modal-body">
<div class="form-group">
<label class="col-md-2 control-label">客户名称:</label>
<div class="col-md-10">
<input type="text" id="user_username" value="" class="form-control input-width-medium" disabled />
</div>
</div>
<div class="form-group">
<label class="col-md-2 control-label">备注:</label>
<div class="col-md-10">
<input type="text" name="remark" id="bill_remark" value="" class="form-control input-width-xlarge" placeholder="备注" />
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">关闭 </button>
<button type="submit" class="btn btn-primary"> 确定 </button>
</div>
</form>
</div>
</div>
</div>

3、js调用
$("a.remark-item").click(function (b) {
var data=$(this).attr(‘rel‘);
var result = data.split(",");
$("#bill_id").val(result[‘0‘]);
$("#user_username").val(result[‘1‘]);
$("#bill_remark").val(result[2]);
$("#myModal").modal();
});
 

bootstrap模态框的调用

标签:row   nbsp   java   amp   cli   led   mis   text   js调用   

原文地址:http://www.cnblogs.com/pcx105/p/6638911.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!