您好,欢迎来到三六零分类信息网!老站,搜索引擎当天收录,欢迎发信息
三六零分类信息网 > 十堰分类信息网,免费分类信息发布

bootstrap模态框如何提交表单

2025/7/8 3:34:11发布5次查看
bootstrap模态框提交表单的方法:首先打开相应的代码文件;然后直接把form表单写在模态框的modal-body里;最后设置action提交时要跳转的链接即可。
本教程操作环境:windows7系统、bootsrap3.3.7版,该方法适用于所有品牌电脑。
推荐:《bootstrap教程》《css视频教程》
bootstrap模态框提交表单
直接把form表单写在模态框的modal-body里,和正常的form表单一样处理,action=提交时要跳转的链接。
如果按照bootstrap的模态框架构来,最后的保存要放在form外,但是提交按钮放在form之外则不能提交表单,所以要放在form之内。
<div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="close"><span aria-hidden="true">×</span></button> <h4 class="modal-title" id="mymodallabel">添加数据字典</h4> </div> <div class="modal-body"> <form class="form-horizontal" role="form" id="add-key-form" action="system/dic-save.json" method="post"> <div class="form-group"> <label class="col-sm-2 control-label"><i class="required">* </i>键:</label> <div class="col-sm-4"> <input type="text" class="form-control" name="keyname" placeholder="请输入字典键"/> </div> <label class="col-sm-2 control-label"><i class="required">* </i>值:</label> <div class="col-sm-4"> <input type="text" class="form-control" name="keyvalue" placeholder="请输入字典值"> </div> </div> <div class="modal-footer"> <button type="submit" class="btn btn-primary">保存</button> </div></form> </div></div>
更多编程相关知识,请访问:编程教学!!
以上就是bootstrap模态框如何提交表单的详细内容。
十堰分类信息网,免费分类信息发布

VIP推荐

免费发布信息,免费发布B2B信息网站平台 - 三六零分类信息网 沪ICP备09012988号-2
企业名录 Product