默认情况下,“子项选择”下拉列表在“选择任何一项

时间:2020-02-13 20:39:46

标签: javascript jquery laravel-6

更改菜单显示选项后如何将“第二个下拉菜单”更改为选择父菜单?

$(function() {
  $('select').change(function(evt) {
    console.log($('select option:selected').data('check'));
    //$('select option:selected').data('check') ? $('#ifYes').show() : $('#ifYes').hide();
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
  If I change the Menu Display automatically parent menu will be chaged?
</div>
<br>
<div class="form-group">
  <label for="exampleInputEmail1">Menu Display</label>
  <select name="status" class="form-control ">
    <option value="1">Top Menu</option>
    <option data-check="true" value="2">Sub Menu</option>
    <option value="0">Footer Menu</option>
  </select>
</div>

<div class="form-group " id="ifYes" style="">
  <label for="parent_id">Parent Menu</label>
  <select class="form-control  rest" name="parent_id" id="parent_id">
    <option value="0">select Menu</option>
    <option value="1">one</option>
    <option value="2">Two</option>
  </select>
</div>

https://jsfiddle.net/Neeraj1005/cmhfd8sz/11/

1 个答案:

答案 0 :(得分:0)

您可以trigger更改如下事件

$('select[name="status"]').change(function(evt) {
    var value = $('select option:selected').val();
    
    $('#parent_id').val(value).trigger('change');
  });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
  If I change the Menu Display automatically parent menu will be chaged?
</div>
<br>
<div class="form-group">
  <label for="exampleInputEmail1">Menu Display</label>
  <select name="status" class="form-control ">
    <option value="1">Top Menu</option>
    <option data-check="true" value="2">Sub Menu</option>
    <option value="0">Footer Menu</option>
  </select>
</div>

<div class="form-group " id="ifYes" style="">
  <label for="parent_id">Parent Menu</label>
  <select class="form-control  rest" name="parent_id" id="parent_id">
    <option value="0">select Menu</option>
    <option value="1">one</option>
    <option value="2">Two</option>
  </select>
</div>