DevExpress: sender.GetSelectedFieldValues not calling my client side call back - asp.net

Question

I have a GridExtension for MVC that looks like this:
The table it gets data out of looks like this:
Table Name: Category
Id Name
--------------
1 Foo
2 Bar
3 Gar
4 Har
When I select a row or more from the grid and click the Delete button on the top, I expect that my DeleteSelectedCategories handler should be called, which does happen.
However, in the DeleteSelectedcategories handler, when I call the gvCategories.GetSelectedFieldValues method supplying it the client side call back DeleteCategories, that method does not get called. Instead, I get all my script code shown in a message box like so:
I am using the almost the same code that is shown in this example on the DevExpress documentation website.
Here's my code.
View
<script type = "text/javascript">
//<![CDATA[
$(document).ready(
function () {
WireHandlers();
}
);
function DeleteCategories(selectedCategoriesArray) {
debugger;
if (selectedCategoriesArray.length == 0) return;
for (var i = 0; i < selectedCategoriesArray.length; i++) {
debugger;
}
}
function DeleteSelectedCategories() {
// debugger;
if (gvCategories.GetSelectedRowCount() == 0) return;
gvCategories.GetSelectedFieldValues('Id', DeleteCategories);
}
function WireHandlers() {
$('#btnDeleteCategory').click(DeleteSelectedCategories);
}
// ]]>
</script>
#using System.Web.UI.WebControls;
#using System.Data;
#model IEnumerable<GlobalizationUI.BusinessObjects.Category>
#Html.DevExpress().GridView(settings =>
{
settings.Name = "gvCategories";
settings.CallbackRouteValues = new { Controller = "Category", Action = "CategoriesPartial" };
settings.Width = 1200;
settings.SettingsPager.Position = PagerPosition.TopAndBottom;
settings.SettingsPager.FirstPageButton.Visible = true;
settings.SettingsPager.LastPageButton.Visible = true;
settings.SettingsPager.PageSizeItemSettings.Visible = true;
settings.SettingsPager.PageSizeItemSettings.Items = new string[] { "10", "20", "50", "100", "200" };
settings.SettingsPager.PageSize = 50;
settings.Settings.ShowFilterRow = true;
settings.Settings.ShowFilterRowMenu = true;
settings.CommandColumn.Visible = true;
settings.CommandColumn.ClearFilterButton.Visible = true;
settings.CommandColumn.ShowSelectCheckbox = true;
settings.Settings.ShowHeaderFilterButton = true;
settings.KeyFieldName = "Id";
settings.Columns.Add("Name");
settings.SettingsEditing.AddNewRowRouteValues = new { Controller = "Category", Action = "CreateNew" };
settings.SettingsEditing.UpdateRowRouteValues = new { Controller = "Category", Action = "Edit" };
settings.SettingsEditing.Mode = GridViewEditingMode.Inline;
settings.CommandColumn.Visible = true;
settings.CommandColumn.NewButton.Visible = true;
settings.CommandColumn.EditButton.Visible = true;
settings.CommandColumn.UpdateButton.Visible = true;
}).Bind(Model).GetHtml()
I am using DevExpress Extensions v12.2.10.0 for ASP.NET MVC 4 on Windows 7 Home Premium.

Answer 1

Put the GridView settings to a separate PartialView (without any other tags).