I have to clone a group of objects inside a div tag. After they are cloned, then all of the objects inside the div tag are initialized using jEasy calls. The process works but extremely slow in IE and only bearable using chrome. Is there a faster way to clone or initialize a group of JEasy objects?
HTML code:
<div id=cloneMe0>
<div>
<label id="CurrentProductNumberLabel0" class="textbox-label">Current Product Number</label>
<input name="CurrentProductNumber0" id="CurrentProductNumber0" class="textbox etextbox" type="text" maxlength="50" />
</div>
<div>
<label id="ProductDescriptionLabel0" class="textbox-label">Product Name<a href="javascript:niente();" name="helpText" data-helpid="4"><i class="fa fa-info-circle" aria-hidden="true"></i></a></label>
<textarea id="ProductDescription0" name="ProductDescription0" style="height: 118px" data-options="multiline:true" class="textarea etextbox"></textarea>
</div>
<div>
<label id="QuantityPerCaseLabel0" class="textbox-label">Quantity Per Case</label>
<input id="QuantityPerCase0" name="QuantityPerCase0" class="textbox enumberbox" />
</div>
<div>
<label id="EstimatedProductionDateLabel0" class="textbox-label">Estimated Production Date</label>
<input id="EstimatedProductionDate0" name="EstimatedProductionDate0" class="textbox edatebox" />
</div>
<div>
<table id="dg-Components0" title="" class="edatagrid" style="height: 240px"
toolbar="#toolbar"
rownumbers="false" singleselect="true" striped="true" remotesort="false">
<thead>
<th field="ComponentBuyer_Name" width="200" sortable="true">Buyer</th>
<th field="ComponentEngineer_Name" width="200" sortable="true">Engineer</th>
<th field="OldComponentNumber" width="200" sortable="true">Old Component Number</th>
<th field="ComponentDescription" width="334" sortable="true">Component Description</th>
<th field="Niente" width="500"> </th>
</thead>
</table>
</div>
</div>
JQuery with JEasy code:
var cloneIndex = 1;
$("#cloneMe0").clone()
.appendTo("#someParents")
.attr("id", "cloneMe" + cloneIndex)
.addClass("cloneProductComponent")
.find("*")
.each(function () {
var id = this.id || "";
var match = id.match(regex) || [];
if (match.length == 3) {
var strid = match[1];
var strname;
strid = strid.replace(/^0+|0+$/g, "") + (cloneIndex);
if (this.name == undefined) {
strname = strid;
} else {
strname = this.name;
}
strname = strname.replace(/^0+|0+$/g, "") + (cloneIndex);
this.id = strid;
this.name = strname;
if ($(this).hasClass("etextbox")) {
$(this).textbox();
}
if ($(this).hasClass("enumberbox")) {
$(this).numberbox({ groupSeparator: ',' });
}
if ($(this).hasClass("enumarictextbox")) {
$(this).textbox();
}
if ($(this).hasClass("ecurrencybox")) {
$(this).numberbox({ precision: 2, groupSeparator: ',', decimalSeparator: '.', prefix: '$' });
}
if ($(this).hasClass("ecomboboxProductType")) {
$(this).combobox({
data: FormMeta['FormMeta14'],
panelHeight: 'auto',
valueField: 'id',
textField: 'text'
});
}
if ($(this).hasClass("ecomboboxProductBuyer")) {
$(this).combobox({
data: FormMeta['FormMeta12'],
panelHeight: 'auto',
valueField: 'id',
textField: 'text'
});
}
if ($(this).hasClass("ecomboboxComponentBuyer")) {
$(this).combobox({
data: FormMeta['FormMeta12'],
panelHeight: 'auto',
valueField: 'id',
textField: 'text'
});
}
if ($(this).hasClass("ecomboboxComponentEngineer")) {
$(this).combobox({
data: FormMeta['FormMeta13'],
panelHeight: 'auto',
valueField: 'id',
textField: 'text'
});
}
if ($(this).hasClass("edatebox")) {
if ($(this).hasClass("eArtWorkReqDate")) {
$(this).datebox({
onChange: function (newDate, oldDate) {
if (newDate != null) {
if (newDate.length > 0 && oldDate != newDate) {
if (Date.parse(newDate) && clickSelected) {
addNewNote(newDate, oldDate, 'ArtRequireDate', strname);
}
}
}
},
editable: false,
validateOnCreate: false
});
} else {
$(this).datebox({ editable: false });
}
}
if ($(this).find('a').attr("name") == "helpText") {
buildFieldHelp($(this).find('a[name=helpText]'));
}
if ($(this).hasClass("edatagrid")) {
$(this).datagrid({
onSelect: function (index, row) {
populateComponentForm(index, row, cloneIndex);
},
rowStyler: function (index, row) {
if (row.isvalid == false) {
return 'background-color:#ffa8a8;color:#4a4a4a;';
}
}
});
} }
});
