Author Topic: Get return from dialog and save cell  (Read 7671 times)

noctrona

  • Pro Enterprise
  • Jr. Member
  • *
  • Posts: 82
    • View Profile
Get return from dialog and save cell
« on: February 25, 2014, 02:25:50 pm »
Hi,

I have a problem about get value from a dialog and set this value for a cell.

This is column on my grid
Code: [Select]
                       
{ title: "Accessory", width: 152,
    editor: function (ui) {
        chooseAccessory(ui);
    }
}

The step is:
1. User click a cell under "Accessory" column.
2. Open a dialog in "chooseAccessory(ui)" method
3. Some check boxes in this dialog, user can choose them.
4. When choose finished, I will invoke another method after the dialog closed to get the chose value
5. Then I want to set this value in this click cell.

For the moment, I can get the choose results, but can't set it in cell. Please have a look with my method when the dialog closed:
Code: [Select]
var DM = $j("#grid_json").pqGrid("option", "dataModel");
DM.data[accessoryRow][accessoryCol] = valStr; //set my choose result string on this cell.
$j("#grid_json").pqGrid( "saveEditCell" );


« Last Edit: February 25, 2014, 02:35:59 pm by noctrona »

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6265
    • View Profile
Re: Get return from dialog and save cell
« Reply #1 on: February 25, 2014, 03:03:36 pm »
saveEditCell is meant to be used for inline editing to save data from inline editor into DM.data.

You already saved the data in DM.data and you just need to refresh the cell.

http://paramquery.com/api#method-refreshCell

noctrona

  • Pro Enterprise
  • Jr. Member
  • *
  • Posts: 82
    • View Profile
Re: Get return from dialog and save cell
« Reply #2 on: February 25, 2014, 06:08:39 pm »
saveEditCell is meant to be used for inline editing to save data from inline editor into DM.data.

You already saved the data in DM.data and you just need to refresh the cell.

http://paramquery.com/api#method-refreshCell

Hi,

Thanks for your response.
I try the "refreshCell" way, but still not work. Then I comments some other code and found when I remove the following code, the "refreshCell" can work well and the value from dialog can display on cell.
Do you know why this happened? Is these any conflict between them?

Code: [Select]
    function setAccessory(idStr, valStr){

        var DM = $j("#grid_json").pqGrid("option", "dataModel"); 
        DM.data[accessoryRow][accessoryCol] = valStr;
        alert(DM.data[accessoryRow][accessoryCol]);
        $j("#grid_json").pqGrid( "refreshCell", { rowIndx: accessoryRow, colIndx: accessoryCol} );
    }

Code: [Select]
        $grid.on("pqgridquiteditmode", function (evt, ui) {
            //exclude esc and tab           
            if (evt.keyCode != 27 && evt.keyCode != 9) {
                $grid.pqGrid("saveEditCell");
            }
        });

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6265
    • View Profile
Re: Get return from dialog and save cell
« Reply #3 on: February 25, 2014, 07:57:22 pm »
There is no conflict between quitEditMode and refreshCell.

I could have a look what's going on if you could create a reduced test case in fiddle.

noctrona

  • Pro Enterprise
  • Jr. Member
  • *
  • Posts: 82
    • View Profile
Re: Get return from dialog and save cell
« Reply #4 on: February 25, 2014, 08:24:48 pm »
There is no conflict between quitEditMode and refreshCell.

I could have a look what's going on if you could create a reduced test case in fiddle.

Hi,

Please have a look with this:
http://jsfiddle.net/noctrona/LJTHn/
Double click Accessory cell.

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6265
    • View Profile
Re: Get return from dialog and save cell
« Reply #5 on: February 25, 2014, 10:42:04 pm »
In your case you don't need to use either saveEditCell or refreshCell.

http://jsfiddle.net/LJTHn/9/




noctrona

  • Pro Enterprise
  • Jr. Member
  • *
  • Posts: 82
    • View Profile
Re: Get return from dialog and save cell
« Reply #6 on: February 26, 2014, 07:29:12 am »
In your case you don't need to use either saveEditCell or refreshCell.

http://jsfiddle.net/LJTHn/9/

Hi,

It works well. But I have a little confuse about the modification.
Code: [Select]
accessoryCell.html(valStr).attr("tabindex","0").focus();

I konw the "accessoryCell.html(valStr)" part used to add my string to accessoryCell. But what's mean of the next part?
And also if I want to set idStr to the next hidden column cell, what can I do.
I try the following code to get the next cell

Code: [Select]
accessoryIdCell = $("#grid_json").pqGrid( "getCell", {rowIndx: rowIndex,colIndx: colIndex+1} );

Then use the same way to set value for this cell, but not work.
Code: [Select]
accessoryIdCell.html(idStr);

http://jsfiddle.net/LJTHn/12/
And what's mean of a $cell in our component? I don't familiar with jquery.
« Last Edit: February 26, 2014, 07:45:24 am by noctrona »

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6265
    • View Profile
Re: Get return from dialog and save cell
« Reply #7 on: February 26, 2014, 09:45:03 am »
There are 2 way bindings :

1) View to Data

2) Data to View.

When you use inline editing, it's the first case. You need to take care of your view ( inline editor) using html() or val() and pqGrid itself takes care of updating the data.

When you directly make changes in dataModel.data and want to see your data changes in a cell, it's 2nd case. In this case you use methods like refreshCell, refresh after updating your dataModel.data

http://jsfiddle.net/LJTHn/14/

Quote
And what's mean of a $cell in our component? I don't familiar with jquery.

$cell is the editor container div wrapped as jQuery object.
« Last Edit: February 27, 2014, 12:53:20 am by paramquery »

noctrona

  • Pro Enterprise
  • Jr. Member
  • *
  • Posts: 82
    • View Profile
Re: Get return from dialog and save cell
« Reply #8 on: February 27, 2014, 07:08:59 am »
There are 2 way bindings :

1) View to Data

2) Data to View.

When you use inline editing, it's the first case. You need to take care of your view ( inline editor) using html() or val() and pqGrid itself takes care of updating the data.

When you directly make changes in dataModel.data and want to see your data changes in a cell, it's 2nd case. In this case you use methods like refreshCell, refresh after updating your dataModel.data

http://jsfiddle.net/LJTHn/14/

Quote
And what's mean of a $cell in our component? I don't familiar with jquery.

$cell is the editor container div wrapped as jQuery object.

Hi,

Thank you! Your explain is very useful for me!