点击 submit ,没反应,然后我刷新下,再填写,然后提交,就可以了.. 而且这种情况只会出现在第一次,
代码如下 ,有了解的 大神 能帮忙看下么???万分感谢
<%= form_for @message,url: {action: "create"}, :html => {:class => "form-horizontal parent"} do |f| %>
<%= f.text_field :business_id,:value=>@business.id, :type=> 'hidden',:class => 'form-control' %>
<div class="control-group">
<div class="input-group">
<span class="input-group-addon" id="basic-addon1">模板内容</span>
<%= f.text_field :content, :class => 'form-control',:required => true %>
</div>
</div>
<div class="control-group">
<div class="input-group">
<span class="input-group-addon" id="basic-addon1">描述</span>
<%= f.text_field :description, :class => 'form-control',:required => true %>
</div>
</div>
</div>
<div class="modal-footer">
<span class="tips"><%= alert %></span>
<%= f.submit 'Submit', :class => 'btn btn-default' %>
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
</div>
<% end %>
#6 楼 @dandananddada 以下是生成的代码
<!DOCTYPE html>
<html>
<head>
<title>Sms</title>
<link rel="stylesheet" media="all" href="/assets/app.self-14d936d24a52cb16056f49bdc8a9290de21e53a5bb6e808879d08c2a4e439e68.css?body=1" data-turbolinks-track="true" />
<link rel="stylesheet" media="all" href="/assets/bootstrap3.self-2be307b58e3191c875e96e4d9416ada5ea66b3271b60a50f012957326293628c.css?body=1" data-turbolinks-track="true" />
<link rel="stylesheet" media="all" href="/assets/business.self-e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855.css?body=1" data-turbolinks-track="true" />
<link rel="stylesheet" media="all" href="/assets/home.self-e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855.css?body=1" data-turbolinks-track="true" />
<link rel="stylesheet" media="all" href="/assets/message.self-e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855.css?body=1" data-turbolinks-track="true" />
<link rel="stylesheet" media="all" href="/assets/style.self-16f970d7a4a97f9351fb14b570243a74731e9e3d3760504655dd44255288702f.css?body=1" data-turbolinks-track="true" />
<link rel="stylesheet" media="all" href="/assets/application.self-e80e8f2318043e8af94dddc2adad5a4f09739a8ebb323b3ab31cd71d45fd9113.css?body=1" data-turbolinks-track="true" />
<script src="/assets/jquery.self-a714331225dda820228db323939889f149aec0127aeb06255646b616ba1ca419.js?body=1" data-turbolinks-track="true"></script>
<script src="/assets/jquery_ujs.self-d456baa54c1fa6be2ec3711f0a72ddf7a5b2f34a6b4f515f33767d6207b7d4b3.js?body=1" data-turbolinks-track="true"></script>
<script src="/assets/turbolinks.self-c37727e9bd6b2735da5c311aa83fead54ed0be6cc8bd9a65309e9c5abe2cbfff.js?body=1" data-turbolinks-track="true"></script>
<script src="/assets/business.self-877aef30ae1b040ab8a3aba4e3e309a11d7f2612f44dde450b5c157aa5f95c05.js?body=1" data-turbolinks-track="true"></script>
<script src="/assets/home.self-877aef30ae1b040ab8a3aba4e3e309a11d7f2612f44dde450b5c157aa5f95c05.js?body=1" data-turbolinks-track="true"></script>
<script src="/assets/message.self-877aef30ae1b040ab8a3aba4e3e309a11d7f2612f44dde450b5c157aa5f95c05.js?body=1" data-turbolinks-track="true"></script>
<script src="/assets/application.self-3b8dabdc891efe46b9a144b400ad69e37d7e5876bdc39dee783419a69d7ca819.js?body=1" data-turbolinks-track="true"></script>
<meta name="csrf-param" content="authenticity_token" />
<meta name="csrf-token" content="3fOv1dTdlBEgoTmvV7D++9x7OCbdtypPgyjp3Z0sRcc1kXh3YdfcXQnRReooYNgpDezi8dn/uQqOlJLnicwJxA==" />
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/">后台管理系统</a>
</div>
<div class="navbar-collapse collapse pull-right">
<ul class="nav navbar-nav">
<li class='active'>
<a href="#">[email protected]</a>
</li>
<li class='active'>
<a rel="nofollow" data-method="delete" href="/users/sign_out">退出</a>
</li>
<li class='active'>
<a href="/users/edit">编辑注册信息</a>
</li>
</ul>
</div>
</div>
</nav>
<div class="container-fluid">
<div class="row" >
<div class="col-sm-3 col-md-2 sidebar" style="margin-top: 30px">
<ul class="nav nav-sidebar" style="text-align: center">
<li class='active'><a href="/business/new">所有业务</a></li>
<li><a href="/business/15/message">业务一</a></li>
<li><a href="/business/16/message">业务二</a></li>
<li><a href="/business/17/message">业务三</a></li>
</ul>
</div>
<div class="col-xs-12 col-sm-9 col-md-10">
<h3 class="page-header">业务二</h3>
<button class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-sm" style="float: right">
New
</button>
<div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">
<span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title">添加短信模板</h4>
</div>
<div class="modal-body">
<form class="form-horizontal parent" id="new_message" action="/business/16/message" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="✓" /><input type="hidden" name="authenticity_token" value="B4IIt9j+oMXlEAmGEQP/4t8S2r0L+ko0l91kV94IZeLv4N8VbfToicxgdcNu09kwDoUAag+y2XGaYR9tyugp4Q==" />
<input value="16" type="hidden" class="form-control" name="message[business_id]" id="message_business_id" />
<div class="control-group">
<div class="input-group">
<span class="input-group-addon" id="basic-addon1">模板内容</span>
<input class="form-control" required="required" type="text" name="message[content]" id="message_content" />
</div>
</div>
<br>
<div class="control-group">
<div class="input-group">
<span class="input-group-addon" id="basic-addon1">短信描述</span>
<input class="form-control" required="required" type="text" name="message[description]" id="message_description" />
</div>
</div>
</div>
<div class="modal-footer">
<span class="tips"></span>
<input type="submit" name="commit" value="Submit" class="btn btn-default" />
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
</div>
</form> </div>
</div>
</div>
<div class="table-responsive" >
<table class="table" contenteditable="false">
<thead>
<tr>
<th>id</th>
<th>短信内容</th>
<th>描述</th>
<th>创建时间</th>
<th>操作</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
</div>
<script src="//cdnjs.bootcss.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="//cdnjs.bootcss.com/ajax/libs/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>
</div>
</body>
</html>
首先你得把 markup 写对,不然问题一个接一个。按 Bootstrap 定义 modal-body 是不包裹 modal-footer 的,你这里包裹了,还把 form 混在一起。
写个干净的 html, 把 form 放到 modal-body 里面,可以不要 button。然后监听 modal primary button 的点击事件,安排 form submit 就可以了。