JqGrid를 사용하여 select2 드롭다운의 선택된 값을 변경하려면 어떻게 해야 합니까?

JqGrid를 사용하여 select2 드롭다운의 선택된 값을 변경하려면 어떻게 해야 합니까?

올레그의 select2 데모를 사용하고 있는데 드롭다운 메뉴에서 현재 선택된 값을 변경할 수 있는지 궁금합니다.

" 예들어개", " 의값다 4같이음다과면로를드된,같다면"인 경우,"Any", "Fruit", "Vegetable", "Meat"은 " " " 입니다."Any"가 어떻게 을 가어그바것수꿀있까니겠습을제게떻?까▁that니있습으로 바꿀 수 있을까요?"Fruit"에서 JqGrid는loadComplete?

이것이 가능합니까?

select2 버전 >= 4.0.0

다른 솔루션은 작동하지 않을 수 있지만 다음 예제는 작동해야 합니다.

솔루션 1: select2를 포함하여 연결된 모든 변경 이벤트를 트리거합니다.

$('select').val('1').trigger('change');

솔루션 2: JUST select2 변경 이벤트가 트리거되도록 합니다.

$('select').val('1').trigger('change.select2');

이러한 예는 이 jsfidle을 참조하십시오.솔루션 2의 @minlare에게 감사드립니다.

설명:

사람들의 이름으로 가장 친한 친구를 뽑았다고 칩시다.따라서 Bob, Bill 및 John(이 예에서는 값이 이름과 동일하다고 가정함).먼저 선택 항목에서 select2를 초기화합니다.

$('#my-best-friend').select2();

이제 브라우저에서 수동으로 Bob을 선택합니다.다음에 밥은 장난을 치고 저는 그를 더 이상 좋아하지 않습니다.그래서 시스템은 나를 위해 밥을 선택 해제합니다.

$('#my-best-friend').val('').trigger('change');

또는 시스템이 목록에서 Bob 대신 다음을 선택하도록 합니다.

// I have assume you can write code to select the next guy in the list
$('#my-best-friend').val('Bill').trigger('change');  

다른 사용자에게 유용할 수 있는 Select 2 웹 사이트의 참고 사항(사용되지 않는 방법 및 제거된 방법 참조)

.select2sval')"val" 방법은 더 이상 사용되지 않으며 Select 24.1에서 제거될 예정입니다.더 이상 사용되지 않는 메서드에는 triggerChange 파라미터가 포함되지 않습니다.

대신 기본 요소에서 .val을 직접 호출해야 합니다.두 번째 파라미터(triggerChange)가 필요한 경우 요소에서 .trigger("변경")도 호출해야 합니다.

$('select').val('1').trigger('change'); // instead of $('select').select2('val', '1');

아래의 select2 docs를 사용하여 값을 가져오거나 설정합니다.

$("#select").select2("val"); //get the value
$("#select").select2("val", "CA"); //set the value

@PanPipes는 이것이 4.x에 대해 바뀌었다고 지적했습니다(아래에서 그에게 투표하세요).val이제 직접 호출됩니다.

$("#select").val("CA");

그서내는서 에서.loadCompletevalue를 할 수 있습니다.jqGrid와 selectbox value를 할 수 .

문서의 통지

이 메서드를 사용하려면 옵션에서 initSelection 함수를 정의해야 합니다. 그러면 Select2는 val()에서 전달하는 개체의 ID를 선택을 렌더링하는 데 필요한 전체 개체로 변환하는 방법을 알 수 있습니다.선택 요소에 연결하는 경우 이 기능이 이미 제공됩니다.

this.$("#yourSelector").select2("data", { id: 1, text: "Some Text" });

이것은 도움이 될 것입니다.

이것은 훨씬 더 쉬울 것입니다.

$("#e1").select2("val", ["View" ,"Modify"]);

그러나 전달한 값이 HTML에 이미 있는지 확인합니다.

새 항목을 추가하려는 경우value='newValue'그리고.text='newLabel'이 코드를 추가해야 합니다.

1. 새 옵션 추가<select>:

   var opt = "<option value='newValue' selected ='selected'>" + newLabel+ " </option>";
   $(selLocationID).html(opt);
   

2. 트리거<select>선택한 값으로 변경:

   $(selLocationID).val('newValue').trigger("change");
   

