如何验证克隆下拉列表,其中将选择下拉列表,该选项将被禁用到其他下拉列表中?
Html代码
<form id="surveyForm" method="post" class="form-horizontal">
<div class="form-group" id="surveyTemplate">
<label class="col-xs-3 control-label">Options</label>
<div class="col-xs-5">
<select class="form-control user" name="employee[]">
<option></option>
<option value="1">Martin Luther</option>
<option value="2">Mark Glovo</option>
<option value="3">Michael Sei</option>
</select>
</div>
<div class="col-xs-4">
<button type="button" class="btn btn-default addButton"><i class="fa fa-plus"></i>
</button>
</div>
</div>
<div class="form-group">
<div class="col-xs-5 col-xs-offset-3">
<button type="submit" class="btn btn-default">Submit</button>
</div>
</div>
</form>
Jquery代码
$('#surveyForm').on('click', '.addButton', function() {
var template = $('#surveyTemplate'),
clone = template
.clone()
.removeAttr('id')
.insertBefore($template),
$employee = clone.find('[name="employee[]"]');
$('#surveyForm').formValidation('addField', employee);
});
$("#surveyForm").on('change', '.user', function() {
var value = $(this).val();
$(this).find("option[value =" + value + "]").attr('disabled', false);
$("select").not(this).find("option[value =" + value + "]").attr('disabled', true);
});
请注意,当我点击“添加”按钮时,它会添加此表单的副本。