如何使用Twitter的引导

时使用jQuery我从Twitter的引导是如下如何使用Twitter的引导

 <!-- Name Edit div --> 
<div id="form-content" class="modal hide fade in" tabindex="-1"> 
    <form name="form" action="<c:url value="/editname" />" method="post"> 
    <div class="modal-header"> 
     <h4>Edit Name</h4> 
    </div> 
    <div class="modal-body"> 
    <div class="control-group"> 
     <div class="controls"> 
      <ul class="nav nav-list"> 
      <li class="nav-header">First Name</li> 
      <li><input type="text" placeholder="First Name" name="firstName" id="firstName" class="input-xlarge help-inline"></li> 
      <li class="nav-header">Last Name</li> 
      <li><input type="text" placeholder="Last Name" name="lastName" id="lastName" class="input-xlarge help-inline"></li> 
     </ul> 
     </div> 
     </div> 
    </div> 
    <div class="modal-footer"> 
     <button id="submit" class="btn btn-success">Update</button> 
     <button class="btn" data-dismiss="modal" >Close</button> 
    </div> 
    </form> 
</div>

和我的AJAX脚本像如下模型对象来获取表单对象：

$(function() { 
    //twitter bootstrap script 
    $("button#submit").click(function(){ 
     var $form = $(this).closest("form").attr('id'); 
     $.ajax({ 
      type: $form.attr('method'), 
      url: $form.attr('action'), 
      data: $form.serialize(), 
      success: function(msg){ 
       $("#thanks").html(msg); 
       $("#form-content").modal('hide'); 
      }, 
      error: function(){ 
       //alert("failure"); 
      } 
     }); 
    }); 
});

但该请求不会触发。我检查了萤火虫，它看起来不能获得表单对象，并且请求不会发送给控制器。我怎样才能使它工作。将来我会在同一页面中使用多种表单。

来源

2013-02-20 Saurabh Kumar

我会建议你使用.submit()功能：

$(function() { 
    $('#form_id').submit(function(e) { 
     e.preventDefault(); 
     var form = $(this); 
     $.ajax({ 
      type: form.attr('method'), 
      url: form.attr('action'), 
      data: form.serialize(), 
      success: function(msg){ 
      $("#thanks").html(msg); 
      $("#form-content").modal('hide');  
      }, 
      error: function(){ 
      //alert("failure"); 
      } 
     }); 
    }); 
});

设置窗体ID的东西，改变javascript来匹配

您还可以添加一个data-ajax="true"所有要提交的表格然后使用：

var forms = $('form[data-ajax="true"]'); 
forms.submit(function(e){ 
    e.preventDefault(); 
    // do ajax 
});

来源

2013-02-20 11:09:39 oleron

<form name="form" action="<c:url value="/editname" />" method="post">

有一件事是，你没有给表单的ID。

var $ form = $（this）.closest（“form”）。attr（'id'）;

如果id存在（如果你通过代码添加它），那么上面的$form将包含表单的id。这是一个字符串。

因此，使用这样的，

var $form = $(this).closest("form");

代替

var $form = $(this).closest("form").attr('id');

来源

2013-02-20 11:01:33

我修改了它，但我得到了这个错误“客户端发送的请求在语法上不正确。”我正在使用Spring – 2013-02-20 12:08:59

你的形式不具有id属性。给它一个，它可能会工作。 so

var $form = $(this).closest("form").attr('id');

不会返回值。

来源

2013-02-20 11:03:29 Stevo

所有的HTML表单输入控件（输入，选择，按钮等）都有一个对其所有者的引用。这使得有可能做到：

var $form = $(this.form);

但我认为oleron's使用submit事件的回答是这样做的正确方法。

来源

2013-02-20 12:14:29 anddoutoi

如何使用Twitter的引导

回答

相关问题