jquery – Twitter Bootstrap模态表单提交

前端之家收集整理的这篇文章主要介绍了jquery – Twitter Bootstrap模态表单提交前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我最近一直在使用 java / jboss进行叽叽.witter boot been.,and and and and……………………….

这种形式在模态本身是外在的,我根本无法弄明白这是怎么可能的

我已经尝试将模态本身添加到窗体中,尝试使用HTML5 form =“form_list”,甚至将窗体添加到模态体,并使用一些jquery强制提交,但没有任何显示工作

下面是一个示例模式,我试图增加我需要的,OK按钮以前编辑尝试调用jquery函数.

  1. <div class='modal small hide fade' id='myModal' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'>
  2. <div class='modal-header'>
  3. <button type='button' class='close' data-dismiss='modal' aria-hidden='true'>×</button>
  4. <h3 id='myModalLabel'>Delete Confirmation</h3>
  5. </div>
  6. <div class='modal-body'>
  7. <p class='error-text'>Are you sure you want to delete the user?</p>
  8. </div>");
  9. <div class='modal-footer'>
  10. <button class='btn btn-danger' data-dismiss='modal' aria-hidden='true'>Cancel</button>
  11. <button class='btn btn-success' data-dismiss='modal'>Ok</button>
  12. </div>
  13. </div>

解决方法

提交后要关闭模式吗?在窗体内部的模态或外部,你应该能够使用jQuery ajax来提交表单.

这里是一个模式中的形式的例子:

  1. <a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a>
  2.  
  3. <div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  4. <div class="modal-header">
  5. <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
  6. <h3 id="myModalLabel">Modal header</h3>
  7. </div>
  8. <div class="modal-body">
  9. <form id="myForm" method="post">
  10. <input type="hidden" value="hello" id="myField">
  11. <button id="myFormSubmit" type="submit">Submit</button>
  12. </form>
  13. </div>
  14. <div class="modal-footer">
  15. <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
  16. <button class="btn btn-primary">Save changes</button>
  17. </div>
  18. </div>

和jquery ajax获取表单域并提交..

  1. $('#myFormSubmit').click(function(e){
  2. e.preventDefault();
  3. alert($('#myField').val());
  4. /*
  5. $.post('http://path/to/post',$('#myForm').serialize(),function(data,status,xhr){
  6. // do something here with response;
  7. });
  8. */
  9. });

工作在Bootply:http://bootply.com/59864

猜你在找的jQuery相关文章