Messages

1

Bug Report / Re: Editable Checkbox in row when groupModel is enabled. v5.3 TypeError: n is undef

« on: August 28, 2018, 09:18:36 pm »

Hopefully I'm not missing something obvious, but using the example you noted: For example you group by ShipCountry (no group check boxes needed) and you have a checkbox on the Paid column to mark and post the item as paid. The example code below does not capture true and throws the TypeError.
My apologies in advance if I'm not understanding the usage of a checkbox in a grouped grid.


$(function () {       
        var colM = [           
            { title: "Customer Name", width: 130, dataIndx: "ContactName" },
                                      {
                           title: "Paid",
                           width: 220,                         
                           dataIndx: "Paid",
                           type: 'checkbox',
                           cbId: 'chk',
                           useLabel: true
                        }         ,
                        //column to store checkbox state of ProductName.
                        {
                           dataIndx: 'chk',
                           dataType: 'bool',
                           cb: { header: true },
                           hidden: false,
                           editable: function(ui){                           
                              //to make checkboxes editable selectively.
                              return true;
                           }
                  },   
            { title: "ShipCountry", width: 120, dataIndx: "ShipCountry" },           
            { title: "Freight", width: 120, format: '$##,###.00',
                summary: {
                    type: "sum"
                },
                dataType: "float", dataIndx: "Freight"
            },
            { title: "Shipping Via", width: 130, dataIndx: "ShipVia" },
          { title: "Shipped Date", width: 100, dataIndx: "ShippedDate", dataType: "date" },
            { width: 100, dataIndx: "OrderID" },
            { title: "Shipping City", width: 130, dataIndx: "ShipCity" }
      ];
        var dataModel = {
            location: "remote",
            dataType: "JSON",
            method: "GET",
            url: "/Content/orders.json"
            //url: "/pro/orders/get",//for ASP.NET
            //url: "orders.php",//for PHP
        };
        var groupModel = {
            checkbox: false,
            checkboxHead: false,           
            on: true,
            dataIndx: ['ShipCountry'],                       
            menuItems: ['grandSummary'],           
            summaryInTitleRow: 'all',
            titleInFirstCol: true,
            fixCols: false,
            indent: 20,
            collapsed: [false, true],
            title: [
                "{0} ({1})",
                "{0} - {1}"
            ],
            useLabel: true
        };
        var obj = {
            height: 500,
            toolbar: {
                items: [
                {
                    type: 'button',
                    label: "Toggle grouping",
                    listener: function () {
                        var on = this.option('groupModel.on');                                               
                        //toggle grouping.
                        this.Group().option({ on: !on });
                    }
                },
                {
                    type: 'checkbox',
                    label: 'bind selections',                               
                    listener: function(evt){                       
                        this.Group().unCheckAll();//first clear all.

                        this.Group().option({select: evt.target.checked});                       
                    }
                },               
                {
                    type: 'button',
                    label: "Get checked",
                    listener: function () {
                        var selected = this.Group().getCheckedNodes().map(function(rd) {
                          return rd.OrderID;
                        })
                        alert( selected );
                    }
                }
                ]
            },
            dataModel: dataModel,
            scrollModel: { autoFit: true },
            colModel: colM,
            numberCell: { show: false },
            menuIcon: true,                       
            groupModel: groupModel,
            showTitle: false,           
            hwrap: false,
            wrap: false
        };
        pq.grid("#grid_group_rows", obj);

    });

2

Bug Report / Editable Checkbox in row when groupModel is enabled. v5.3 TypeError: n is undef

« on: August 28, 2018, 07:49:20 am »

