jQuery Select2에서 선택한 값을 프로그래밍 방식으로 설정하는 방법은 무엇입니까?

jQuery Select2의 선택 값을 설정하는 방법은 무엇입니까?

jQuery Select2는 선택 요소의 유용성을 향상시키는 인기 있는 플러그인입니다. 유용한 기능 중 하나는 선택한 값을 프로그래밍 방식으로 설정하는 기능입니다. 이는 초기 페이지 로드 시 또는 이전에 저장된 선택 항목을 편집할 때 사전 정의된 값을 표시해야 하는 시나리오에서 특히 유용할 수 있습니다.

Select2 < V4

1단계: HTML 마크업

선택한 값을 보관하기 위해 숨겨진 입력 필드를 포함합니다.

<code class="html"><input type="hidden" name="mySelect2" id="mySelect2"></h3>
<p><strong>2단계: Select2 인스턴스 생성</strong></p>
<p>적절한 옵션을 사용하여 Select2를 초기화합니다.</p>
<pre class="brush:php;toolbar:false"><code class="js">$("#mySelect2").select2({
  placeholder: "My Select 2",
  multiple: false,
  minimumInputLength: 1,
  ajax: {
    url: "/elements/all",
    dataType: 'json',
    quietMillis: 250,
    data: function(term, page) {
      return {
        q: term,
      };
    },
    results: function(data, page) {
      return { results: data };
    },
    cache: true
  },
  formatResult: function(element){
    return element.text + ' (' + element.id + ')';
  },
  formatSelection: function(element){
    return element.text + ' (' + element.id + ')';
  },
  escapeMarkup: function(m) {
    return m;
  }
});</code>

3단계: 원하는 값 설정

선택한 값을 설정하는 data() 메서드:

<code class="js">$("#mySelect2").select2('data', { id: "elementID", text: "Hello!"  });</code>

Select2 V4

HTML 사용

Select2 v4의 경우 선택 요소에 대한 옵션 선택:

<code class="html"><select id="myMultipleSelect2" multiple="" name="myMultipleSelect2[]">
    <option value="TheID" selected="selected">The text</option>
</select></code>

jQuery 사용

<code class="js">var $newOption = $("<option selected='selected'></option>").val("TheID").text("The text");
$("#myMultipleSelect2").append($newOption).trigger('change');</code>

직접 값 설정

<code class="js">$("#myMultipleSelect2").val(5).trigger('change');</code>

위 내용은 jQuery Select2에서 선택한 값을 프로그래밍 방식으로 설정하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!