Direct Update of Entity normally updated via Grid

[Chris]

I use Grids in many places and in most, there are Popup Edit and/or Add options using the Grid's Editor Template i.e. .TemplateName("_AddEditPerson")).

This works fine, but there are quite a few occasions where I need to bring up the same edit popup but directly, for a given ID and not via the Grid.  e.g.  If a user looks at a list of notifications which point to various entity types to be found in various Grids.  They just want quickly access that item without leaving where they are for another Grid.

I would like to do this in such a way that updates from the Grids still work (and are bound immediately back to the grid as normal), but that the same editor templates can be used for direct updates.

My idea to achieve this is as follows:
- create a hidden Kendo (popup) window on the calling page
- upon request, via javascript, open the Window with its contents populated with a partial view (_DirectEditPerson) by a Controller Action (HomeController/DirectEditPerson)
- the _DirectEditPerson Partial View contains an Ajax Form containing the regular Grid Editor Template (_AddEditPerson) loaded via a @Html.Partial statement

 

I have shown how this is setup in the attached image.  The edit button on each line points to the regular editor window as normal. There is then a button at the bottom of the Grid which opens Person with ID 3 (just for test purposes) without going via the Grid.

The window correctly opens with all but the Gender dropdown filled in.  The dropdown which seems to have no value, even though I know its being passed.  If I set the value and press update, there is a validation error with the same field.

Is this achievable?  Can you give me any pointers? Telerik suggested explicitly set the model value to the DropDownList (using Value method) or use MVVM binding (used by the Grid internally) to bind the edited model to the editor template, but I'm not sure how to do this. As I have quite a lot of Grid Editor templates, I do want to re-use them so that they work from both their Grid and also directly like this.


Thanks,

Chris

[Alexander Popov]

Hi Chris,

You can try passing the Person model to the GenderEditor partial as well and use it along with a DropDownListFor helper.

Regards,
Alexander Popov
Telerik

[Chris]

Hi Alexander,

I've tried that (see below).  However, the SelectListItem Value and Text still come up empty.  All the other field types seem to work.

Thanks,

Chris.

 

Call from _AddEditPerson.cshtml

========================== 

@model KendoMVCWrappers.Models.Person

.....

<div id="gender-selector">
    <div class="editor-label">
        @Html.Label("Gender")
    </div>
    <div class="editor-field">
        @Html.Partial("EditorTemplates/_GenderEditor", Model)
    </div>
</div> 

 

_GenderEditor.cshtml

=================

@using Kendo.Mvc.UI
@using KendoMVCWrappers.Models
@model Person

<p>@Model.Name</p>
<p>@Model.PersonID</p>
<p>@Model.BirthDate</p>
<p>@Model.Gender</p>
@*<p>@Model.Gender.Text</p>*@
@*<p>@Model.Gender.Value</p>*@

@(Html.Kendo().DropDownListFor(m => m.Gender)
    .DataTextField("Text")
    .DataValueField("Value")

    .DataSource(source =>
    {
        source.Read(read =>
        {
            read.Action("GenderList", "Home");
        });
    })
    .OptionLabel("Please Select")
)        

[Alexander Popov]

Hi Chris,

I tried reproducing the scenario locally, however passing the Model seems to work as expected (see screencast). 

Regards,
Alexander Popov
Telerik