[英]Submit AJAX Post onchange
I'm trying to figure out why this isn't working, I don't want to have a submit button to click, It does work if I have one though, instead I use onchange="this.form.submit()"
and that posts the form as it normally would, not AJAX background style, I didn't code the ajax part, I found it and made it work for my situation, but as far as I know $('#ajaxform').submit(function ()
, submit is submit? Why isn't onchange="this.form.submit()"
and <input type="submit" />
the same type of submit? What am I missing? 我试图弄清楚为什么它不起作用,我不想单击一个提交按钮,但是如果我有一个按钮,它确实起作用,而是使用
onchange="this.form.submit()"
并且以正常方式发布表单,而不是AJAX背景样式,我没有编写ajax部分的代码,而是找到它并使之适合我的情况,但据我所知$('#ajaxform').submit(function ()
,提交是提交吗?为什么onchange="this.form.submit()"
和<input type="submit" />
不是同一类型的提交?我还缺少什么?
<form method="post" action="~/getAJAX.cshtml" id="ajaxform" name="form">
@* -------- Div to hold form elements -------- *@
<div class="reportDateDiv">
@* -------- Text --------- *@
<a class="blackColor fSize18 RPtxt">Reporting Period</a>
@* -------- Start day box -------- *@
<input type="text" name="inputDate" spellcheck="false" class="datepickerS metricDateTextbox capitalFirst"
onchange="this.form.submit()" value="@inputDate" autocomplete="off" placeholder="@placeholderStartDate.ToString("MMM d, yyyy")" readonly="readonly" />
@* -------- Text --------- *@
<a class="blackColor fSize16 RPtxt RPtxtTo">to</a>
@* -------- End day box --------- *@
<input type="text" name="endDate" spellcheck="false" class="datepickerE metricDateTextbox capitalFirst"
onchange="this.form.submit()" value="@endDate" autocomplete="off" placeholder="@noEndDate.ToString("MMM d, yyyy")" readonly="readonly" />
</div>
</form>
<script type="text/javascript">
$('#ajaxform').submit(function () { // catch the form's submit event
$.ajax({ // create an AJAX call...
data: $(this).serialize(), // get the form data
type: $(this).attr('method'), // GET or POST
url: $(this).attr('action'), // the file to call
success: function (response) { // on success..
$('#here').html(response); // update the DIV
}
});
return false; // cancel original event to prevent form submitting
});
</script>
Use this in your form: 在您的表单中使用它:
<input ... onchange="mySubmit(this.form)" ... >
Change the script to this: 将脚本更改为此:
function mySubmit(theForm) {
$.ajax({ // create an AJAX call...
data: $(theForm).serialize(), // get the form data
type: $(theForm).attr('method'), // GET or POST
url: $(theForm).attr('action'), // the file to call
success: function (response) { // on success..
$('#here').html(response); // update the DIV
}
});
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.