如果填充了所有文本框并且在前一行中更改了select
,我创建了一个克隆其最后一行的表。我试图添加一个条件,如果已经在之前的行中选择了新的下拉选项,则应禁用它们。
禁用选项代码:
$('select').change(function() {
var value = $(this).val();
$(this).siblings('select').children('option').each(function() {
if ( $(this).val() === value ) {
$(this).attr('disabled', true).siblings().removeAttr('disabled');
}
});
});
Full JS:
$('#results').append('<table width="100%" border="1" cellspacing="0" cellpadding="5" id="productanddates" class="border"> <tr><td> <input type="text" name="to1" id="to1" value="" /> </td> <td> <select class="dd" name="Phonenumberdd1" id="Phonenumberdd1"> <option value="test">test </option><option value="test2">test 2</option></select></td> <td> <input type="text" name="renewal_by1" id="renewal_by1" /> </td> <td> <input type="text" name="Renivaul_to1" id="Renivaul_to1" value="" /> </td></TR></TABLE>'
);
$('select').change(function() {
var value = $(this).val();
$(this).siblings('select').children('option').each(function() {
if ( $(this).val() === value ) {
$(this).attr('disabled', true).siblings().removeAttr('disabled');
}
});
});
$('#results').on('focus', ':input', function() {
$(this).closest('tr').filter(function() {
return !$(this).data('saved');
})
.find(':input').each(function() {
$(this).data('value', this.value);
$(this).closest('tr').data('saved', true);
});
})
.on('input change', ':input', function() {
$(this).data('filled', this.value != $(this).data('value'))
var tr = $(this).closest('tr');
all = tr.find(':input'),
fld = all.filter(function() {
return $(this).data('filled');
});
if( all.length == fld.length ) {
if( !tr.data('done') ) {
$('#buttonclck')[0].click();
tr.data('done', true);
}
} else {
if( tr.data('done') ) {
tr.data('done', false);
}
}
});
$('#buttonclck').on('click', function () {
var lastRow = $('#productanddates').closest('#productanddates').find("tr:last-child");
var lastRowInputs = lastRow.find('input');
var isClone = false;
lastRowInputs.each(function() {
if($(this).val().length) {
isClone = true;
}
});
if(!isClone)
return false;
var cloned = lastRow.clone();
cloned.find('input, select').each(function () {
var id = $(this).attr('id');
var regIdMatch = /^(.+)(\d+)$/;
var aIdParts = id.match(regIdMatch);
var newId = aIdParts[1] + (parseInt(aIdParts[2], 10) + 1);
$(this).attr('id', newId);
$(this).attr('name', newId);
});
cloned.find("input[type='text']").val('');
cloned.insertAfter(lastRow);
});
HTML:
<div id="results"></div>
<input id="buttonclck" type="button" class="hide" value="button"/>