jqGrid 편집 양식의 종속 선택 상자 옵션
jqGrid를 사용하면 양식 편집을 위한 동적 선택 상자를 만들 수 있습니다. 관련 선택 상자에서 이루어진 선택입니다. 이는 국가를 선택하고 그에 따라 주 옵션을 채우는 등의 시나리오에 유용합니다.
문제: 잘못된 옵션 값
그러나 동적으로 채워진 상태 선택 상자. 상태 선택 상자의 옵션 값은 예상 값인 5 대신 0부터 시작합니다.
해결책: 편집 옵션 재설정 및 수동 재구성
이 문제를 해결하려면 핵심은 jqGrid가 초기화 시 편집 옵션을 한 번만 사용한다는 것을 이해하는 것입니다. 선택한 국가에 따라 상태 선택 상자를 올바르게 채우려면 편집 옵션을 재설정하고 선택 상자를 수동으로 다시 작성해야 합니다.
솔루션 구현 방법은 다음과 같습니다.
편집 옵션 재설정:
데이터 변경:
선택 상자 다시 작성:
상태 값 유지:
코드 조각:
<code class="javascript">// Reset the editoptions for the state select box var resetStatesValues = function () { grid.setColProp('State', { editoptions: { value: states}}); }; // Build new options for the state select box based on the selected country var changeStateSelect = function (countryId, countryElem) { var sc = statesOfCountry[countryId]; var newOptions = '<option value="">All</option>'; // If needed for (stateId in sc) { newOptions += '<option value="' + stateId + '">' + states[stateId] + '</option>'; } grid.setColProp('State', { editoptions: { value: statesOfCountry[countryId]} }); if ($(countryElem).is('.FormElement')) { // Form editing $(countryElem).closest('form.FormGrid').find("select#state.FormElement").html(newOptions); } else { // Inline editing var row = $(countryElem).closest('tr.jqgrow'); var rowId = row.attr('id'); $("select#" + rowId + "_State", row[0]).html(newOptions); } };</code>
결론
편집 옵션을 재설정하고, 상태 선택 상자를 수동으로 다시 작성하고, 선택한 상태 값을 유지함으로써 다음을 수행할 수 있습니다. jqGrid의 편집 양식에 종속 선택 상자에 대한 올바른 옵션 값이 표시되는지 확인하세요.
위 내용은 편집 중에 jqGrid 종속 선택 상자에서 잘못된 옵션 값을 수정하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!