Messages

1

Help for ParamQuery Pro / SetSelection scrolls the page

« on: February 22, 2022, 07:22:31 am »

This is a followup on my listeners post. I have a search 'begin' search field and when the search is close enough. Leaving just a few options. I listen for the keydown event and allow the user to scroll the remaining items in the grid.

It leaves the search field and goes to the first row of the grid.

The problem is: it is going to the first row but also scrolls the page up one row. And then does not allow the user to scroll through the rows as before. I thought I could set the focus of the page but that does not help.

Code: [Select]

                            if (evt.keyCode === 40) {
                                $("#inventory_grid").pqGrid("setSelection", {rowIndx: 0, focus: 0});
                            }


2

Help for ParamQuery Pro / Re: Filters and Listeners in version 8.2.1

« on: February 22, 2022, 07:16:58 am »

Thanks, that did what I needed. I caught the listener bit but missed the filter format! Thanks.

3

Help for ParamQuery Pro / Filters and Listeners in version 8.2.1

« on: February 20, 2022, 12:20:41 am »

I am upgrading from version 3.2 to 8.2.1. I read through the all the upgrade instructions and noticed that listeners were discouraged version 5.20. But I'm not finding a solution for how I previously used them. In this case when the user searches for a part #, they are able to press the down arrow and it moves them to the grid. And they can select from the filtered data. If they only have one result in the filtered data, they can press enter and it automatically moves to the grid and selects that item.

But neither of these are working now.

Code: [Select]

           {title: "Part", width: 165, dataIndx: "Part", align: "left", cls: 'result',
            filter: {
                crules: [{condition: 'begin'}],
                listener: [{'keydown': function (evt, ui) {
                            /* Custom filter listeners:
                             *
                             * if the down arrow is pressed the cursor will move to the first row in the grid
                             *
                             */

                            if (evt.keyCode === 40) {
                                $("#inventory_grid").pqGrid("setSelection", {rowIndx: 0});
                            }
                            if (evt.keyCode === 13) {

                                /* if the enter key is pressed and there is only one row of data, the cursor will
                                 * select the row and then use the data to open the edit form
                                 */

                                var data = $("#inventory_grid").pqGrid("pageData");
                                if (data.length === 1) {
                                    $("#inventory_grid").pqGrid("setSelection", {rowIndx: 0});
                                    var rowData = $("#inventory_grid").pqGrid("getRowData", {rowIndx: 0});
                                    editpart(getpartarraybyinventoryid(rowData.InventoryID), 0);
                                }
                            }
                        }, 'keyup': function (evt, ui) {
                            /*
                             * This replicates the default search functions
                             */
                            $("#inventory_grid").pqGrid("filter",
                                    {
                                        oper: 'replace',
                                        data: [
                                            {dataIndx: 'Part', condition: 'begin', value: ui.value}
                                        ]
                                    }
                            );
                        }
                    }
                ]
            }
        },


4

ParamQuery Pro Evaluation Support / Upgrade from 3.3.4 to latest version

« on: January 02, 2022, 04:29:32 am »

I have an application that uses 3.3.4. I used to have pro support but it has lapsed. What is the difficulty of upgrading this application to the latest version?

Steve

5

Help for ParamQuery Pro / Problem with Phone validation

« on: February 06, 2017, 04:48:49 am »

I'm trying to validate a phone number but it keeps giving me a validation error. I tested the regex on regex101.com.

        {title: "Cell", width: 150, dataIndx: "cell", align: "center", dataType: "string",
            validations: [
                {type: 'regexp', value: "\([0-9]{3}\) [0-9]{3}-[0-9]{4}$", msg: "That does not appear to be a valid US phone number in the format (712) 555-1212!"},
            ]
        },

6

Help for ParamQuery Pro / Re: Dialog Buttons don't show on first click

« on: December 24, 2016, 05:00:03 am »

