[英]HTML Form with javascript not working - AJAX POST data is not sending to PHP
Javascript代碼:
$("#musteriEkleBtn").on("click", function(){
var zp = $("#musteriEkleForm").serialize();
$.ajax({
url: "tsettings/islem.php?islem=mKayit",
type: "POST",
data: zp,
success: function(cevap){
$("#musteriEkleAlertSuccess").html(cevap).hide().fadeIn(700);
}
});
});
Html 表單示例:
<form id="musteriEkleForm" method="POST">
<li>
<label>Adınız :</label>
<input placeholder="Adınızı yazın." type="text" name="musteri_isim">
<i class="zirvepin-icon zirvepin-user"></i>
</li>
<li class="zirvepin">
<input id="musteriEkleBtn" type="submit">Register</input>
</li>
</form>
此 html 輸入提交按鈕不起作用,如何使此代碼起作用?
所以表單數據需要訪問islem.php文件,但是表單數據不會去islem.php。
islem.php 文件:
if(g('islem') == 'mKayit') {
echo"<script type='text/javascript'> alert('Evet Çalışıyor'); </script>";
}
感謝所有幫助我解決這個問題的人,感謝通過 stackexchange fix 幫助解決問題的朋友。
如果您遇到同樣的問題,我會留下一個對您有用的代碼,多虧了這段代碼,您將擺脫困境:
$("#musteriKayitForm").submit(function(event){
var istek;
// Verileri güvenli bir şekilde savun. Varsayılan gönderimi kontrol et.
event.preventDefault();
// Bekleyen istekleri iptal et.
if (istek) {
istek.abort();
}
// Bazı yerel değişkenleri burada kuruyorum.
var $form = $(this);
// Tüm alanları seçip önbelleğe alıyorum.
var $inputs = $form.find("input, select, button, textarea");
// Verileri formda serileştir
var serializedData = $form.serialize();
// Ajax talebinin süresi için girdileri devre dışı bırakalım.
// Not: form verilerinin serileştirilmesinden sonra öğeleri devre dışı bırakırız.
// Devre dışı form öğeleri serileştirilmeyecektir.
$inputs.prop("disabled", true);
$.ajax({
type: 'post',
url: 'tsettings/islem.php?islem=mKayit',
data: serializedData,
success: function(cevap){ $("#musteriKayitAlertSuccess").html(cevap).hide().fadeIn(700); }
});
// Başarıya çağrılacak geri arama işleyicisi
istek.done(function (response, textStatus, jqXHR){
// Konsola mesaj gönder
console.log("Hooray, it worked!");
});
// Arızada çağrılacak geri arama işleyicisi
istek.fail(function (jqXHR, textStatus, errorThrown){
// Hatası konsola kaydet
console.error(
"The following error occurred: "+
textStatus, errorThrown
);
});
// İstenmeden çağrılacak geri arama işleyicisi
// İstek başarısız oldu veya başarılı olduysa
istek.always(function () {
// Girişleri etkinleştir
$inputs.prop("disabled", false);
});
});
正如Barmar所說,你應該使用event.preventDefault()
這樣表單就不會提交給自己, Javascript將能夠完成他的工作。
感謝所有幫助我解決這個問題的人,感謝通過 stackexchange fix 幫助解決問題的朋友。
如果您遇到同樣的問題,我會留下一個對您有用的代碼,多虧了這段代碼,您將擺脫困境:
$("#musteriKayitForm").submit(function(event){
var istek;
// Verileri güvenli bir şekilde savun. Varsayılan gönderimi kontrol et.
event.preventDefault();
// Bekleyen istekleri iptal et.
if (istek) {
istek.abort();
}
// Bazı yerel değişkenleri burada kuruyorum.
var $form = $(this);
// Tüm alanları seçip önbelleğe alıyorum.
var $inputs = $form.find("input, select, button, textarea");
// Verileri formda serileştir
var serializedData = $form.serialize();
// Ajax talebinin süresi için girdileri devre dışı bırakalım.
// Not: form verilerinin serileştirilmesinden sonra öğeleri devre dışı bırakırız.
// Devre dışı form öğeleri serileştirilmeyecektir.
$inputs.prop("disabled", true);
$.ajax({
type: 'post',
url: 'tsettings/islem.php?islem=mKayit',
data: serializedData,
success: function(cevap){ $("#musteriKayitAlertSuccess").html(cevap).hide().fadeIn(700); }
});
// Başarıya çağrılacak geri arama işleyicisi
istek.done(function (response, textStatus, jqXHR){
// Konsola mesaj gönder
console.log("Hooray, it worked!");
});
// Arızada çağrılacak geri arama işleyicisi
istek.fail(function (jqXHR, textStatus, errorThrown){
// Hatası konsola kaydet
console.error(
"The following error occurred: "+
textStatus, errorThrown
);
});
// İstenmeden çağrılacak geri arama işleyicisi
// İstek başarısız oldu veya başarılı olduysa
istek.always(function () {
// Girişleri etkinleştir
$inputs.prop("disabled", false);
});
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.