[Solved] Grid in a Modal Window

[Bruce]

I have a view that contains a series of buttons.  When you press on one, a hidden Telerik Window is displayed.  A grid is embedded in the BeginForm and gets its data from ViewData and is databinded with Ajax.  An update action is defined on the data binding.  I click on the edit button, make changes inline and then press update.  The controller is correctly called with the updated data.  My problem is returning from the controller action.  It wants Json returned.  I want it to just return back to the grid.  How do I do this?

@model Scripps.Partners.Web.ViewModels.

 

ProductionTasksViewModel

 

@{

ViewBag.Title =

 

"Index";

 

Layout =

 

"~/Views/Shared/_Layout.cshtml";

 

}

<

 

 

h2>Administrative Tasks</h2>

 

 

<

 

 

button id="ProductionCompanies-open-button" class="t-button t-state-default">Update Production Companies...</button>

 

 

 

 

@{

Html.Telerik().Window()

.Name(

 

"ProductionCompanies")

 

.Title(

 

"Production Companies")

 

.Content(@<text>

 

 

<div>

 

 

@

 

using (Html.BeginForm("ProductionCompanies", "Administration",

 

 

 

FormMethod.Post, new { id = "SaveProductionCompanyForm", enctype = "multipart/form-data" }))

 

{

 

 

<div style="margin: 20px 0 0 0;">

 

@{

 

 

GridEditMode mode = GridEditMode.InLine;

 

 

 

GridButtonType type = GridButtonType.Text;

 

 

 

var productionCompanyList = ViewData["ProductionCompanies"] as IEnumerable<Scripps.Partners.DatabaseModel.ProductionCompany>;

 

 

 

var telerikGrid = Html.Telerik().Grid(productionCompanyList).Name("TelerikGrid");

 

telerikGrid.Columns(columns =>

{

columns.Bound(p => p.Name).Width(100);

columns.Bound(p => p.AllowWebResource).Width(30);

columns.Bound(p => p.ProductionCompanyID).Width(30).Hidden();

 

columns.Command(commands => { commands.Edit().ButtonType(type); }).Width(180).Title(

 

"Commands");

 

　

});

telerikGrid.DataKeys(keys => keys.Add(p => p.ProductionCompanyID));

telerikGrid.DataBinding(dataBinding => dataBinding.Ajax()

.Update(

 

"UpdateProductionCompany", "Administration", new { mode = mode, type = type }));

 

telerikGrid.Filterable();

 

telerikGrid.Pageable();

telerikGrid.Selectable();

telerikGrid.Editable(editing => editing.Mode(mode));

telerikGrid.Render();

}

 

 

<input type="submit" value="Done" class="t-button" />

 

 

 

 

</div>

 

 

 

<br />

 

 

 

<br />

 

}

 

 

 

</div>

 

</text>)

.Width(400)

.Height(500)

.Draggable(

 

true)

 

.Modal(

 

true)

 

.Visible(

 

false)

 

.Render();}

@{ Html.Telerik().ScriptRegistrar()

 

.OnDocumentReady(@<text>

// open the initially hidden window when the button is clicked

$('#Update-open-button')

.click(function(e) {

e.preventDefault();

$('#AlphaList').data('tWindow').center().open();

});

 

$('#ProductionCompanies-open-button')

.click(function(e) {

e.preventDefault();

$('#ProductionCompanies').data('tWindow').center().open();

});

// add button hovers

$('.t-button').live('mouseenter', $.telerik.buttonHover)

.live('mouseleave', $.telerik.buttonLeave);</text>); }


Controller Action

 

[

 

AcceptVerbs(HttpVerbs.Post)]

 

[Telerik.Web.Mvc.

 

GridAction]

 

 

 

public ActionResult UpdateProductionCompany(Scripps.Partners.Web.ViewModels.ProductionCompanyViewModel data)

 

{
    //update data to model

    return????

 

}

[Petur Subev]

Hi Bruce,

Basically your update action should return the the same collection used to populate the data of the Grid, since the Grid refreshes after update. In your case it should be IEnumerable<Scripps.Partners.DatabaseModel.ProductionCompany>
Also you will need to specify a select action as shown in our Ajax binding demo in order to be able to refresh the Grid using the icon or when paging sorting filtering is applied (the action result should be the same as the one used for the update action).
I hope this helps.

Kind regards,
Petur Subev
the Telerik team

[Bruce]

That worked.  Now I feel dumb because I didn't try returning

Json(productionCompanyList

 

as IEnumerable<ProductionCompany>);

Thanks!