Mengapakah nilai pilihan kotak pilihan Negeri tidak betul dalam borang edit jqGrid saya?

Linda Hamilton
Lepaskan: 2024-11-01 12:56:02
asal
405 orang telah melayarinya

Why are the State select box option values incorrect in my jqGrid edit form?

jqgrid salah pilih nilai pilihan lungsur turun dalam kotak edit

Walaupun memilih nilai Negara dan Negeri dengan betul dalam bentuk edit, nilai pilihan dipaparkan dalam kotak pilih Negeri tidak betul apabila borang diedit. Isu ini berterusan walaupun apabila beralih kembali ke negara UK selepas memilih negara AS.

Cara menyelesaikan nilai pilihan yang salah dalam kotak pilihan Negeri

Untuk menyelesaikan isu ini, adalah perlu dengan betul isikan kotak pilihan Negeri berdasarkan nilai Negara yang dipilih apabila borang edit dimuatkan. Pendekatan ini melibatkan:

  1. Mengisi nilai Negeri berdasarkan pemilihan Negara dalam fungsi dataInit.
  2. Membina semula kotak pilih Negeri jika Negara ditukar.

Penyelesaian Kod

<code class="javascript">var countries = { '1': 'US', '2': 'UK' };
var states = { '1': 'Alabama', '2': 'California', '3': 'Florida', '4': 'Hawaii', '5': 'London', '6': 'Oxford' };
var statesOfCountry = {
    1: { '1': 'Alabama', '2': 'California', '3': 'Florida', '4': 'Hawaii' },
    2: { '5': 'London', '6': 'Oxford' }
};

var resetStatesValues = function () {
    grid.setColProp('State', { editoptions: { value: states} });
};

$("#list").jqGrid({
    data: mydata,
    datatype: 'local',
    colModel: [
        { name: 'Name', width: 200 },
        { 
            name: 'Country', 
            width: 100, 
            editable: true, 
            formatter: 'select',
            edittype: 'select', 
            editoptions: {
                value: countries,
                dataInit: function (elem) {
                    setStateValues($(elem).val());
                },
                dataEvents: [
                    { type: 'change', fn: function (e) { changeStateSelect($(e.target).val(), e.target); } },
                    { type: 'keyup', fn: function (e) { $(e.target).trigger('change'); } }
                ]
            }
        },
        {
            name: 'State', 
            width: 100, 
            editable: true, 
            formatter: 'select',
            edittype: 'select', 
            editoptions: { value: states }
        }
    ],
    onSelectRow: function (id) {
        if (id &amp;&amp; id !== lastSel) {
            if (lastSel != -1) {
                resetStatesValues();
                grid.restoreRow(lastSel);
            }
            lastSel = id;
        }
    },
    ondblClickRow: function (id, ri, ci) {
        if (id &amp;&amp; id !== lastSel) {
            grid.restoreRow(lastSel);
            lastSel = id;
        }
        resetStatesValues();
        grid.editRow(id, true, null, null, 'clientArray', null,
                        function (rowid, response) {  // aftersavefunc
                            grid.setColProp('State', { editoptions: { value: states} });
                        });
        return;
    },
    editurl: 'clientArray',
    sortname: 'Name',
    height: '100%',
    viewrecords: true,
    rownumbers: true,
    sortorder: "desc",
    pager: '#pager',
    caption: "Demonstrate dependend select/dropdown lists (edit on double-click)"
}).jqGrid('navGrid','#pager', 
          { edit: true, add: true, del: false, search: false, refresh: false },
          { // edit options
              recreateForm:true,
              onClose:function() {
                  resetStatesValues();
              }
          },
          { // add options
              recreateForm:true,
              onClose:function() {
                  resetStatesValues();
              }
          });</code>
Salin selepas log masuk

Nota

  • Kaedah grid.setColProp(...) digunakan untuk menetapkan sifat lajur.
  • DataInit fungsi digunakan untuk memulakan kotak pilih dan mengisinya dengan pilihan.
  • Tatasusunan dataEvents digunakan untuk melampirkan pengendali acara pada kotak pilihan.

Atas ialah kandungan terperinci Mengapakah nilai pilihan kotak pilihan Negeri tidak betul dalam borang edit jqGrid saya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan