i have 2 forms in one page
Html
<form id="form-step1" action="">
<div id="fstep1">
<div class="form-group">
<label class="control-label">Ich suche</label>
<select name="produktgruppe" class="sselect"
data-validation="required"
data-validation-error-msg="Bitte wählen Sie eine Gruppe aus">
<option></option>
<option value="1">Büromöbel</option>
<option value="2">Büro- & Schreibwaren</option>
<option value="3">Druckerzubehör</option>
<option value="4">Geschenkartikel</option>
<option value="0">sonstiges</option>
</select>
</div>
<div class="form-group">
<label class="control-label">Genaue Beschreibung</label>
<textarea name="beschreibung" id="beschreibung" class="stextarea"
data-validation="length"
data-validation-length="min30"
data-validation-error-msg="Bitte ausführlicher Beschreiben"></textarea>
</div>
<div class="form-group">
<label class="control-label">Menge</label>
<input data-validation="required" class="sinput"
data-validation-error-msg="Bitte geben Sie eine Menge / Umfang an"
type="text" name="menge" value="" />
</div>
<br>
<input type="submit" id="formsubmt" value="weiter" class="button" /></form>
</div>
<div id="fstep2">
<form id="form-step2" action="">
<div class="form-group">
<label class="control-label">Umkreis festlegen</label>
<select name="umkreis" class="sselect"
data-validation="required"
data-validation-error-msg="Bitte wählen Sie aus">
<option></option>
<option value="LO">lokal</option>
<option value="RE">regional</option>
<option value="LW">landesweit</option>
</select>
</div>
<div class="form-group">
<label class="control-label">Ihre E-Mail</label>
<input type="text" name="email" class="server sinput"
data-validation="server" data-validation-url="/ajx/check_email.php" />
</div>
<div class="form-group">
<label class="control-label">Ihre Postleitzahl (Plz, nur Deutschland!)</label>
<input data-validation="required" class="sinput"
data-validation-error-msg="Bitte geben Sie Ihre Plz an"
data-validation="length number" data-validation-allowing="range[00001;99999]"
data-validation-length="min5"
type="text" name="plz" value="" />
</div>
<br>
<input type="submit" id="formsubmt" value="weiter" class="button" /></form>
</div>
Javascript
$.validate({'."
form : '#form-step1',
onSuccess : function() {
$('#fstep1').css('display', 'none');
$('#fstep2').css('display', 'block');
return false;
}
});
$.validate({
form : '#form-step2',
modules : 'security',
onModulesLoaded : function() {
alert('los');
$('#fstep2').css('display', 'none');
$('#fstep3').css('display', 'block');
return false;
}
});
At first the first form should checked, after that and all is ok, the second one should check.
At the moment the second check already starts at loading the page and i dont know why.
Hope someone can help me for that.