Author Topic: When option is selected in editor - value is displayed, id not binding to id col  (Read 3218 times)

Mohammed Nayeem

  • Newbie
  • *
  • Posts: 5
    • View Profile
Below is the code have used to bind select for editor, when option is selected in editor, the values is binded in SGROUPNAME, instead of text and SGROUPCODE code is not updated as in demo page inline editing - editors validators example, am i missing anything

Code: [Select]
var obj = {
                    width: 965,
                    maxWidth: 965,
                    height: 300,
                    columnBorders: true,
                    wrap: false, hwrap: false,
                    showTitle: false,
                    collapsible: false,
                    selectionModel: { type: 'cell', mode: 'single' },
                    trackModel: { on: true }, //to turn on the track changes.     
                    virtualX: true,
                    editModel: {
                        saveKey: $.ui.keyCode.ENTER,
                        //filterKeys: false,
                        keyUpDown: true,
                        cellBorderWidth: 0
                    },
                    editor: { select: true },                   
                    toolbar: {
                        items: [
                            { type: '<span style="margin-right:630px">Asset Details</span>' },
                            {
                                type: 'button',
                                style: 'padding:5px;',
                                label: "Add New",
                                attr: 'id="btnNewCapex"',
                                icon: 'ui-icon-circle-plus',
                                listeners: [{
                                    "click": function (evt) {
                                        if ($('#ddlGroup').prop('selectedIndex') <= 0) { Notify('Please select group first', 4); $('#ddlGroup').focus(); return false; }
                                        var rowdata = { UNITPRICE: 0, NOOFUNITS: 1, FC: 0, EXRATE: 0, TOTAL: 0 };
                                        var rowIndx = $grid.pqGrid("addRow", { rowData: rowdata });
                                    }
                                }],
                            },
                            { type: 'separator' },
                            {
                                type: 'button', icon: 'ui-icon-arrowreturn-1-s', label: 'Undo', style: 'padding:5px;', cls: 'changes', listener:
                                  {
                                      "click": function (evt, ui) {
                                          $grid.pqGrid("history", { method: 'undo' });
                                      }
                                  },
                                options: { disabled: true }
                            },
                            { type: 'separator' },
                            {
                                type: 'button', icon: 'ui-icon-arrowrefresh-1-s', label: 'Redo', style: 'padding:5px;', listener:
                                  {
                                      "click": function (evt, ui) {
                                          $grid.pqGrid("history", { method: 'redo' });
                                      }
                                  },
                                options: { disabled: true }
                            },
                        ]
                    }
                };
                obj.colModel = [
                    { title: "PKID", dataIndx: "PKID", hidden: false },
                    { title: "GroupCode", dataIndx: "SGROUPCODE", hidden: false },
                    {
                       title: "Sub Group", dataIndx: "SGROUPNAME", width: 200,
                        editor: {
                            type: 'select',                           
                            valueIndx: "code",
                            labelIndx: "name",
                            mapIndices: { name: "SGROUPNAME", code: "SGROUPCODE" },
                            options: [
                                { code: "120", name: "TRUCK MIXER" },
                                { code: "121", name: "CONCRETE PUMP" }
                            ]
                        },
                        validations: [{ type: 'minLen', value: 1, msg: "Required" }]
                    },
                    { title: "Unit Price", dataIndx: "UNITPRICE", width: 70, align: 'center', dataType: 'float' },
                    { title: "No Of Units", dataIndx: "NOOFUNITS", width: 80, align: 'center', dataType: 'integer' },
                    { title: "Freight / Customs", dataIndx: "FC", width: 110, align: 'center', dataType: 'float' },
                    { title: "Exchange Rate", dataIndx: "EXRATE", width: 100, align: 'center', dataType: 'float' },
                    { title: "Total", dataIndx: "TOTAL", width: 150, align: 'center', editable: false, dataType: 'float' },
                    { title: '', minWidth: 40, maxWidth: 40, align: 'center', editable: false, render: function (ui) { return "<button type='button' class='delete_btn'>Delete</button>" } }
                ];
                obj.dataModel = {
                    location: "remote",
                    dataType: "JSON",
                    method: "GET",
                    url: requestpath + "Master/MasterHandler.ashx?q=GET_CAPEX_DETAILS&id=" + pkid,
                    getData: function (dataJSON) { return { curPage: dataJSON.curPage, totalRecords: dataJSON.totalRecords, data: dataJSON.data }; }
                }
                var $grid = $("#gdvCapexDetails").pqGrid(obj);

                $grid.on('pqgridrefresh pqgridrefreshrow', function () {
                    var $grid = $(this);
                    //delete button
                    $grid.find("button.delete_btn").button({ icons: { primary: 'ui-icon-trash' }, text: false }).css('width', '20px').css('padding', '1px').css('height', '20px')
                    .unbind("click")
                    .bind("click", function (evt) {
                        var $tr = $(this).closest("tr");
                        var rowIndx = $grid.pqGrid("getRowIndx", { $tr: $tr }).rowIndxPage;
                        $grid.pqGrid("deleteRow", { rowIndx: rowIndx });
                        return false;
                    });
                });

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6310
    • View Profile
Apparently your code looks fine.

Could you share a jsfiddle.
« Last Edit: December 14, 2018, 07:20:45 am by paramquery »