I have simple checkbox, when groupModel is enabled it does register the "check" and throws a TypeError: n is undefined. References the onBeforeCheck function in the source. It does register the uncheck with a false. I added a checkbox column to the Row Grouping demo, same issue.
Thanks in advance.


    $(function () {
        var colM = [
            { title: "ShipCountry", width: 120, dataIndx: "ShipCountry" },
            { title: "Customer Name", width: 130, dataIndx: "ContactName" },
                             {
                           title: "Paid",
                           width: 220,                         
                           dataIndx: "Paid",
                           type: 'checkbox',
                           cbId: 'chk',
                           useLabel: true
                        }         ,
                        //column to store checkbox state of ProductName.
                        {
                           dataIndx: 'chk',
                           dataType: 'bool',
                           cb: { header: true },
                           hidden: false,
                           editable: function(ui){                           
                              //to make checkboxes editable selectively.
                              return true;
                           }
                        },
            { title: "Freight", width: 120, format: '$##,###.00',
                summary: {
                    type: "sum"
                },
                dataType: "float", dataIndx: "Freight"
            },
            { title: "Shipping Via", width: 130, dataIndx: "ShipVia" },
          { title: "Shipped Date", width: 100, dataIndx: "ShippedDate", dataType: "date" },
            { title: "Shipping Address", width: 220, dataIndx: "ShipAddress" },
            { title: "Shipping City", width: 130, dataIndx: "ShipCity" }
      ];
        var dataModel = {
            location: "remote",
            dataType: "JSON",
            method: "GET",
            url: "/Content/orders.json"
            //url: "/pro/orders/get",//for ASP.NET
            //url: "orders.php",//for PHP
         //,getData: function(data) {
         //console.log(data);
         //   return data;
         //}
        };
        var groupModel = {
            on: true,
            summaryInTitleRow: 'all', //to display summary in the title row.
            dataIndx: ['ShipCountry', 'ContactName'],
            //showSummary: [true], //to display summary at end of every group.           
            title: [
                "{0} ({1})",
                "{0} - {1}"
            ]
        };
        var obj = {
            height: 500,
            toolbar: {
                items: [{
                    type: 'button',
                    label: "Toggle grouping",
                    listener: function () {
                        this.Group().option({
                            on: !this.option('groupModel.on')
                        });
                    }
                }]
            },
            dataModel: dataModel,
            scrollModel: { autoFit: true },
            colModel: colM,
            numberCell: { show: false },           
            selectionModel: { type: 'cell' },
            groupModel: groupModel,
            showTitle: false,
            resizable: true,
            menuIcon: true,
            hwrap: false,
            wrap: false
        };
        pq.grid("#grid_group_rows", obj);

    });

3

Help for ParamQuery Pro / Disposing of cellSave in an Autocomplete inline editor.

« on: August 15, 2017, 02:00:16 am »

Using the cellSave inside the autocomplete from the demo. Used to update other cells in the row.
The issue I'm having is that I move to another row and update a different cell (not one with the autocomplete init) the previous values are updating on the current row. Either I'm not using cellSave correctly or I need to dispose of the cellSave? Thanks in advance for any help or advice.

        function autocomp(choicedata) {
            $inp.autocomplete({
                selectItem: { on: true }
                        , source: choicedata
                        , select: function (event, ui) {
                            $("#grid_editing").pqGrid({
                                cellSave: function (event, uid) {
                                    //   console.log(ui);
                                    rwindx = uid.rowIndx;
                                    var value = ui.item.value;
                                    var label = ui.item.label;
                                    if (mycol === 'Location') {
                                        var LocID = ui.item.value;
                                        var Location = ui.item.label;
                                        $("#grid_editing").pqGrid("updateRow", { rowIndx: rwindx, row: { "LocationID": LocID, "Location": Location } });
                                    }
                                    else if (mycol === 'UOMDESC') {
                                        var UOMID = ui.item.value;
                                        var UOMDESC = ui.item.label;
                                        $("#grid_editing").pqGrid("updateRow", { rowIndx: rwindx, row: { "UOMID": UOMID, "UOMDESC": UOMDESC } });
                                    }
                                    return false;
                                }  // END CellSave
                            })
                        },
                selectItem: { on: false }, //custom option
                highlightText: { on: true }, //custom option
                minLength: 0
            }).focus(function (event, ui) {
                //open the autocomplete upon focus   
                $(this).autocomplete("widget").attr('style', 'max-height: 300px; overflow-y :auto; overflow-x: hidden');
                $(this).autocomplete("search", "");
            });

4

Help for ParamQuery Pro / Re: Batching updates using updateRow with a GroupModel

« on: March 15, 2017, 04:36:46 am »

If I understand pageData() correctly, it will only update the rows on the current page? Often there will be many rows that will span multiple pages.

5

Help for ParamQuery Pro / Batching updates using updateRow with a GroupModel

« on: March 14, 2017, 05:11:23 am »

I have a toolbar option to batch update all or filtered rows. In addition I'm using a grouping model. When I trigger the update I loop through the datamodel.data and apply the column change using updateRow(). Works fine without grouping for any number of rows.

With grouping (just one level) on it will update the rows 1 - x less the count of grouped rows. So if I have 200 rows with 20 group row headers only 180 rows gets updates. I'm sure I'm missing something simple, but I've tried everything I can think of.

Thanks in advance.