在下拉更改时显示引导模式表单，并在插入数据库后选择该值

Question

我有一个包含2个Select2元素的表单。我已经编码，当值=其他时，在下拉更改中显示引导表单。我还成功地插入到数据库中，并以下拉选择2选项的形式返回值。

但我想知道，我如何才能只在触发它的下拉列表中选择该值，即Dropdown1或dropdown2。因为两个下拉列表具有相同的值。

<script>
$(document).ready(function(){   
$("#myform").submit(function(event){
submitForm();
return false;
});
});
function submitForm(){
$.ajax({
type: "POST",
url: "<?php echo base_url().'index.php?purchaser/create_firm/';?>",
data: $('form#myform').serialize(),
dataType: "json", 
success: function (data) {
var newOption = new Option(data.name, data.id, true, true);
$('#select1').append(newOption1).trigger('change');         
$("#myModal").modal('hide');
}, 
error: function(xhr, status, error) {
alert(xhr.responseText);
}
});
}
</script>

更新的HTML代码

<div class="form-group">
<div class="col-md-3">
<label>From </label>
<select class="form-control select2" style="width:100%;" name="from" id="select1" required >
<option value="">Select Seller Firm</option>
<?php $query=$this->db->get('firm_master')->result_array(); foreach($query as $row):?>
<option value="<?php echo $row['id']?>"><?php echo ucwords($row['name'].', '.$row['district']);?></option>
<?php endforeach;?>
<option value="other">Other</option>
</select>
</div>
<div class="col-md-3">
<label>To</label>
<select class="form-control select2" style="width:100%;"  name="to" id="select2" required >
<option value="">Select Seller Firm</option>
<?php $query=$this->db->get('firm_master')->result_array(); foreach($query as $row):?>
<option value="<?php echo $row['id']?>"><?php echo ucwords($row['name'].', '.$row['district']);?></option>
<?php endforeach;?>
</select>
</div>
</div>
<div class="form-group">
<div class="col-md-3">
<label>Purchase Order Number</label>
<select class="form-control select3" name="order_number" id="po" style="width:100%;">
<option value="">Select Purchase Order</option>
<?php $query=$this->db->get('purchase_order')->result_array(); foreach($query as $row):?>
<option value="<?php echo $row['id']?>"><?php echo ucwords($row['pinvoice_no']);?></option>
<?php endforeach;?>
</select>
</div>  
<div class="col-md-3">
<label>Weight (in KG)</label>
<input type="number" class="form-control" id="weight" name="weight" required />
</div>  
</div>  
<div class="form-group">
<div class="col-md-3">
<label>Rate (Per KG)</label>
<input type="text" class="form-control" name="rate" id="rate" required />
</div>  
<div class="col-md-3">
<label>Due Date</label>
<input type="text" class="form-control datepicker" name="due_dated" />
</div>                              
</div>
<div class="form-group">
<div class="col-md-3">
<label>Mediator Name</label>
<select class="form-control select2" style="width:100%;"  name="firm" required >
<?php $query=$this->db->get('firm_master')->result_array(); foreach($query as $row):?>
<option value="<?php echo $row['id'];?>"><?php echo ucwords($row['name']);?></option>
<?php endforeach;?></select>
</div>  
<div class="col-md-3">
<label>Material</label>
<input type="text" class="form-control" name="material" required />
</div>                          
</div>

Answer 1

也许您的change回调应该查看event.target属性，并将其id属性保存为表单上的datatriggered_by(或类似的(属性。然后您的表单将知道涉及哪个select元素。

然后它就像

var select = $(`#{$("form#myform").data("triggered_by")}`);
select.val(data.id);