Still troubleshooting this. I removed all CSS that wasn't jquery ui, validated my html, re-arranged the loading of scripts as much as I could nothing changes. I have added a Hack to open the dialog when the grid finishes loading and then immediately closing it. This hides the problem for now but obviously not optimal.

7

Help for ParamQuery Pro / Dialog Buttons don't show on first click

« on: December 23, 2016, 08:45:38 pm »

I don't think this is specifically a paramquery issue but I'm posting it just in case it's a conflict in the paramquery css or something. I'm also posting this on stackoverflow. The problem is that the dialog buttons don't display on the first rendering of the dialog but they do on every subsequent time. In the fiddle if you click on the first row in the grid and then click on "Delete Service" you can see what it is doing.

http://jsfiddle.net/stevenljacobsen/5n6j8v8x/2/

// Delete a Service
function service_delete(rowIndx, grid) {
    grid.addClass({rowIndx: rowIndx, cls: 'pq-row-delete'});
    $("#dialog-confirm").dialog({
        resizable: false,
        height: 125,
        width: 400,
        modal: true,
        buttons: {
            "Delete this service": function () {
                var serviceid = grid.getRecId({rowIndx: rowIndx});
                $.ajax($.extend({}, ajaxObj, {
                    context: grid,
                    dataType: 'text',
                    url: "/utilities/ajax_delete_service.php",
                    data: {serviceid: serviceid},
                    success: function () {
                        $("#services_grid").pqGrid("refreshDataAndView");
                    },
                    error: function () {
                        this.removeClass({rowIndx: rowIndx, cls: 'pq-row-delete'});
                    }
                }));
                $(this).dialog("close");
            },
            "Cancel": function () {
                grid.removeClass({rowIndx: rowIndx, cls: 'pq-row-delete'});
                $(this).dialog("close");
            }
        }
    });
}

8

Help for ParamQuery Pro / Re: No Rows to Display

« on: December 19, 2016, 08:23:20 pm »

Found it: Changed the dataModel to this:

dataModel: {data: data}

9

Help for ParamQuery Pro / No Rows to Display

« on: December 18, 2016, 02:17:59 am »

I'm trying to create a new grid and I keep getting No Rows to Display. I've stripped it down to the simplest form, compared it to examples and created a fiddle but can't find the problem.

http://jsfiddle.net/v13n2afj/4/

$(function () {

    var data = [{id: "1", email: "[email protected]", first_name: "Pancho", last_name: "Jacobsen", password: "password", level: "", activated: "", created: "2016-09-15 10:56:51"}];

// define colModel
    var colM = [
        {
            title: "ID",
            width: 75,
            dataIndx: "id",
            align: "center",
            dataType: "integer"
        },
        {
            title: "Email",
            width: 260,
            dataIndx: "email",
            align: "left",
            dataType: "string"
        },
        {
            title: "First Name",
            width: 260,
            dataIndx: "first_name",
            align: "left",
            dataType: "string"
        },
        {
            title: "Last Name",
            width: 60,
            dataIndx: "last_name",
            align: "left",
            dataType: "string"
        },
        {
            title: "Password",
            width: 75,
            dataIndx: "password",
            align: "left",
            dataType: "string"
        },
        {
            title: "Level",
            width: 60,
            dataIndx: "level",
            align: "center",
            dataType: "string"
        },
        {
            title: "Activated",
            width: 75,
            dataIndx: "activated",
            align: "left",
            dataType: "string"
        },
        {
            title: "Created",
            width: 100,
            dataIndx: "created",
            align: "left",
            dataType: "string"
        }
    ];

    var obj = {
        width: 1150,
        height: 700,
        colModel: colM,
        dataModel: data
    };

    $("#users_grid").pqGrid(obj);
});

10

Help for ParamQuery Pro / Force toolbar buttons to new line

« on: December 17, 2016, 02:53:07 am »

Is there a way to force a break in the toolbar?

11

Help for ParamQuery Pro / Re: Button not initialized on new row

« on: December 14, 2016, 07:50:32 pm »

