How to pass values to controller from Javascript code in MVC

Question

Actually I have a scenario like :

I am getting the values of checked records in GridView through Javascript. Now i need to send those values to controller for deleting those records.

<script type="text/javascript">
    $(function OnDelete() {
        $('#btn_Delete').click(function ()
        {
            gvPaging.PerformCallback();
        });
    });

    function OnBeginCallback(s, e) {
        var selectedValues = s.GetSelectedKeysOnPage();
        e.customArgs["ID"] = "";
        for (var i = 0; i < selectedValues.length; i++) {
            e.customArgs["ID"] += selectedValues[i] + ',';
        }
    }
</script>

and my GridView is like this :

<% 
Html.DevExpress().GridView(
    settings =>
    {
        settings.Name = "gvPaging";
        settings.CallbackRouteValues = new { Controller = "GridView", Action = "PagingPartial" };
        settings.Width = Unit.Percentage(100);
        settings.KeyFieldName = "ID";

        settings.CommandColumn.ShowSelectCheckbox = true;
        settings.CommandColumn.SetHeaderTemplateContent(c =>
        {
            Html.DevExpress().CheckBox(settingsCheckBox =>
            {
                settingsCheckBox.Name = "cbSelectAll";
                settingsCheckBox.Name = "Select All";
                settingsCheckBox.Properties.ValueType = typeof(bool);

                settingsCheckBox.Properties.ClientSideEvents.CheckedChanged = string.Format("function(s, e) {{ if(s.GetChecked()) {0}.SelectRows(); else {0}.UnselectRows(); }}", settings.Name);
                settingsCheckBox.Checked = c.Grid.VisibleRowCount == c.Grid.Selection.Count;
            }).Render();
        });
        settings.SettingsBehavior.AllowSelectByRowClick = true;
        //settings.Columns.Add("ID");
        settings.Columns.Add("Name");
        settings.Columns.Add("EmailID");
        settings.Columns.Add("MobileNumber");
        settings.Columns.Add("Address");
        settings.SettingsPager.Position = PagerPosition.Bottom;
        settings.SettingsPager.FirstPageButton.Visible = true;
        settings.SettingsPager.LastPageButton.Visible = true;
        settings.SettingsPager.PageSizeItemSettings.Visible = true;
        settings.SettingsPager.PageSizeItemSettings.Items = new string[] { "10", "20", "50" };


        settings.SettingsEditing.AddNewRowRouteValues = new { Controller = "GridView", Action = "InlineEditingAddNewPartial" };
        settings.SettingsEditing.UpdateRowRouteValues = new { Controller = "GridView", Action = "InlineEditingUpdatePartial" };
        //settings.SettingsEditing.DeleteRowRouteValues = new { Controller = "GridView", Action = "InlineEditingDeletePartial" };
        settings.SettingsEditing.Mode = GridViewEditingMode.EditFormAndDisplayRow;
        //settings.SettingsBehavior.ConfirmDelete = true;

        settings.Settings.ShowFilterRow = true;
        settings.Settings.ShowFilterRowMenu = true;
        settings.CommandColumn.Visible = true;
        settings.CommandColumn.ClearFilterButton.Visible = true;
        settings.CommandColumn.NewButton.Visible = true;
        //settings.CommandColumn.DeleteButton.Visible = true;
        settings.CommandColumn.EditButton.Visible = true;
        settings.Settings.VerticalScrollBarMode = ScrollBarMode.Visible;
        //settings.ClientSideEvents.SelectionChanged = "SelectionChanged";
        settings.ClientSideEvents.BeginCallback = "OnBeginCallback";

    })
    .Bind(Model)
    .Render();

%>

Dimitar · Accepted Answer · 2012-12-14 12:54:38Z

1

You can use AJAX inside your script.

Something like this

$.ajax({
         url: 'Your method in controller which will delete the records',
         type: 'POST',
         data: ' data which you want to send to controler ',
});

answered Dec 14, 2012 at 12:54

Dimitar

4841 gold badge6 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

user1903944 Over a year ago

how to retrieve that data in controller??

Dimitar Over a year ago

If you send string, public index ( string data ), if you use object( means you are sending array of object from ajax) then make class for that object and public index ( objectname o ).

Ivan Ferić · Accepted Answer · 2013-01-17 10:25:20Z

1

In your controller use this statement for retrieving the value: Request.Params["ID"]

edited Jan 17, 2013 at 10:25

Ivan Ferić

4,76311 gold badges40 silver badges47 bronze badges

answered Jan 17, 2013 at 10:06

Instance Noodle

2271 silver badge10 bronze badges

Comments

Mohammad Atiour Islam · Accepted Answer · 2014-01-20 12:50:27Z

Consider the following example i am firing the script with a list value using for loop table data.

<a href='#' class="gridEdit"  onclick="javascript:return DeleteServiceOut('@Model.EmployeeInformationList[i].GEmployeeGenInfoID.ToString()');"></a>

the function to pass values to controller from Javascript code in MVC

<script>
 function DeleteServiceOut(GEmployeeId) {

        window.location = "/PMS/Payroll/ServiceOutAdd/ServiceOutDelete/" + GEmployeeId;
        return false;
    }

</script>

in to the controller

 public ActionResult ServiceOutDelete(string id, ServiceOutModels model)
        {
           // id will contailn the value of parameter
           // AS you want
            return View("ServiceOutViewDetails", model);
        }

Collectives™ on Stack Overflow

How to pass values to controller from Javascript code in MVC

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related