如何使用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");
}
});
});
});
但该请求不会触发。我检查了萤火虫,它看起来不能获得表单对象,并且请求不会发送给控制器。我怎样才能使它工作。将来我会在同一页面中使用多种表单。
答
我会建议你使用.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
});
答
<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');
答
你的形式不具有id属性。给它一个,它可能会工作。 so
var $form = $(this).closest("form").attr('id');
不会返回值。
答
所有的HTML表单输入控件(输入,选择,按钮等)都有一个对其所有者的引用。这使得有可能做到:
var $form = $(this.form);
但我认为oleron's使用submit
事件的回答是这样做的正确方法。
我修改了它,但我得到了这个错误“客户端发送的请求在语法上不正确。”我正在使用Spring – 2013-02-20 12:08:59