두 번째 답을 추가하고 싶었을 뿐입니다.선택 항목을 이미 선택 항목 2로 렌더링한 경우 다음과 같이 선택 항목에 반영해야 합니다.

$("#s2id_originalSelectId").select2("val", "value to select");

두 가지 옵션이 있습니다. @PanPipes 답변에 따르면 다음을 수행할 수 있습니다.

$(element).val(val).trigger('change');

이것은 변경 이벤트에 바인딩된 사용자 지정 작업이 없는 경우에만 허용되는 솔루션입니다.이 상황에서 제가 사용하는 해결책은 select2에 표시된 select2를 업데이트하는 select2 특정 이벤트를 트리거하는 것입니다.

$(element).val(val).trigger('change.select2');

select2에서 선택한 String 옵션을 설정하는 데 문제가 있습니다.

옵션 "option string1 /option" 사용 시:

$('#select').val("string1").change(); 

그러나 값이 "E"인 옵션이 있는 경우: 옵션 값 "E" string1 /option:

$('#select').val("E").change(); // you must enter the Value instead of the string

이것이 같은 문제로 어려움을 겪고 있는 누군가에게 도움이 되기를 바랍니다.

단일 값을 선택하려면 다음을 사용합니다.$('#select').val(1).change()

여러 값을 선택하려면 배열에 값을 설정하여 이 코드를 사용할 수 있습니다.$('#select').val([1,2,3]).change()

V4의 경우 Select2의 값과 드롭다운의 텍스트 표현을 모두 변경하려면 Select2를 선택합니다.

var intValueOfFruit = 1;
var selectOption = new Option("Fruit", intValueOfFruit, true, true);
$('#select').append(selectOption).trigger('change');

이렇게 하면 Select2의 텍스트 표시뿐만 아니라 장면 뒤의 값도 설정됩니다.

https://select2.github.io/announcements-4.0.html#removed-methods 에서 삭제됨

이 일을 하라.

 $('select#id').val(selectYear).select2();

내 예상 코드:

$('#my-select').val('').change();

유용한 것에 대해 @PanPipes 덕분에 완벽하게 작동합니다.

만약 당신이 아약스 데이터 소스를 가지고 있다면 무료 버그를 위해 이것을 참조하십시오.

https://select2.org/programmatic-control/add-select-clear-items

Select2 컨트롤 설정

$('#mySelect2').select2({
    ajax: {
        url: '/api/students'
    }
});

미리 선택한 항목 가져오기 및 컨트롤에 추가

var studentSelect = $('#mySelect2');
$.ajax({
    type: 'GET',
    url: '/api/students/s/' + studentId
}).then(function (data) {
    // create the option and append to Select2
    var option = new Option(data.full_name, data.id, true, true);
    studentSelect.append(option).trigger('change');

    // manually trigger the `select2:select` event
    studentSelect.trigger({
        type: 'select2:select',
        params: {
            data: data
        }
    });
});

드롭다운 목록에서 텍스트를 알고 값을 모를 때 선택한 항목을 설정하려면 다음 예를 참조하십시오.

시간대를 파악하고 설정하려고 하지만 값이time_zone_id그들 안에.

        var timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;
        var $select2 = $('#time-zone');
        var selected = $select2.find("option:contains('"+timeZone+"')").val();
        $select2.val(selected).trigger('change.select2'); 

단순히 get/set 방법을 사용하여 값을 설정할 수 있습니다.

$("#select").select2("val"); //get the value
$("#select").select2("val", "CA"); //set the value

또는 다음을 수행할 수 있습니다.

$('#select').val("E").change(); // you must enter the Value instead of the string

// Set up the Select2 control
$('#mySelect2').select2({
    ajax: {
        url: '/api/students'
    }
});

// Fetch the preselected item, and add to the control
var studentSelect = $('#mySelect2');
$.ajax({
    type: 'GET',
    url: '/api/students/s/' + studentId
}).then(function (data) {
    // create the option and append to Select2
    var option = new Option(data.full_name, data.id, true, true);
    studentSelect.append(option).trigger('change');

    // manually trigger the `select2:select` event
    studentSelect.trigger({
        type: 'select2:select',
        params: {
            data: data
        }
    });
});

글꼴 : 2개의 설명서를 선택합니다.

언급URL : https://stackoverflow.com/questions/19639951/how-do-i-change-selected-value-of-select2-dropdown-with-jqgrid