テンプレートウィザードフォームプラグインを使用しています。テンプレートウィザードで選択したクラスで必須のクラスが動作しません
selectは、そのオプション値をページのロードイベントに動的に追加します。 私はselect
に必要なクラスを追加している私は
、すべてのテキストボックス内の任意の値を充填し、(0)を選択し、デフォルトを維持することなく、すべてのデフォルトの検証を次のボタンをクリックすると、「このフェイルドが必要です。」
このプラグインは、すべてのテキストボックスの上部に表示されますが、select
(カテゴリフィールド)では機能しません。
助けてください!
HTML
<form class="form-horizontal" id="form" onsubmit="return validateform()" method='post' action="./?action=savebookdetails" class="wizard-big">
<h1>Book Details</h1>
<fieldset>
... ...
<div class="form-group">
<label class="col-sm-3 control-label">ISBN *</label>
<div class="col-sm-9">
<input name="isbn" id="isbn" value="<?php if($result != '') echo $result->isbn; ?>" type="text" class="form-control only-numbers required" maxlength="11">
</div>
</div>
<div class="form-group" id="dob">
<label class="col-sm-3 control-label">Category *</label>
<div class="col-sm-9">
<select class="form-control required" onchange="fetchsubcategories(this.value)" id="category" name="category">
<option value="0">Select</option>
</select>
</div>
</div>
</fieldset>
</form>
jqueryので
$("#wizard").steps();
$("#form").steps({
bodyTag: "fieldset",
onStepChanging: function(event, currentIndex, newIndex) {
if (currentIndex > newIndex) {
return true;
}
var form = $(this);
if (currentIndex < newIndex) {
$(".body:eq(" + newIndex + ") label.error", form).remove();
$(".body:eq(" + newIndex + ") .error", form).removeClass("error");
}
form.validate().settings.ignore = ":disabled,:hidden";
return form.valid();
},
onStepChanged: function(event, currentIndex, priorIndex) {
if (currentIndex === 2 && priorIndex === 3) {
$(this).steps("previous");
}
},
onFinishing: function(event, currentIndex) {
var form = $(this);
form.validate().settings.ignore = ":disabled";
return form.valid();
},
onFinished: function(event, currentIndex) {
var form = $(this);
form.submit();
},
onCanceled: function(event) {
window.history.go(-1);
}
}).validate({
errorPlacement: function(error, element) {
element.before(error);
}
});
使用しているプラグイン?作業用のコードスニペットやフィドルを追加して不要なコードを取り除いたほうがよいでしょう。(質問に含まれていないphpとfetchsubcategories関数を参照してください) –
私はhttp://www.jquery-steps.com/を使っています例#垂直プラグイン – Nida