1

I am using jqGrid and my backend is asp.net-mvc. I want to figure out if I can have a different value to read and write a property with my backend.

The background here is that my server side sorting is generic and works by taking the column Name passed in my jqGrid and looks to sort by that property of the object my collection. This works great except for one situation

Lets say i have a grid that shows people data. I have a collection of Person objects on the server. Lets say I have a column that shows personName.

On the client side colModel i set the Name and Index properties of the colModel to be "PersonName".

On the serverside my person object has a PersonName property so when i filter or sort it uses C# reflection to sort and filter by that property.

The issue is that if i want to edit that property and the edit is a select dropdown where the Id is the PersonId and text is PersonName, when i save I want it to save the Id as the "PersonId" property (not the PersonName" property)

My current solution (which feel hacky) is to have two columns in the grid,

Here is an example (simplified to show the point):

  { name: "PersonName", index: "PersonName", width: 78, editable: false },
  { name: "PersonId", index: "PersonId", width: 78, editable: true, hidden: true, editrules: { edithidden: true, required: true} },
  1. One that is visible and used for sorting and filtering but is NOT editable (Name and Index is PersonName) so it doesn't show up on the edit dialog.

  2. A second column that is hidden (hidden:true) but has edithidden:true so it DOES show up on the edit dialog and is used for writing the value (this would be the PersonId) property.

This works but I wanted to see if there is a more elegant way to solve this issue besides having two different columns that really represent one piece of data.

leora
  • 188,729
  • 360
  • 878
  • 1,366
  • You wrote about "select dropdown where the Id is the PersonId and text is PersonName", but the code fragment which you posted has no `edittype: "select"` with the corresponding `editoptions` (`value`, `dataUrl` and so on) or optional `formatter: "select"`. Moreover you don't specify which editing mode (form editing, inline editing or cell editing) you use and in which implementation (for example inline editing with direct call of `editRow` or with using `inlineNav` or using `formatter: "actions"` and so on). Please include more details. – Oleg Aug 29 '13 at 10:30
  • @Oleg - i did that just to simplify the question. also i am using form editing – leora Aug 29 '13 at 15:21
  • Nevertheless the solution can depend on details. For example you can use `formatter: "select"` in combination with `edittype: "select", editoptions: {value: ...}. **The usage of `formatter: "select"` could be the key of the solution whic you need.** In the case grid data will contains **id** id select elements and `editoptions.value` get full information to convert id to the text which will be displayed. One can use `onclickSubmit`, `beforeSubmit` or `serializeEditData` to send id on edit. Only if you what to use `editoptions.dataUrl` instead of `editoptions.value` it could be a small problem. – Oleg Aug 29 '13 at 16:35
  • Could you include `formatter: "select"`, `edittype: "select"`, `editoptions` with `value` or `dataUrl` which you use? Do you load grid as JSON from the server? – Oleg Aug 31 '13 at 10:51
  • @Oleg - i do load grid from server .. can you clarity how i would download two different properties (personName and personId) into a single column (one for display and one for posting) – leora Aug 31 '13 at 10:57
  • You can download **only ids `personId`**. If you use `formatter: "select", edittype: "select", editoptions: {value: ...}` then jqGrid can decode ids (`personId`) and display texts. Nevertheless the local `data` for example (if you use `loadonce: true`) will contains only ids. In some old my answers I suggested to include `editoptions.value` for `select` columns in **JSON response** from the server. Inside of `beforeProcessing` one can set `editoptions.value` so that `formatter: "select"` can use it. So you will need **only one column with `PersonId` in `colModel`**. – Oleg Aug 31 '13 at 11:04
  • I can't find exact answer, but the main idea from [the answer](http://stackoverflow.com/a/17410568/315935) and [the answer](http://stackoverflow.com/a/16288582/315935) or [here](http://stackoverflow.com/a/9667067/315935) is the same. – Oleg Aug 31 '13 at 11:08

3 Answers3

2

jqGrid offers a number of callbacks which are called when a cell is edited (see here).

One of them, which is called just before the data is sent to the server, is serializeCellData, and allows you to modify the way your data is serialized before being sent to the server. This function is called if your jqGrid is configured with {cellsubmit: 'remote', cellurl: <a non empty url>} (based on the code found on github)

I would try to change the key (PersonName -> PersonId) in that function.

LeGEC
  • 46,477
  • 5
  • 57
  • 104
1

The solution you are using is the elegant one. It is a common pattern in jqGrid (or other grids) to have hidden colums representing Primary Keys or Foreign Keys.

csg
  • 2,047
  • 2
  • 22
  • 35
0

I don't know a lot about jqGrid, but could you do something like this: jqGrid Link Display Text

Basically, you use the ID column, but use a formatter to format the value as PersonName.

Community
  • 1
  • 1
htxryan
  • 2,871
  • 2
  • 21
  • 21