I display a jqGrid table of recipes and provide a master-details type view for the user. When the user selects a recipe from the grid, it displays the details of that recipe in a div below the grid. Then, I provide an in-place editing capability inside that div. When the user saves the edits, I redisplay the details to the recipe. That all works well enough. Now, the selected grid row may have data which doesn't match what the details show after the update, so I do something like this to update the grid:
$.ajax({
type: "GET",
data: "id=" recipeId,
url: '@Url.Action("GetGridDataForRecipe", "Recipe")',
dataType: "json",
success: function (result) {
var myGrid = $("#recipeGrid");
var selRowId = myGrid.jqGrid('getGridParam', 'selrow');
myGrid.jqGrid('setRowData', selRowId, result);
}
});
My controller action looks like so:
public JsonResult GetGridDataForRecipe(int id)
{
// ...
var recipeData = context.recipes.Where(m => m.RecipeId == id).Select(row => new
{
RecipeId = row.RecipeId,
RecipeName = row.RecipeName,
RecipeDa开发者_如何学Pythonte = row.RecipeDate,
}).First();
return Json(recipeData, JsonRequestBehavior.AllowGet);
}
So, the update works almost perfectly with the exception that the RecipeDate entry ends up getting displayed like so:
/Date(1317182400000)/
rather than the formatted date:
10/03/2011
that I specified in the colModel
when I return the grid rows:
{ name: 'RecipeDate', index: 'RecipeDate', width: 120, align: 'left', sorttype: 'date',
formatter: 'date', formatoptions: { newformat: 'm/d/Y'},
...
There's a disconnect here between the colModel
that I specified when the grid is displayed and the data I'm updating later. Do I need to re-specify this information? How do I do that?
Do I need to re-specify this information?
Yes.
How do I do that?
You could perform this formatting in the anonymous object your are returning from your controller action:
var recipeData = context.recipes.Where(m => m.RecipeId == id).Select(row => new
{
RecipeId = row.RecipeId,
RecipeName = row.RecipeName,
RecipeDate = row.RecipeDate.ToString("MM/dd/yyyy"),
}).First();
Found an answer on GitHub.
Adding $.jgrid.formatter.date.reformatAfterEdit = true; before I call setRowData seems to be a good work around for now.
I added this code and my dates now come out formatted as I expect.
精彩评论