This is a migrated thread and some comments may be shown as answers.

Editing in grid react on change event of a control

7 Answers 262 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Jaap
Top achievements
Rank 2
Jaap asked on 11 Jan 2012, 08:46 PM
Hello,

I want to be able to edit in a grid. That is not a problem.
But for example I have an order line and in a dropdownlist I choose a product.
On product change want one or more other (editable) fields to be updated, e.g. the product description and price.
So on product change I want to have an event calling the server and then updating some fields of the row which is currently in edit mode.
Hope it is a bit clear what I mean.

Any hints how to do that?

Thanks, Jaap

7 Answers, 1 is accepted

Sort by
0
Jaap
Top achievements
Rank 2
answered on 12 Jan 2012, 09:12 AM
Just discovered that a dropdownlist in a grid is not yet supported (will be in the release of this month).
But that does not change my request:
On change of a field I want to be able to access and change to whole dataItem which is currently edited.

Regards, Jaap
0
Jaap
Top achievements
Rank 2
answered on 13 Jan 2012, 09:52 AM
Just discovered that the grid has a save event which fires after a cell is edited (perhaps cellchanged would be a better name).
save : function (e) {
    e.model.data.Code = "Changed";
}

Here I can change the model. Problem is that the other cell (Code) is not refreshed immediately, but if I do something with the grid which causes the cell to refresh, I can see the change.

When I read a field from the data, eg:

Then I get an error:

Syntax error, unrecognized expression: [data-id=Binnenlandse klanten]

But it still did the change.

Sometimes I get also this error: Unable to get value of the property 'editable': object is null or undefined

But can't reproduce it exactly.

Any idea what the supposed way to do this is?

Regards, Jaap
0
Accepted
Rosen
Telerik team
answered on 13 Jan 2012, 10:35 AM
Hi Jaap,

In order to change Model's value you should use the set method instead modifying its internal data. You may try something similar to the following:

save: function(e) {
    if (!("Code" in e.values)) {           
        e.model.set("Code", "Changed");
    }
}

This will update the appropriate cell in the grid.

Also note that id values does not support spaces.
All the best,
Rosen
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Jaap
Top achievements
Rank 2
answered on 13 Jan 2012, 11:34 AM
Thank you, that is working.
It is just the challenge to discover how things should be done. Didn't find this somewhere as example or in the documentation?
Is there updated documentation available? (Just bought the commercial version this morning).

But I keep sometimes the error "unrecognized expression: [data-id=Binnenlandse klanten]".
Now I have the commercial version and so the not minified javascript files, it is must easier to find out what's going on.
This error occurs in the grid._modelChange where is tried to find the table row with the data-id attribute with a jquery find.
This gives an error if the model.id() contains invalid characters like space or semicolon. If the id is quoted in the jquery find selector, then it works fine.

Regards Jaap
0
Rosen
Telerik team
answered on 16 Jan 2012, 08:53 AM
Hi Jaap,

As I have mentioned in my previous message, id field currently cannot contain spaces. However, this limitation may removed in feature versions of the product.

Regards,
Rosen
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Jaap
Top achievements
Rank 2
answered on 16 Jan 2012, 09:07 AM
Hi Rosen,

Excuse me, I missed that note from you on the id field.
As I mentioned in my post it is easy to fix, so I can't imagine it is not fixed in a next release ;-)

Regards, Jaap
0
Edwin
Top achievements
Rank 1
answered on 03 Jul 2012, 06:54 PM
I have a similar problem with a column defined as
  {
    title: "Remaining",
    template: "#= max_qty - received_qty"
  }

If I write code to call model.set('received_qty', value), the "Remaining" column is updated without having to call grid.refresh(). However, if I edit the received_qty field with the incell editor, it does not update the "Remaining" column.

As a workaround, I may be adding a remaining field to the model, so that I can set it. However, I have also found that I have to set that field to editable, or calling model.set('remaining', value) will not refresh the display of that cell.
Tags
Grid
Asked by
Jaap
Top achievements
Rank 2
Answers by
Jaap
Top achievements
Rank 2
Rosen
Telerik team
Edwin
Top achievements
Rank 1
Share this question
or