Зависимый выпадающий список jqgrid

Question

Мне нужно загрузить выпадающий список в зависимости от jqgrid.Вот часть моего кода (я использую MVC)

{ name: 'parIDUnidadMedida', index: 'parIDUnidadMedida', width: 80, align: 'center', editable: true, edittype: "select",
                    editrules: { required: true },
                    editoptions: {
                        multiple: false,
                        size: 1,
                        dataUrl: '@Url.Content("~/")' + 'CertificadoGarantiaExtendidaOpciones/ListarUnidadesMedida/',
                        buildSelect: function (data) {
                            var response = jQuery.parseJSON(data);
                            var s = '<select>';
                            if (response && response.length) {
                                for (var i = 0, l = response.length; i < l; i++) {
                                    var ri = response[i];
                                    s += '<option value="' + ri.Value + '">' + ri.Text + '</option>';
                                }
                            }
                            return s + "</select>";
                        },
                        dataEvents: [{
                            type: 'change',
                            fn: function (e) {
                                var varIDUnidadMedida = e.currentTarget.value;
                                newOptions = '';
                                var arrPlazos = $.ajax({
                                    url: '@Url.Content("~/")' + 'CertificadoGarantiaExtendidaOpciones/ListarPlazos/' + varIDUnidadMedida,
                                    async: false
                                }).responseText;

                                var response = jQuery.parseJSON(arrPlazos);
                                for (var i = 0; i < response.length; i++) {
                                    newOptions += '<option value="' + response[i].Value + '">' + response[i].Text + '</option>';
                                }

                                $('parPlazo').html(newOptions);
                            }
                        }]
                    }
                },
                { name: 'parPlazo', index: 'parPlazo', width: 80, align: 'center', editable: true, edittype: "select",
                    editrules: { required: true },
                    editoptions: {
                        multiple: false,
                        size: 1
                    }
                },

Как вы можете видеть, если parIDUnidadMedida выбирает изменение элемента управления, тогда parPlazo должен быть обновлен ...

Вы можете мне помочь??Я не знаю, как ее решить.

С уважением.

Answer 1

Хорошо ... после поиска ответа я получил его. Видите ли, я сделал несколько небольших исправлений, но основная причина, по которой он не работал, заключалась в том, что я никогда не загружал второй выпадающий список (parPlazo).Таким образом, у выбранного parPlazo не было идентификатора или имени.Очевидно, что это никогда не будет достигнуто

Вот код.Я надеюсь, это поможет вам.С уважением

{ name: 'parIDUnidadMedida', index: 'parIDUnidadMedida', width: 80, align: 'center', editable: true, edittype: "select",
                    editrules: { required: true },
                    editoptions: {
                        multiple: false,
                        size: 1,
                        dataUrl: '@Url.Content("~/")' + 'CertificadoGarantiaExtendidaOpciones/ListarUnidadesMedida/',
                        buildSelect: function (data) {
                            var response = jQuery.parseJSON(data);
                            var s = '<select>';
                            if (response && response.length) {
                                for (var i = 0, l = response.length; i < l; i++) {
                                    var ri = response[i];
                                    s += '<option value="' + ri.Value + '">' + ri.Text + '</option>';
                                }
                            }
                            return s + "</select>";
                        },
                        dataEvents: [{
                            type: 'change',
                            fn: function (e) {
                                var varIDUnidadMedida = e.currentTarget.value;
                                $.ajax({
                                    url: '@Url.Content("~/")' + 'CertificadoGarantiaExtendidaOpciones/ListarPlazos/' + varIDUnidadMedida,
                                    type: 'GET',
                                    success: function (PlazosJson) {
                                        var plazos = eval(PlazosJson);
                                        var plazosHtml = "";
                                        $(plazos).each(function (i, option) {
                                            plazosHtml += '<option value="' + option.Value + '">' + option.Text + '</option>';
                                        });

                                        // Poblar los datos
                                        if ($(e.target).is('.FormElement')) {
                                            // En caso de se formulario de edicion, añadir
                                            var form = $(e.target).closest('form.FormGrid');
                                            $("select#parPlazo.FormElement", form[0]).html(plazosHtml);
                                        } else {
                                            // Edicion de una linea
                                            var row = $(e.target).closest('tr.jqgrow');
                                            var rowId = row.attr('id');
                                            var rowId = jQuery("#grid").jqGrid('getGridParam', 'selrow');
                                            jQuery("select#" + rowId + "_parPlazo").append(plazosHtml);
                                        }
                                    }
                                });
                            }
                        }]
                    }
                },
                { name: 'parPlazo', index: 'parPlazo', width: 80, align: 'center', editable: true, edittype: "select",
                    editrules: { required: true },
                    editoptions: {
                        multiple: false,
                        size: 1,
                        dataUrl: '@Url.Content("~/")' + 'CertificadoGarantiaExtendidaOpciones/ListarPlazos/1',
                        buildSelect: function (data) {
                            var response = jQuery.parseJSON(data);
                            var s = '<select>';
                            if (response && response.length) {
                                for (var i = 0, l = response.length; i < l; i++) {
                                    var ri = response[i];
                                    s += '<option value="' + ri.Value + '">' + ri.Text + '</option>';
                                }
                            }
                            return s + "</select>";
                        }
                    }
                },