0
我有一個小問題,我有一個引導驗證插件,也阿賈克斯後腳本引導的形式。我的問題是,我不知道如何設置一個條件,我要達到使提交按鈕。形成jQuery驗證,然後通過AJAX發送到PHP
我想設置我的提交按鈕默認是關閉的,如果所有的輸入將被填充(自舉驗證條件),則JavaScript可以讓點擊提交按鈕。
謝謝你的答案。
這裏是我的代碼:
<script>
jQuery(document).ready(function() {
jQuery('#requestquote').bootstrapValidator({
\t message: 'This value is not valid',
\t group: '.form-overenie',
feedbackIcons: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
name: {
message: 'Zadané meno nie je správne',
validators: {
notEmpty: {
message: 'Prosím zadajte svoje meno'
},
}
},
company: {
message: 'Zadaný názov je neplatný',
validators: {
notEmpty: {
message: 'Prosím napíšte názov spoločnosti'
},
}
},
phone: {
message: 'Zadané číslo je neplatné',
validators: {
\t stringLength: {
min: 9,
message: 'Zadané číslo je príliš krátke'
},
notEmpty: {
message: 'Prosím zadajte svoje telefónne číslo'
},
}
},
mailovaadresa: {
message: 'Zadaný email nie je správny',
validators: {
notEmpty: {
message: 'Prosím zadajte svoju emailovú adresu'
},
}
},
projecttype: {
message: 'Zadaný názov je neplatný',
validators: {
notEmpty: {
message: 'Prosím zadajte typ projektu'
},
}
},
budget: {
message: 'Zadaný názov je neplatný',
validators: {
notEmpty: {
message: 'Prosím zadajte približnú výšku rozpočtu'
},
}
},
projectdescription: {
validators: {
\t
}
},
}
});
});
jQuery(function() {
jQuery('#requestquote').unbind('submit').bind('submit', function (e) {
e.preventDefault();
jQuery.ajax({
type: 'post',
url: 'forms/requestquote.php',
data: jQuery('#requestquote').serialize(),
success: function() {
jQuery("#uspesne-odoslane").show();
jQuery(".formular-potvrdit").hide();
jQuery(".formular-riadok").hide();
jQuery(".formular-zavriet").hide();
}
});
});
});
</script>
<form id="requestquote" action="forms/requestquote.php" method="post" style="width:85%;margin:0 auto;">
\t <div class="formular-riadok">
<fieldset><div class="form-overenie" style="float:left;"><input type="text" name="name" placeholder="Meno" class="input-lava" /></div>
<div class="form-overenie" style="float:right;"><input type="text" name="company" placeholder="Spoločnosť" class="input-prava" /></div>
</div>
<div class="formular-riadok">
<div class="form-overenie" style="float:left;"><input type="text" name="phone" placeholder="Telefón" class="input-lava" /></div>
<div class="form-overenie" style="float:right;"><input type="email" name="mailovaadresa" placeholder="E-mail" class="input-prava" /></div>
</div>
<div class="formular-riadok">
<div class="form-overenie" style="float:left;"><select name="projecttype" class="input-lava" style="margin-bottom:30px;">
\t <option value="" disabled selected>Typ projektu</option>
\t <option value="webstranka">Web stránka</option>
\t <option value="eshop">E-shop</option>
\t <option value="portal">Portál</option>
\t <option value="forum">Fórum</option>
\t <option value="seo">SEO</option>
\t <option value="korporatnaidentita">Korporátna identita</option>
\t <option value="logo">Logo</option>
\t <option value="ine">Iné</option>
</select></div>
<div class="form-overenie" style="float:right;"><select name="budget" class="input-prava" style="margin-bottom:30px;">
\t <option value="" disabled selected>Rozpočet</option>
\t <option value="do500">do 500 €</option>
\t <option value="500az1000">500 € - 1 000 €</option>
\t <option value="1000az3000">1 000 € - 3 000 €</option>
\t <option value="3000az5000">3 000 € - 5 000 €</option>
\t <option value="5000az10000">5 000 € - 10 000 €</option>
\t <option value="10000az20000">10 000 € - 20 000 €</option>
\t <option value="nad20000">nad 20 000 €</option>
</select></div>
</div>
<div class="formular-riadok">
<div class="form-overenie" style="display:block;"><textarea name="projectdescription" placeholder="Stručný popis projektu" class="formular-textarea"></textarea></div>
</div>
<div class="formular-riadok" style="margin-top:30px;">
<span class="formular-zavriet" data-dismiss="modal">Zatvoriť</span>
<button type="submit" class="formular-potvrdit" disabled>Odoslať</button></fieldset>
</div>
<div id="uspesne-odoslane" data-dismiss="modal" hidden><h3><i class="fa fa-check-circle"></i>Správa bola úspešne odoslaná</h3></div>
</form>
我停用了提交按鈕,但是當我點擊SUMIT,阿賈克斯將發送數據,當任何輸入被填滿。
雖然我只有腳本的第一部分,但一切都正常(只有在每個輸入都已填充的情況下,它才允許我發送表單),但是當我添加一個Ajax時,如果只填充一個輸入,則會將表單發送給PHP ...