[Solved] rebind on object not binding to method's parameters

[Vincent Girard]

Hi,

I'm using Asp.Net MVC 2.0, telerik MVC 2010.3.1110 with T4MVC.

I'm having trouble to rebind my datagrid in AJAX.

My view looks like this :

<% using (Html.BeginForm()) {%>
        <%: Html.ValidationSummary(true) %>

        <fieldset>
            <legend><%: Resources.Search %></legend>

            <div class="editor-label">
                <%: Html.LabelFor(model => model.MemberNumber) %>
            </div>
            <div class="editor-field">
                <%: Html.TextBoxFor(model => model.MemberNumber) %>
                <%: Html.ValidationMessageFor(model => model.MemberNumber) %>
            </div>

            <div class="editor-label">
                <%: Html.LabelFor(model => model.Email) %>
            </div>
            <div class="editor-field">
                <%: Html.TextBoxFor(model => model.Email) %>
                <%: Html.ValidationMessageFor(model => model.Email) %>
            </div>

            <div class="editor-label">
                <%: Html.LabelFor(model => model.FirstName) %>
            </div>
            <div class="editor-field">
                <%: Html.TextBoxFor(model => model.FirstName) %>
                <%: Html.ValidationMessageFor(model => model.FirstName) %>
            </div>

            <div class="editor-label">
                <%: Html.LabelFor(model => model.LastName) %>
            </div>
            <div class="editor-field">
                <%: Html.TextBoxFor(model => model.LastName) %>
                <%: Html.ValidationMessageFor(model => model.LastName) %>
            </div>

            <div class="editor-label">
                <%: Html.LabelFor(model => model.Phone) %>
            </div>
            <div class="editor-field">
                <%: Html.TextBoxFor(model => model.Phone) %>
                <%: Html.ValidationMessageFor(model => model.Phone) %>
            </div>

            <div class="editor-label">
                <%: Html.LabelFor(model => model.Active) %>
            </div>
            <div class="editor-field">
                <%: Html.CheckBoxFor(model => model.Active) %>
                <%: Html.ValidationMessageFor(model => model.Active) %>
            </div>

            <p>
                <input type="submit" value="<%: Resources.ToSearch %>" id="btnSearch" />
            </p>
        </fieldset>

    <% } %>

     <%= Html.Telerik().Grid<SerializableMember>()
                    .Name("Grid")
                    .Columns(colums =>
                     {
                         colums.Bound(c => c.Email).Title(Resources.Email);//.ClientTemplate("<a href=\"" + Url.Action(MVC.Admin.Edit()) + "/<#=Id#>\" ><#=Email#></a>");
                         colums.Bound(c => c.FirstName).Title(Resources.FirstName);
                         colums.Bound(c => c.LastName).Title(Resources.LastName);
                         colums.Bound(c => c.MemberNumber).Title(Resources.MemberNumber);
                         colums.Bound(c => c.Active).Title(Resources.Active).HeaderHtmlAttributes(new { @class = "center-text" }).HtmlAttributes(new { @class = "center-text" }).ClientTemplate("<img src=\"Content/images/icons/<#=Active#>.png\" alt=\"<#=Active#>\" />");
                         colums.Bound(c => c.Id).Title(" ").HtmlAttributes(new { @class = "center-text" }).ClientTemplate("<a href=\"" + Url.Action(MVC.Member.ResetPassword()) + "/<#=Id#>\" title=\"" + Resources.ResetPassword + "\" >" + Resources.ResetPassword + "</a>");
                         colums.Bound(c => c.Id).Title(" ").HtmlAttributes(new { @class = "center-text" }).ClientTemplate("<a href=\"" + Url.Action(MVC.Member.Activate()) + "/<#=Id#>\" title=\"" + Resources.Activate + "\" >" + Resources.Activate + "</a>");
                         colums.Bound(c => c.Id).Title(" ").HtmlAttributes(new { @class = "center-text" }).ClientTemplate("<a href=\"" + Url.Action(MVC.Member.Deactivate()) + "/<#=Id#>\" title=\"" + Resources.Deactivate + "\" >" + Resources.Deactivate + "</a>");
                     })
                    .DataBinding(d => d.Ajax().Select(MVC.Member.ListAjax(new SearchMemberModel()).GetRouteValueDictionary()))
                    .Sortable()
                    .NoRecordsTemplate(Resources.NoData)
            %>
            <%= Html.AntiForgeryToken() %>

            <script type="text/javascript">
                $(document).ready(function () {
                    $('#btnSearch').click(function () {
                        var grid = $('#Grid').data('tGrid');
                        var searchModel = {
                            MemberNumber: $('#MemberNumber').val(),
                            Email: $('#Email').val(),
                            FirstName: $('#FirstName').val(),
                            LastName: $('#LastName').val(),
                            Phone: $('#Phone').val(),
                            Active: $('#Active').is(':checked')
                        };
                        grid.rebind({ search: searchModel });
                        return false;
                    });
                });
            </script>

            <%= Html.Telerik().ScriptRegistrar().jQuery(false).DefaultGroup(g => g.DefaultPath("~/Content/Javascript/2010.3.1110"))%>

And that's my method in my controller :

[GridAction]
        public virtual ActionResult ListAjax(SearchMemberModel search)
        {
            var gridModel = new GridModel<SerializableMember>();
            var data = _session.All<Member>();
            if (search != null)
            {
                if (search.Active) data = data.Where(x => x.Active);
                if (!string.IsNullOrEmpty(search.Email)) data = data.Where(x => x.Email.Contains(search.Email));
                if (!string.IsNullOrEmpty(search.FirstName)) data = data.Where(x => x.FirstName.Contains(search.FirstName));
                if (!string.IsNullOrEmpty(search.LastName)) data = data.Where(x => x.LastName.Contains(search.LastName));
                if (!string.IsNullOrEmpty(search.MemberNumber)) data = data.Where(x => x.MemberNumber.Contains(search.MemberNumber));
                if (!string.IsNullOrEmpty(search.Phone)) data = data.Where(x => x.Phone.Contains(search.Phone));
            }

            var list = new List<SerializableMember>(data.Count());
            list.AddRange(data.ToList().Select(obj => new SerializableMember(obj)));
            gridModel.Data = list;
            return View(gridModel);
        }

But when I debug I always get a null SearchMemberModel, anyone can tell me what I'm doing wrong? If I take a look at this post on stackoverflow javascript object should bind to c# object by itself : http://stackoverflow.com/questions/4255900/pass-json-to-asp-net-mvc2-website

Thank you!

[Vincent Girard]

Found what I was doing wrong, got to post javascript this way on the rebind :

not good : grid.rebind({ search: searchModel });

working : grid.rebind(searchModel);

[Darren]

Thank you for posting the solution.  It helped me solve a similar issue.