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

Beginner trying to use custom pop up form for edting

1 Answer 398 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Andrew
Top achievements
Rank 1
Andrew asked on 07 Nov 2017, 12:12 AM

I have a grid that uses a datatable as the mode. Here's the code for the grid:

@(Html.Kendo().Grid<dynamic>()
                .Name( "Grid")
                .Columns( columns =>
                {
                    foreach ( DataColumn col in Model.Columns)
                    {
                        var c = columns.Bound(col.ColumnName);
                        // handle special cases here, e.g. putting things in footer of grid
                        c.Width(200);
                    }
                    columns.Command(command => { command.Edit(); command.Destroy(); }).Width(250);
                })
                .ToolBar(toolbar => toolbar.Create())
                .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("UsersEditAdd").Window(w => w.Title("Add or Edit User")))
                .Pageable(pager => pager
                    .Input(true)
                )
                .Sortable()
                .Scrollable(s => s.Height(500)) //////////////////////// hard coded height
                .Filterable()
                .DataSource( dataSource => dataSource
                    .Ajax()
                    .Model( model =>
                    {
                        // two lines below are in demo code. I get an index out of bounds from the next line
                        //var id = Model.PrimaryKey[0].ColumnName;
                        //model.Id(id);
                        model.Id("AgentID"); // this is required
                        foreach ( DataColumn col in Model.Columns)
                        {
                            var field = model.Field( col.ColumnName, col.DataType);
                        }
                    })
                    .Read( read => read.Action("Read","Home"))
                    .PageSize(40) /////////////////////////////////////// hard coded items per page
                    .Create(update => update.Action("EditingPopup_Create", "UsersGrid"))
                    .Update(update => update.Action("EditingPopup_Update", "UsersGrid"))
                    .Destroy(update => update.Action("EditingPopup_Destroy", "UsersGrid"))
                )
                .Resizable(resize => resize.Columns(true))
                .Reorderable(reorder => reorder.Columns(true))
                .HtmlAttributes(new { style = "height: 550px" })  /// does control the height
            )

 

The grid loads with data and an Edit button. When I click the Edit button, a screen pops up based on the columns and data in the grid row. But I want the edit button to bring up the view named UsersEditAdd. I created UsersEditAdd.cshtml in the same directory as the view with the grid.

I was looking at a similar posting, and it seems that I shold be seeing the view I created. But, no.

Any help would be appreciated.

Also, I'm currently using an evaluation version.

 

 

1 Answer, 1 is accepted

Sort by
0
Viktor Tachev
Telerik team
answered on 08 Nov 2017, 01:50 PM
Hi Andrew,

In order to use a custom popup editor you need to add a partial View to the ~/Views/<GridViewName>/EditorTemplates. If the partial view is in the same directory as the view with the Grid the custom editor will not be found. Try to change the location of the custom editor and let me know how it works for you

With that said, you can find the example below helpful. It illustrates how to define a custom popup editor for the Grid component. 



Regards,
Viktor Tachev
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Grid
Asked by
Andrew
Top achievements
Rank 1
Answers by
Viktor Tachev
Telerik team
Share this question
or