设置html表单的选择输入

时间:2018-10-09 06:13:54

标签: javascript jquery jquery-select2

我尝试从使用select库的表单中选择特定的select2输入。 documentation写道:

  

要以编程方式为Select2控件选择一个选项/项目,请使用   jQuery .val()方法:

$('#mySelect2').val('1'); // Select the option with a value of '1'

因此,我尝试将输入设置为值0。但是,输入未更改。我想念的是什么?

$('.js-example-basic-single').select2({
  allowClear: true
});

var myFlag = 0;

$("#haslabel").val(myFlag);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/js/select2.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/css/select2.min.css" rel="stylesheet" />



<div class="row">
  <div class="col-md-12 col-sm-12">
    <form id="form1" class="form-horizontal" role="form">
      <fieldset>
        <div class="form-group">

          <div class="col-sm-12">
            <select class="js-example-basic-single js-states form-control" id="hasLabel" name="hasLabel">
              <option></option>
              <option value="1">yes</option>
              <option value="0">no</option>
            </select>
          </div>
        </div>
      </fieldset>
    </form>
  </div>
</div>

2 个答案:

答案 0 :(得分:1)

  1. 正确选择选择器
  2. 0和1为假和真-使用字符串
  3. val(“ 0”)设置该值,但除非触发更改以查看它,否则不会显示该值
  4. 或者选择<option value="0" selected>no</option>

注意 :要看不到...,您的选择必须足够宽

$(function() {
  $('#hasLabel').select2({allowClear: true});
  $('#hasLabel').val("0").trigger("change"); // set AND show
});
.js-states { width:70px}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/js/select2.full.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/css/select2.min.css" />

<div class="row">
  <div class="col-md-12 col-sm-12">
    <form id="form1" class="form-horizontal" role="form">
      <fieldset>
        <div class="form-group">

          <div class="col-sm-12">
            <select class="js-example-basic-single js-states form-control" id="hasLabel" name="hasLabel">
              <option></option>
              <option value="1">yes</option>
              <option value="0">no</option>
            </select>
          </div>
        </div>
      </fieldset>
    </form>
  </div>
</div>

答案 1 :(得分:0)

我一直在阅读您提供的文档,而我注意到的是:

  

Select2将在元素上监听更改事件   它连接到。当您需要进行任何外部更改时   反映在Select2中(例如更改值),则应触发   这个事件。

这意味着,当您以编程方式设置值时,需要手动触发“更改”,就像

<input id='bCode'type='text' value='barcode appears here'/>