如何在最近文本字段验证时获取所选下拉列表的值

Question

我在每一行都有一个下拉列表和相关的文本框。根据在下拉列表中选择的值，我必须验证textbox的值。我需要获取每一行的下拉值。

例如，dropdown id将是select id="i-re-type-0"、select id="i-re-type-1"等。

​

console.log('Value of nearest : ' + $(element).closest('.row .enabled-options').find('.ref-type-select').text());

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="row">
  <div class="span5 enabled-options">
    <select id="i-re-type-0" class="span4 ref-type-select" name="i-re-type">
      <option data-maxchars="500" value="">Select reference...</option>
      <option data-type="text" data-validation="required" value="AES">AES</option>
      <option data-type="text" data-validation="required" value="FRT">FRT</option>
      <option data-type="text" data-validation="required" value="VTY">VTY</option>
    </select>
    <div class="hide disabled-options"></div>
  </div>
  <div class="span11">
    <input id="i-ref-val-0" class="validateRefe required" type="text" title="Reference" value="" name="i.ref[***]" style="">
  </div>
</div>

​

Answer 1

​

 $( ".ref-type-select" ).change(function() {
      var textValue = $(this).closest('.row').find(".validateRefe").val();
      var drpValue = $(this).val();
    
      $(this).closest('.row').find(".validateRefe").val(drpValue )
    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="row">
  <div class="span5 enabled-options">
    <select id="i-re-type-0" class="span4 ref-type-select" name="i-re-type">
      <option data-maxchars="500" value="">Select reference...</option>
      <option data-type="text" data-validation="required" value="AES">AES</option>
      <option data-type="text" data-validation="required" value="FRT">FRT</option>
      <option data-type="text" data-validation="required" value="VTY">VTY</option>
    </select>
    <div class="hide disabled-options"></div>
  </div>
  <div class="span11">
    <input id="i-ref-val-0" class="validateRefe required" type="text" title="Reference" value="" name="i.ref[***]" style="">
  </div>
</div>

​