クローンされた要素の検証に問題があります。投稿されたコーディングの量にはお詫びしますが、私は最初からそれを入れてもよいと思いました。jQueryクローン検証
これは、元のDIVのサンプルである:
<div id="addDriver1" class="clonedInput">
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="<?= $editDriver; ?>">
<tr>
<td height="25" align="left" valign="top"><label for="driverReq" >Do you want to make this change or are
you looking for a quote only?</label></td>
<td height="25" align="left" valign="top" colspan="2"><select name="driverReq" id="driverReq">
<option selected="selected" value="">Please select</option>
<option value="Make Change" <? if ($_SESSION['driverReq']=="Make Change") { echo "selected";} ?> >Make Change</option>
<option value="Quote only" <? if ($_SESSION['driverReq']=="Quote only") { echo "selected";} ?>>Quote only</option>
</select></td>
</tr>
<tr>
<td height="5" colspan="3" ></td>
</tr>
<tr>
<td height="25" align="left" valign="top"><label for="driverDate" ;?>>What date would you like this change
to be effective from? </label></td>
<td height="25" align="left" valign="top"><input name="driverDate" type="text" id="driverDate" style="width: 75px;" value="<?=$_SESSION['driverDate']; ?>" /></td>
<td height="25" align="left" valign="top">(DD/MM/YYYY) </td>
</tr>
<tr>
<td height="5" colspan="3" ></td>
</tr>
</table></div>
これは、クローニング・スクリプトである:これは、新しいID、名前などを有するクローン化された要素を出力
$('#btnAddDriver').live('click',function() {
var num = $('.clonedInput').length; // how many "duplicatable" input fields we currently have
var newNum = new Number(num + 1); // the numeric ID of the new input field being added
// create the new element via clone(), and manipulate it's ID using newNum value
var newElem = $('#addDriver1').clone(true).attr('id', 'addDriver' + newNum);
newElem.prepend("<div class='subhead1'>Add a driver "+newNum+"</div>");
//newElem.find()
// insert the new element after the last "duplicatable" input field
$('#addDriver' + num).after(newElem);
//add the new ID to the inputs
newElem.find("*[id]").each(function() {
$(this).attr("id", $(this).attr("id") + newNum);
$(this).attr("name", $(this).attr("name") + newNum);
$(this).attr("value", $(this).attr("<?= $_SESSION['"+$(this).attr("name") + newNum+"']; ?>"));
});
newElem.find("label").each(function() {
$(this).attr("for", $(this).attr("for")+ newNum);
});
、「>など
これは私がしようとしている検証の一種である:
validateDriverReq2 = function(){
if(driverReq2.val()==""){
$(this).addClass("error");
driverReq2Info.html("Please confirm what you would like us to do with your request.<br>");
$("#driverReq2Info").addClass("errorTop");
//labelAddPC.addClass("labelError");
$("label[for='driverReq2']").addClass("labelError");
checkErrors();
topErrorDriver();
return false;
}
else{
driverReq2.removeClass("error");
driverReq2Info.html("");
driverReq2Info.removeClass("errorTop");
$("label[for='driverReq2']").removeClass("labelError");
checkErrors();
topErrorDriver();
return true;
}
}
driverReq2.blur(validateDriverReq2);
driverReq2.change(validateDriverReq2);
validateDriverReq = function(){
if(driverReq.val()==""){
$(this).addClass("error");
driverReqInfo.html("Please confirm what you would like us to do with your request.<br>");
$("#driverReqInfo").addClass("errorTop");
//labelAddPC.addClass("labelError");
$("label[for='driverReq']").addClass("labelError");
checkErrors();
topErrorDriver();
return false;
}
else{
driverReq.removeClass("error");
driverReqInfo.html("");
driverReqInfo.removeClass("errorTop");
$("label[for='driverReq']").removeClass("labelError");
checkErrors();
topErrorDriver();
return true;
}
}
// }
driverReq.blur(validateDriverReq);
driverReq.change(validateDriverReq);
は、フォームの他の地域でこのコードを使用して、それが正常に動作しますが、この検証が完全に台無しにされます。クローンされたdriverReq2を移動すると元のdriverReqのラベルがアクティブになり、エラーが表示されますが、driverReq2フィールド自体にエラーが正しく表示されます。変更やぼかしで自分自身を削除する
私は、変数をバインドしようとしましたが、フォーム名自体とその親div(例: #addDriver2)。
私は完全に夢中に
おかげ