0

I’m using MVC Kendo grid and few drop down lists as filters and search button. Grid is bound using Ajax. The filters are defined outside of the grid. The filtering, paging and sorting is done on the server. When user clicks on the search button i am passing the selected filter values to action method as Model, and do the search and return the result. This is working fine when user selects the filter. However, One of the filter is required filter, so I have [Required] attribute on the model’s property. When user don’t select the required filter, grid calls the GetData() action method as expected, and on server I see ModelState is NOT valid as expected. But here im not sure what should I return when Model is not valid, Questions:
1>I have validation summary on layout page, how do I show model error in ValidationSummary without clearing the grid?When action method returns error, I don’t want to clear the existing result in the Grid. The error should display on top of the page.
2> Instead of using ajax, if I use server side binding will it work without posting the grid data to server? again I don't want to clear the grid data when required filter is not selected.

Note: For brevity purpose my sample below showing only one filter. Also I’m not worrying about client side validation.

_layoutpage

            <html>
        <head>
            @Styles.Render("~/Content/css")
            @Styles.Render("~/Content/kendo/css")
            @Scripts.Render("~/bundles/modernizr")
            @Scripts.Render("~/bundles/jquery")
            @Scripts.Render("~/bundles/kendo")
            @Scripts.Render("~/bundles/bootstrap")
            @Scripts.Render("~/bundles/jqueryval")
        </head>
        <body>    
            <div class="container body-content">      
                @Html.ValidationSummary()
                @RenderBody()
                <footer></footer>
            </div>
            @RenderSection("scripts", required: false)
        </body>
        </html>

Index Page

        @model MyModel
        @{
            ViewBag.Title = "Index";
            Layout = "~/Views/Shared/_Layout.cshtml";
        }
        <h2>Index</h2>
        <div>
            <br />
            @Html.ListBoxFor(x => x.SelectedIDs, new MultiSelectList(Model.States, "ID", "Name"))
            @Html.ValidationMessageFor(m => m.SelectedIDs)
        </div>

        <input id="btnSearch" type="submit" width="100" value="Search" />
        @(Html.Kendo().Grid<Person>()
           .Name("grid")
           .Columns(col =>
           {
           col.Bound(p => p.ID);
           col.Bound(p => p.Name);
           })
           .DataSource(ds =>
           ds.Ajax()
           .Read(r => r.Action("GetData", "Working"))
           .PageSize(3))
           .Pageable()
           .Sortable()
           .AutoBind(false)
        )
        <script src="~/Scripts/Working.js"></script>

JavaScript

$(function () {

            var myModel = {
                SelectedIDs: []
            };

            var dataSource = $("#grid").data("kendoGrid").dataSource;
            dataSource.transport.options.read.data = getFilters;

            $("#btnSearch").click(function () {
                myModel.SelectedIDs = $("#SelectedIDs").val();
                $("#grid").data("kendoGrid").dataSource.read();        
                $("#grid").data("kendoGrid").refresh();
            })

            function getFilters() {
                return myModel;
            }
        })

Controller

            public class WorkingController : Controller
        {
            public ActionResult Index()
            {
                var model = new MyModel();
                return View(model);
            }

            public ActionResult GetData([DataSourceRequest]DataSourceRequest request, MyModel model)
            {
                if (!ModelState.IsValid)
                {
                    // What should i return here so that Model error message will appear in ValidationSummary ???
                }

                return Json(MockData.GetPersons().ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
            }
        }

Model

public class MyModel
{
    [Required(ErrorMessage = "State is required.")]
    public int[] SelectedIDs { get; set; }

    public IEnumerable<State> States
    {
        get
        {
            return MockData.GetStatesWithAbbr();
        }
    }

    public IEnumerable<Person> Persons { get; set; }
}
LP13
  • 30,567
  • 53
  • 217
  • 400
  • possible duplicate of [How to return ModelState errors to Kendo grid in MVC Web API post method?](http://stackoverflow.com/questions/17790107/how-to-return-modelstate-errors-to-kendo-grid-in-mvc-web-api-post-method) – Brett Jun 23 '15 at 15:31
  • thanks but I found a better solution http://stackoverflow.com/questions/14005773/use-asp-net-mvc-validation-with-jquery-ajax and then handle error http://stackoverflow.com/questions/13653662/kendo-handling-errors-in-ajax-data-requests – LP13 Jun 23 '15 at 17:26
  • Glad you found a solution. You should close/remove this question from SO since you no longer need it answered. – Brett Jun 23 '15 at 18:05

0 Answers0