This is a migrated thread and some comments may be shown as answers.
Batch editing, with popup editor
10 Answers 120 Views
This is a migrated thread and some comments may be shown as answers.
DominionZA
Top achievements
Rank 1
DominionZA asked on 19 Nov 2015, 01:48 PM
We are using batch editing in a grid that has now grown to have way too many columns.
We would like to reduce the number of columns (not mandatory values) in the grid to make it more presentable, but have an Edit button to display a popup containing the rest of the columns to edit.

How can this be done? Been hunting for ages, and unable to find a solution.

NB: I don't want to do a trip to the server to get the partial view to render, along with another hit on the DB to get the rest of the data. The view model already exists in the grid. I just want the popup to enable editing of the additional columns that we are not showing in the grid.

10 Answers, 1 is accepted

Sort by
0
Venelin
Telerik team
answered on 20 Nov 2015, 07:27 AM
Hi DominionZA,

You can use grid's showColumn/hideColumn API to achieve the desired functionality: 
http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#methods-showColumn
http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#methods-hideColumn

Regards,
Venelin
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
DominionZA
Top achievements
Rank 1
answered on 20 Nov 2015, 07:32 AM

Thanks, but I don't think you are understanding.

I am in batch editing mode, so not using the popup editor as the default form of editing a record.

1. Grid is batch editing. Hiding the columns I don't want in the grid is no problem.
2. I want a button in each grid row for editing the columns I don't show (about 20 of them). This will be via a popup editor.
3. When the popup displays, it must show the additional columns I want to be able to edit. And bound to the datasource of the grid without a round trip to the server/controller to get the additional information (already part of the model bound to the grid).

Your response is only how to hide/show columns - which I don't need.

0
Venelin
Telerik team
answered on 23 Nov 2015, 11:28 AM
Hello,

You can define a custom edit popup form and include the necessary fields. Here is an example: http://jsfiddle.net/valchev/BCBzS/1/light/. This is widely discussed in this forum thread: http://www.telerik.com/forums/custom-popup-editor-with-additional-fields

Regards,
Venelin
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
DominionZA
Top achievements
Rank 1
answered on 23 Nov 2015, 02:29 PM

Both the fiddle and the widely discussed thread are using the popup editor as the default editor. This is not related to my question and I am not sure how else to say this so you can understand better.

I am NOT using the popup editor as the default. I am using batch inline editing. Please see my posts above.

I need to display a popup editor for additional columns that I do not want displayed in the grid. I am asking how to invoke the editor via my own button "More". The editor will then popup and enable editing for additional columns.

Customising the popup is not my question. My question is how to programatically invoke it via a button in the grids row - and link it to the selected datasource - and not by setting the grids edit mode to Popup. I want it to remain in inline batch editing.

0
Venelin
Telerik team
answered on 24 Nov 2015, 11:52 AM
You can't invoke the popup grammatically if you use batch, because edit modes can't be mixed. However you can create a template column with a button that opens window. Then set window's content to be template and bind it to the data item where the button was clicked.

Regards,
Venelin
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
DominionZA
Top achievements
Rank 1
answered on 26 Nov 2015, 11:55 AM
That makes more sense. Thank-you.

Are there no samples floating about using KendoUI MVC? Custom popup, templates and MVVM are all things that I would still have to research, then find a solution that brings them all together. Very time consuming.
0
DominionZA
Top achievements
Rank 1
answered on 26 Nov 2015, 02:21 PM
Never mind - I found a solution that works for me here : http://stackoverflow.com/questions/18148734/how-to-create-custom-kendo-ui-window-for-edit-in-kendo-ui-grid
0
DominionZA
Top achievements
Rank 1
answered on 26 Nov 2015, 03:42 PM

Okay, all is nearly working. Most columns are binding in the popup correctly, and saving back to the grid/db just fine - except for bool type columns.

The binding code looks like this...

$("#vehicleDeviceConfigurationWindow [name]").each(function() {
        var name = $(this).attr("name");       
        $(this).attr("data-bind", "value:" + name);
    });

Model definition of a bool property that won't bind...
[DisplayName("Save Logs")]
public virtual bool DeviceCfg_SaveLogs { get; set; }

Can you perhaps point me in the right direction please. It is only the bool properties that are not binding (to view, or back to grid).


0
DominionZA
Top achievements
Rank 1
answered on 27 Nov 2015, 07:23 AM

Okay, some progress. After trawling through the docs I changed...

@Html.EditorFor(model => model.DeviceCfg_UseM2MCommunications)
to...
<input type="checkbox" data-bind="checked: DeviceCfg_UseM2MCommunications" />

Now the binding works, but it does not feel right. Am I correct in saying so? I would prefer to stick with razor syntax if possible.



0
Venelin
Telerik team
answered on 30 Nov 2015, 08:52 AM
Hello,

...
$(this).attr("data-bind", "value:" + name);

will result in checkbox with data-bind attribute set to "value: something":

<input type="checkbox" data-bind="value: DeviceCfg_UseM2MCommunications" />

As far as I can see from the code that you provided, the desired resulting rendering should be:

<input type="checkbox" data-bind="checked: DeviceCfg_UseM2MCommunications" />

If this is so, then, for the checkbox you have to render different attribute value (i.e. "checked"). Depending on the MVC version this can be done directly in .EditorFor, or you can still use jQuery, just add additional check for booleans and alter the attribute value as desired.

Regards,
Venelin
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Tags
Grid
Asked by
DominionZA
Top achievements
Rank 1
Answers by
Venelin
Telerik team
DominionZA
Top achievements
Rank 1
Share this question
or