Jeasyuiを使用してフォーム要素を作成していますが、jQueryDynamicFormを使用してフォーム内のいくつかの要素を複製する必要があります。
JS:
// generate combobox with jeasyui
$('#empPhoneType').combobox({
url: '<?=BASE_URL?>mdm/employee/contacttype?t=mail',
valueField:'id',
textField:'name'
});
// called to generate dynamic element
$('#phoneWrapper').dynamicForm('#phone-add', '#phone-remove', {limit:5});
HTML:
<form id="form">
<label for="empPhone">Telepon</label>
<div style="margin-bottom: 10px;" id="phoneWrapper">
<select id="empPhoneType" name="empPhoneType"></select>
<input type="text" id="empPhone" name="empPhone"/>
</div>
<a href="#" id="phone-remove">[ - ] </a>
<a href="#" id="phone-add">[ + ]</a>
</form>
コードを実行すると、要素が複製されますが、次のエラーが発生します。
TypeError:idAttrは未定義です。newIdAttr = idAttr.slice(0、-1)+インデックス、
しかし、初期化jeasyui >> $('#empPhoneType')を削除すると、要素が複製され、エラーは発生しませんでした
誰かが私を助けることができますか?
わかりました、問題を解決しました。問題は、dynamic-form.js
関数normalizeClone()
内でループする各関数formFields
( "input、checkbox、select、textarea")を実行することにあります。
ループするformFields
と、要素IDをキャッチしようとする変数があります。ただし、要素にIDがない場合の処理はありません。そのため、要素にIDがない場合は、ハンドラーを処理に配置します。
元の機能:
elmnt.find(formFields).each(function(){
var that = $(this);
var idAttrs = that.attr("id");
var nameAttr = that.attr("name");
var origNameAttr = that.attr("origname");
var newIdAttr = idAttrs.slice(0, -1) + index;
match = matchRegEx.exec(nameAttr);
if (idAttrs) {
that.attr("name", match[1]+index+match[3]);
that.attr("origid", idAttrs);
elmnt.find("label[for='"+idAttrs+"']").each(function(){
$(this).attr("for", newIdAttr);
});
that.attr("id", newIdAttr);
}
});
関数へのハンドラーの追加:
elmnt.find(formFields).each(function(){
var that = $(this);
var idAttrs = that.attr("id");
if (idAttrs) {
var nameAttr = that.attr("name");
var origNameAttr = that.attr("origname") || idAttrs.slice(0, -1);
var newIdAttr = idAttrs.slice(0, -1) + index;
match = matchRegEx.exec(nameAttr);
if(match)
that.attr("name", match[1]+index+match[3]);
that.attr("origid", idAttrs);
elmnt.find("label[for='"+idAttrs+"']").each(function(){
$(this).attr("for", newIdAttr);
});
that.attr("id", newIdAttr);
}
});