Ich versuche herauszufinden, warum das nicht funktioniert, ich möchte nicht einen Absenden Button klicken, es funktioniert, wenn ich einen habe, stattdessen verwende ich onchange="this.form.submit()"
und das Beiträge die Form wie es normalerweise, nicht AJAX Hintergrund Stil, ich habe nicht den Ajax Teil, ich habe es gefunden und es funktioniert für meine Situation, aber soweit ich weiß, $('#ajaxform').submit(function()
, submit ist submit? Warum ist onchange="this.form.submit()"
und <input type="submit" />
nicht die gleiche Art von submit? Was vermisse ich?Submit AJAX Post onchange
<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>
Können Sie Ihren erklärender Text bearbeiten, so können wir einen Sinn geben? Was willst du? Und was bekommst du stattdessen? –
Wenn ich 'onchange =" this.form.submit() "' aus meinen Eingabefeldern entferne und stattdessen eine Übergabeschaltfläche in meine Form einfüge, funktioniert alles wie es soll, es bekommt was ich will im Hintergrund und zeigt es wie AJAX würde jedoch mit der onchange-send-thing, tut es nicht den AJAX-Teil, es postet einfach das Formular, als ob es keinen AJAX gab, es lädt die Seite neu. @ChrisG –
Ich kann das bestätigen; scheinbar ruft 'submit()' auf dem Formular den "onsubmit" -Handler auf. Die Lösung besteht darin, den Ajax-Aufruf in eine Funktion zu verpacken und ihn in den 'onchange'-Handlern aufzurufen. https://developer.mozilla.org/en/docs/Web/API/HTMLFormElement/submit –