/ / JQuery Validate AJAX> undefined n'a pas de propriétés - jquery, html, ajax, forms

JQuery Validate AJAX> undefined n'a pas de propriétés - jquery, html, ajax, forms

Désolé, je l'ai posté avant d'avoir terminé le texte entier.

J'obtiens une erreur après avoir cliqué sur le bouton SOUMETTRE:

ERREUR

TypeError: undefined has no properties
[Weitere Informationen]
jquery.validate.min.js:4:22946
a.ajax
https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/jquery.validate.min.js:4:22946
submitHandler
http://suedsicht-projekte.de/opus/newsletter-daten/landingpage/js/main.js:13:7
d
https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/jquery.validate.min.js:4:962
validate/<
https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/jquery.validate.min.js:4:1173
dispatch
https://code.jquery.com/jquery-3.2.1.slim.min.js:3:10499
add/q.handle
https://code.jquery.com/jquery-3.2.1.slim.min.js:3:8561

le script a fonctionné sur un autre site. Mais cette fois ça ne marche pas :(

JS

$(document).ready(function(){
$("#teilnahme").validate({
rules: {
inputVorname: { required: true }
},
messages: {
inputVorname: { required: "Bitte tragen Sie Ihren Vornamen ein." }
},
submitHandler: function(form) {
theUrl = "teilnahme.php";
var params = $(form).serialize();

$.ajax ({
type: "POST",
url: theUrl,
data: params,
processData: false,
async: false,
success: function(result) {
$("#sendbutton").fadeOut(100).hide(function(){
$("#successbutton").fadeIn(100).show(function(){
$(".result").html(data);
});
});
}
});
}
}); //end validate
});

Travail de validation. Mais le submitHandler ne le fait pas

HTML

<form accept-charset="utf-8" method="post" name="teilnahme" id="teilnahme">
<div class="form-row">
<div class="form-group col-md-6">
<label for="inputVorname">Vorname</label>
<input type="text" class="form-control" id="inputVorname" name="inputVorname" placeholder="Vorname">
</div>
<div class="form-group col-md-6">
<label for="inputNachname">Nachname</label>
<input type="text" class="form-control" id="inputNachname" name="inputNachname" placeholder="Nachname">
</div>
</div>
<div class="form-group">
<label for="inputFirm">Firma</label>
<input type="text" class="form-control" id="inputFirm" name="inputFirm" placeholder="Firma">
</div>
<div class="form-group">
<label for="inputAddress">Address 2</label>
<input type="text" class="form-control" id="inputAddress" name="inputAddress" placeholder="Straße">
</div>
<div class="form-row">
<div class="form-group col-md-2">
<label for="inputPLZ">Postleitzahl</label>
<input type="text" class="form-control" id="inputPLZ" name="inputPLZ">
</div>
<div class="form-group col-md-6">
<label for="inputCity">Stadt</label>
<input type="text" class="form-control" id="inputCity" name="inputCity">
</div>
<div class="form-group col-md-4">
<label for="inputState">Bundesland</label>
<select id="inputState" name="inputState" class="form-control">
<option selected>Baden-Württemberg</option>
<option>...</option>
</select>
</div>
</div>
<div class="custom-control custom-radio">
<input type="radio" id="customRadio1" name="customRadio" class="custom-control-input">
<label class="custom-control-label" for="customRadio1">2 Übernachtungen, Anreise am Vortag</label>
</div>
<div class="custom-control custom-radio">
<input type="radio" id="customRadio2" name="customRadio" class="custom-control-input">
<label class="custom-control-label" for="customRadio2">1 Übernachtung, Anreise am 27.04</label>
</div>
<div class="custom-control custom-radio">
<input type="radio" id="customRadio3" name="customRadio" class="custom-control-input">
<label class="custom-control-label" for="customRadio3">1 Übernachtung</label>
</div>
<div class="custom-control custom-radio">
<input type="radio" id="customRadio4" name="customRadio" class="custom-control-input">
<label class="custom-control-label" for="customRadio4">Ohne Übernachtung</label>
</div>
<button type="submit" id="sendbutton" class="btn btn-success">Teilnehmen</button>
<button class="btn btn-success" id="successbutton" disabled="disabled"><span class="glyphicon glyphicon-ok" aria-hidden="true"></span></button>
</form>

Je devais expliquer plus ... Alors je veux un formulaire simple.Si je clique sur le bouton Soumettre, toutes les informations doivent aller dans le "teilnahme.php" où un script php importera tout dans une base de données mySQL. Il existe peut-être une autre solution pour cela. Je n'ai aucune idée.

Réponses:

2 pour la réponse № 1

Je remarque dans votre message d'erreur une référence à jQuery slim:

https://code.jquery.com/jquery-3.2.1.slim.min.js

jQuery slim n'inclut pas $ .ajax () ni aucune autre fonction associée.

Si vous souhaitez utiliser la fonctionnalité ajax, vous devez utiliser la version complète de jQuery.

Consultez les dernières notes de version (au moment de la rédaction de cet article) pour plus de détails sur ce qui est inclus ou non dans la version "slim": https://blog.jquery.com/2017/03/20/jquery-3-2-1-now-available/