[Solved] Grid conflict with MicrosoftAjax.js

[Andrew]

It seems that MVC grid configured with in-cell edit using Ajax binding, conflicts with MicrosoftAjax.js if it's included in the page.
The code is as following:

@{ Html.Telerik().Grid<DsrAdjustments.BusinessLayer.FlowSchedule>()
       .Name("Grid")
       .DataKeys(keys =>
       {
           keys.Add(model => model.COBDate);
           keys.Add(model => model.sourceSystemID);
           keys.Add(model => model.positionID);
           keys.Add(model => model.adjLevelID);
           keys.Add(model => model.FlowType);
           keys.Add(model => model.PeriodStartDate);
       })
        .ToolBar(commands =>
        {
            commands.SubmitChanges();

            commands.Insert();
        })
        .Columns(columns =>
        {
            columns.Bound(model => model.FlowType).Width(100);
            columns.Bound(model => model.PeriodStartDate);
            columns.Bound(model => model.PeriodEndDate);
            columns.Bound(model => model.PaymentDate);
            columns.Bound(model => model.ResetDate);
            columns.Bound(model => model.PeriodNotional);
            columns.Bound(model => model.InterestRate);
            columns.Bound(model => model.SpreadRate);
            columns.Bound(model => model.FlowAmount);
            columns.Bound(model => model.StrikePrice);
        })

        .Resizable(config => config.Columns(true))
        .Scrollable(scrollSettings =>
        {
            scrollSettings
                .Enabled(true)
                .Height(300);
        })
        .Editable(editing => editing.Mode(GridEditMode.InCell))
        .ClientEvents(events =>
        {
            //events.OnEdit("Grid_onEdit");
            //events.OnLoad("Grid_onLoad");
        })
        .DataBinding(dataBinding =>
            dataBinding.Ajax()
                .Select("_SelectBatchEditing", "FlowSchedule", new
                {
                    cobDate = ViewBag.cobDate,
                    sourceSystemId = ViewBag.sourceSystemId,
                    positionId = ViewBag.positionId,
                    adjLevelId = ViewBag.adjLevelId
                })
                .Update("_SaveBatch", "FlowSchedule", new
                {
                    cobDate = ViewBag.cobDate,
                    sourceSystemId = ViewBag.sourceSystemId,
                    positionId = ViewBag.positionId,
                    adjLevelId = ViewBag.adjLevelId
                })
                ).Render();
}

Master page has the following:

    @Html.Telerik().ScriptRegistrar().DefaultGroup(group =>
    {
        group.Add("jquery-1.5.1.min.js");
        //group.Add("jquery.validate.min.js");
        //group.Add("jquery.validate.unobtrusive.min.js");
        //group.Add("jquery.unobtrusive-ajax.min.js");

        group.Add("telerik.common.min.js");
        group.Add("telerik.calendar.min.js");
        group.Add("telerik.datepicker.min.js");
        group.Add("telerik.timepicker.min.js");
        group.Add("telerik.datetimepicker.min.js");
        group.Add("telerik.common.min.js");
        group.Add("telerik.textbox.min.js");
        group.Add("telerik.grid.min.js");
        group.Add("telerik.draganddrop.min.js");
        group.Add("telerik.grid.grouping.min.js");
        group.Add("telerik.grid.filtering.min.js");
        group.Add("telerik.grid.resizing.min.js");
        group.Add("telerik.grid.reordering.min.js");
        //group.Add("telerik.grid.editing.min.js");
        group.Add("telerik.grid.editing.js");
        group.Add("telerik.window.min.js");
        group.Add("telerik.list.min.js");
        group.Add("MicrosoftAjax.debug.js");
        group.Add("MicrosoftMvcAjax.debug.js");

    })
</body>
</html>

I've turned off unobtrusive javascript in web config as certain things didn't work when it's enabled.

If I try to update a row and click save button in the grid, it's reporting an error in javascript console (testing with Firefox 4):

Error: Sys.ParameterCountException: Parameter count mismatch.
Source File: http://localhost:3794/Scripts/MicrosoftAjax.debug.js
Line: 2597

I switched to using debug files to try to pin this issue down, but it occurs in min version too. I'm using latest (at this time) MicrosoftAjax FileVersion: 4.0.20526.0


If I take out the two MicrosoftAjax libraries, the grid works and posts the server as expected, but I need those libraries for the rest of the page. Any ideas?

BTW, with unobtrusive javascript the validation in the grid goes completely out of whack. It only works for the first cell, and then doesn't work at all. Behavior is difficult to describe. If I disable it, the validation in grid works as expected, but with those libraries required now it's between a rock and a hard place.

[Andrew]

I've actually managed to find a somewhat workable workaround, thought it's a major hack as far as I'm concerned. I left the rest of my application with unobstrusive javascript on and I explicitly disable it before rendering the grid. That was I can exclude the MicrosoftAjax.js from my project and still have things work, but it shouldn't be conflicting as far as I'm concerned. You guys should really look into that.