Jquery 模态内部的form元素
我尝试将我的登录表单放在一个模式中,并将data dismise=model添加到提交按钮中。模式已成功取消,但POST方法似乎未启动,页面保持不变。还有人试着把一个表单放在一个模态中,然后让它工作吗Jquery 模态内部的form元素,jquery,twitter-bootstrap,Jquery,Twitter Bootstrap,我尝试将我的登录表单放在一个模式中,并将data dismise=model添加到提交按钮中。模式已成功取消,但POST方法似乎未启动,页面保持不变。还有人试着把一个表单放在一个模态中,然后让它工作吗 <div class="modal hide fade" id="signin-register" tabindex="-1" role="dialog" aria-labelledby="image-modal-label" aria-hidden="true">
<div class="modal hide fade" id="signin-register" tabindex="-1" role="dialog" aria-labelledby="image-modal-label" aria-hidden="true">
<div class="modal-body">
<div class="row-fluid">
<div class="span12">
<div class="span6">
<div class="row-fluid">
<div class="span12">
<legend>Sign in</legend>
<form class="navbar-form pull-right" method="POST" action="login/">
<input type="hidden" name="a" value="validate" />
<input class="input-small" type="text" placeholder="Username" name="username">
<input class="input-small" type="password" placeholder="Password" name="password">
<button class="btn btn-small btn-info" type="submit" class="btn2" data-dismiss="modal"><strong>sign in</strong></button>
</form>
<legend>Register</legend>
<form action="" method="POST" id="register_form">
<label>Username:*</label><input class="input-small" type="text" name="username" placeholder="Username" />
<label>Password:*</label><input class="input-small" type="password" name="password" placeholder="Password" />
<label>Email:*</label><input type="text" name="email" placeholder="E-mail" /><br>
<input type="submit" name="a" value="Register" data-dismiss="modal"/>
</form>
</div>
</div>
</div>
<div class="span6">
<div class="row-fluid">
<div class="span12">
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
</div>
</div>
我再次确认登录表单在模式之外工作。数据为dismise=modal的元素应该用于解除模式,任何默认行为(如提交表单)都将被覆盖
如果需要提交表单,请不要在“提交”按钮上使用此属性。就这么简单。数据为dismise=modal的元素应该用于解除模式,任何默认行为(如提交表单)都将被覆盖
如果需要提交表单,请不要在“提交”按钮上使用此属性。就这么简单。这很容易。提交时不需要数据解除属性。我使用的是MVC4,并且经常这样做:
<div id="mdlProceed" class="modal hide fade" data-backdrop="static" data-keyboard="false">
<div class="modal-header">
<h3>Header</h3>
</div>
<div class="modal-body">
Body
</div>
@using (Html.BeginForm(null, null,
new { area = "MyArea", controller = "MyController", action = "MyAction" }, FormMethod.Post))
{
@Html.AntiForgeryToken()
<div class="modal-footer">
<input type="button" name="cancel" id="cancel" accesskey="c" class="btn btn-warning" data-dismiss="modal" value="Cancel" alt="Return" />
<input type="submit" name="start" id="start" accesskey="n" class="btn btn-primary" data-loading-text="Please Wait..." value="Continue" />
</div>
}
</div>
这很容易。提交时不需要数据解除属性。我使用的是MVC4,并且经常这样做:
<div id="mdlProceed" class="modal hide fade" data-backdrop="static" data-keyboard="false">
<div class="modal-header">
<h3>Header</h3>
</div>
<div class="modal-body">
Body
</div>
@using (Html.BeginForm(null, null,
new { area = "MyArea", controller = "MyController", action = "MyAction" }, FormMethod.Post))
{
@Html.AntiForgeryToken()
<div class="modal-footer">
<input type="button" name="cancel" id="cancel" accesskey="c" class="btn btn-warning" data-dismiss="modal" value="Cancel" alt="Return" />
<input type="submit" name="start" id="start" accesskey="n" class="btn btn-primary" data-loading-text="Please Wait..." value="Continue" />
</div>
}
</div>
我试过了,效果很好
<div style="width:800px" class="modal hide fade">
<div class="modal-header">Some header
</div>
<div class="modal-body">Some body
<input...... fields..... >
</div>
<div class="modal-footer">
<input class="btn btn-primary" value="Submit" onclick="SubmitData();">
<a href="#" class="btn" data-dismiss="modal" >Close</a>
</div>
</div>
我试过了,效果很好
<div style="width:800px" class="modal hide fade">
<div class="modal-header">Some header
</div>
<div class="modal-body">Some body
<input...... fields..... >
</div>
<div class="modal-footer">
<input class="btn btn-primary" value="Submit" onclick="SubmitData();">
<a href="#" class="btn" data-dismiss="modal" >Close</a>
</div>
</div>
将数据分配给链接或按钮将拦截该按钮的单击事件并防止其冒泡。如果在表单提交按钮上放置“数据驳回”,则不会触发实际提交操作,也不会提交表单
如果要通过AJAX提交表单,请让成功事件触发表单的撤销。如果你正在做一个传统的表单发布,不要担心会取消模式,因为页面会重新加载或重定向 将数据分配给链接或按钮将截获该按钮的单击事件并防止其冒泡。如果在表单提交按钮上放置“数据驳回”,则不会触发实际提交操作,也不会提交表单
如果要通过AJAX提交表单,请让成功事件触发表单的撤销。如果你正在做一个传统的表单发布,不要担心会取消模式,因为页面会重新加载或重定向 谢谢大家花时间回答。删除数据属性后工作。感谢大家花时间回答。删除数据属性后工作。这完全忽略了问题的重点,不确定它是如何被升级的。还有,这是什么onclick=SubmitData;什么事?至少它应该有type=submit…这完全没有抓住问题的关键,不知道它是如何被选中的。还有,这是什么onclick=SubmitData;什么事?至少它应该有type=submit。。。