ParamQuery grid support forum

General Category => ParamQuery Pro Evaluation Support => Topic started by: rallesaid on August 18, 2016, 06:36:12 pm

Title: How to activate save button with custom field ?
Post by: rallesaid on August 18, 2016, 06:36:12 pm

i have a custom field, it's a bootstrap switch, which he called from a function

var config = {
            dataIndx : "usr_est",
            title    : "Estado",       
        };

function check_stat(config){
    var grid;
    return { title: config['title'], dataIndx: config['dataIndx'] , width:"100px", align: "center", resizable: false, editable:true,
            editor: false,
            editable: function (ui) {
                            return !ui.rowData.disabled;
                        },
            render: function (ui) {
                grid = this;
                var cellData = ui.cellData;
                var checked = cellData === 1 ? 'checked' : '';
                return  { text: "<label><input type='checkbox' " + checked + " name='check-stat'/></label>" };
            },
            postRender: function(ui){
                $("[name='check-stat']").bootstrapSwitch(
                    {size:'mini',
                    onText:'Activo',
                    offText:'Inactivo'}).on('switchChange.bootstrapSwitch', function(event, state) {
                     
                      var rowData = ui.rowData;
                      if(state){
                        this.value = 1;
                        rowData[config['dataIndx']] = 1;
                      }else{
                        this.value = 0;
                        rowData[config['dataIndx']] = 0;
                      }
                     
                      grid.addClass({ rowData:rowData, rowIndx: ui.rowIndx, cls: 'pq-row-edit pq-cell-dirty ' });
                      grid.refresh()
                     
                      console.log(ui)
                    });
               
            }           
        };
}

(http://fotos.subefotos.com/3357b324d1226df366d5df77a4b47b47o.png)

but when I change the state, the save button is not activated

(http://fotos.subefotos.com/f1183b59f267e630648c5025b1ba39e0o.png)

How can I force to take it as a change made by the user? Any idea?

Title: Re: How to activate save button with custom field ?
Post by: paramvir on August 19, 2016, 12:50:31 pm

This is not the right way to notify the grid of changes

Quote

Code: [Select]

                      //update rowData directly.
                      grid.addClass({ rowData:rowData, rowIndx: ui.rowIndx, cls: 'pq-row-edit pq-cell-dirty ' }); //not required
                      grid.refresh() //not required.


Please use updateRow() method to notify grid of changes instead of making direct changes in rowData. NO need to add dirty class and refresh grid manually.

Title: Re: How to activate save button with custom field ?
Post by: rallesaid on August 19, 2016, 08:22:46 pm

indeed , with updateRow buttons are activated, but the custom button behaves strange when I add updateRow () , with the first click changes state, but when I want to go back to change state , does not work with a click , I do 2 click and states are reversed

load the firs state:
(http://fotos.subefotos.com/33cdc491e9de77f9810b8899c69aa721o.png)

click to change state:
(http://fotos.subefotos.com/9020c4d3846b9e5ffa42d5eddcc9e244o.png)

other click to change state:
(http://fotos.subefotos.com/782e5765b00d004faa7fdf0b9539d969o.png)

other click:
(http://fotos.subefotos.com/33cdc491e9de77f9810b8899c69aa721o.png)

and at this point , save changes button does not work, but only it happens when I put the updateRow method

Title: Re: How to activate save button with custom field ?
Post by: paramvir on August 19, 2016, 10:31:50 pm

Could you share a working example / jsfiddle so that I can have a look.