Livevalidierung durch Javascript (Submit nach LV invalid deaktiviert)
Hallo zusammen,
ich nutze für die Validierung der Formularfelder auf einer Homepagen die Livevalidation von http://livevalidation.com.
Die Livevalidierung funktioniert auch wie gewünscht. Wenn alle Felder "valide" sind kann ich das Formular auch absenden.
Allerdings habe ich das Problem, dass wenn mindestens noch ein Feld noch "LV_invalid" ist und ich das Formular mittels dem "Submit"-Button absenden will. Dadurch wird dem Button noch ein zusätzliches class-Element "loading disabled" und das Attribut disabled="disabled" hinzugefügt. Dadurch ist es nach diesem Vorgang nicht mehr möglich das Formular erneut abzusenden (auch wenn die Eingaben korrigiert wurden und alle Felder "valide" sind).
Hier noch mein Javascript:
Wie kann ich erreichen, dass die Attribute wieder von dem "Submit"-Element entfernt werden, sobald wieder alle Felder "LV_valide" sind?
Danke & Gruß
Feder
ich nutze für die Validierung der Formularfelder auf einer Homepagen die Livevalidation von http://livevalidation.com.
Die Livevalidierung funktioniert auch wie gewünscht. Wenn alle Felder "valide" sind kann ich das Formular auch absenden.
Allerdings habe ich das Problem, dass wenn mindestens noch ein Feld noch "LV_invalid" ist und ich das Formular mittels dem "Submit"-Button absenden will. Dadurch wird dem Button noch ein zusätzliches class-Element "loading disabled" und das Attribut disabled="disabled" hinzugefügt. Dadurch ist es nach diesem Vorgang nicht mehr möglich das Formular erneut abzusenden (auch wenn die Eingaben korrigiert wurden und alle Felder "valide" sind).
<input type="submit" value="Kundendaten abschicken" class="submit submit_once loading disabled" disabled="disabled">
Hier noch mein Javascript:
<script type="text/javascript">
var firstName = new LiveValidation('firstName');
var lastName = new LiveValidation('lastName');
var firm = new LiveValidation('firm');
var ustid = new LiveValidation('ustid');
firstName.add(Validate.Presence);
lastName.add(Validate.Presence);
var selection = document.getElementById('salutation');
selection.onchange = function () {
if (this.value == "f")
{
var AttDisp1 = document.createAttribute("style");
var AttDisp2 = document.createAttribute("style");
AttDisp1.nodeValue = "display: inline";
AttDisp2.nodeValue = "display: inline";
document.getElementById("firmReg1").setAttributeNode(AttDisp1);
document.getElementById("firmReg2").setAttributeNode(AttDisp2);
firm.enable();
ustid.enable();
firm.add(Validate.Presence);
ustid.add(Validate.Presence);
ustid.add(Validate.Length, { is: 12 } );
}
else if (this.value != "f")
{
document.getElementById("firmReg1").removeAttribute("style");
document.getElementById("firmReg2").removeAttribute("style");
firm.disable();
ustid.disable();
}
}
</script>
Danke & Gruß
Feder
Bitte markiere auch die Kommentare, die zur Lösung des Beitrags beigetragen haben
Content-ID: 265727
Url: https://administrator.de/contentid/265727
Ausgedruckt am: 05.11.2024 um 10:11 Uhr
4 Kommentare
Neuester Kommentar
Hallo @chef1568,
schonmal mit den leuten von Livevalidation kontakt aufgenommen? Die wären da die besseren Ansprechpartner.
Gruß,
@Snowman25
schonmal mit den leuten von Livevalidation kontakt aufgenommen? Die wären da die besseren Ansprechpartner.
Gruß,
@Snowman25
Beispiel
Gruß jodel32
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Live Validation Demo</title>
</head>
<script type="text/javascript" src="http://livevalidation.com/javascripts/src/1.3/livevalidation_standalone.compressed.js"></script>
<script type="text/javascript">
function init(){
var valName = new LiveValidation('txtName',{
onInvalid: function(){document.getElementById('btnSubmit').setAttribute('disabled','disabled');},
onValid: function(){document.getElementById('btnSubmit').removeAttribute('disabled');}
});
valName.add(Validate.Presence);
valName.add(Validate.Format,{pattern: /jodel/i});
}
</script>
<body onLoad="init()">
<form name="form1" method="get" action="demo_live_validation.html">
<p>
<label for="btnName">Ihren Namen eingeben:</label>
<input type="text" name="txtName" id="txtName">
<span style="font-size:small">Hier 'jodel' eingeben</span>
</p>
<p>
<input type="submit" name="btnSubmit" id="btnSubmit" value="Abschicken">
</p>
</form>
</body>
</html>