Thanks! I also had to set the refresh to false on addRow. But that all works now.

Steve

12

Help for ParamQuery Pro / Button not initialized on new row

« on: December 14, 2016, 08:43:39 am »

I have some hidden buttons that I create on each row. When I edit the row I find the button make some changes and show it. That works. But I use the same code after inserting a row and it says the button is not initialized. Is this a timing thing or am I not getting the row inserted correctly?

Here is a fiddle. The function is at the top. I click the add row button to get the error in the console.

http://jsfiddle.net/2u0ytfc7/1/

function service_add(grid) {
  var rowIndx = 0;
  id = 200;

  $("#services_grid").pqGrid("addRow", {
    newRow: {
      id: id,
      service_date: "2016-12-13"
    },
    rowIndx: rowIndx,
    rowIndxPage: 0
  });
 
    //show the update and cancel .
  var $tr = grid.getRow({
      rowIndx: rowIndx
    }),

    $btn = $tr.find(".save_btn");

  $btn.button("option", {
      label: "Save",
      "icons": {
        primary: "ui-icon-check"
      }
    })
    .unbind("click")
    .click(function(evt) {
      return service_save(rowIndx, grid);
    })
    .show();

  //$("#services_grid").pqGrid("refresh");

  grid.addClass({
    rowIndx: rowIndx,
    cls: 'pq-row-edit'
  });

  grid.editFirstCellInRow({
    rowIndx: rowIndx
  });

}

13

Help for ParamQuery Pro / Re: Problem editing new row

« on: December 13, 2016, 10:02:57 pm »

Yep, I had some errant code in the calling button. Now I'm just dealing with the next lines. The button is not initialized yet so I can't work with it. I'll play with it and see if I can get past that.

Thanks!
Steve

14

Help for ParamQuery Pro / Problem editing new row

« on: December 13, 2016, 10:08:58 am »

I have a button that calls a function to insert a record in my database, get the inserted record id and then insert the record in the grid with that id. But I'm not able to get to the next step of editing the record. The line with "editFirstCellInRow" returns an error:

grid.editFirstCellInRow is not a function

The row is getting created and it is getting past the "addClass" line. Do I need something else?

function service_add(grid)
{
    $.ajax({
        context: grid,
        dataType: 'text',
        url: "/utilities/ajax_add_service.php",
        success: function (data) {
            var id = data;
            var rowIndx = 0;

            today = today();

            $("#services_grid").pqGrid("addRow", {newRow: {id: id, service_date: today}, rowIndx: rowIndx, rowIndxPage: 0});

            grid.addClass({rowIndx: rowIndx, cls: 'pq-row-edit'});
 
            grid.editFirstCellInRow({rowIndx: rowIndx});

            //show the save button .
            var $tr = grid.getRow({rowIndx: rowIndx}),
                    $btn = $tr.find("#saveservice");

            $btn.button("option", {label: "Save", "icons": {primary: "ui-icon-check"}})
                    .unbind("click")
                    .click(function (evt) {
                        return service_save(rowIndx, grid);
                    })
                    .show();
        }
    });
}

15

Help for ParamQuery Pro / Re: Identify whether current selected row is in the master or child table

« on: December 06, 2016, 09:00:03 am »

Just wanted to let you know that I turned the logic around so that I have two sets of buttons in the toolbar. One for the master grid and one set for the detail grid. I just show/hide the buttons as needed and set up global variables for the buttons to act on. This is working out for me.

            // setup the service variables
            var selectionArray = $("#services_grid").pqGrid("selection", {
                type: 'row',
                method: 'getSelection'
            });
            grid = this;
            rowIndx = selectionArray[0]['rowIndx'];

            // display the service buttons
            $(".servicebutton").show();
            $(".songbutton").hide();

            // Display the service info in the title
            $("#services_grid").pqGrid({title: 'Praise Song Organizer - <b>' + selectionArray[0]['rowData']['service_date'] + ' ' + selectionArray[0]['rowData']['location'] + ' Service</b>'})