How to pass multiple parameters in url.action in JavaScript in MVC?

Question

I have below javascript function in my MVC application,

function EditProducts(productId, orderId, employeeId, mode) 
{
    mode = "edit";
    debugger;
    var url = '@Url.Action("Index", "Home", new { productId = "__productId__", orderId = "__orderId__", employeeId = "__employeeId__", Mode = "__mode__"})';
    var params = url.replace('__productId__', productId).replace('__orderId__', orderId).replace('__employeeId__', employeeId).replace('__mode__', mode);
    window.location.href = params;
}

But it doesn't work. Here is my controller code by I am not getting any values in below vaiables,

public ActionResult Index(int productId, int orderId, int employeeId, string mode)
{
    return View();
}

Any ideas on how to pass multiple parameters through url.action?

Answer 1

Use @Html.Raw to prevent the ampersand from being converted to & inside javascript code

function EditProducts(productId, orderId, employeeId, mode) 
{
    mode = "edit";
    debugger;
    var url = '@Html.Raw(Url.Action("Index", "Home", new { productId = "__productId__", orderId = "__orderId__", employeeId = "__employeeId__", Mode = "__mode__"}))';
    var params = url.replace('__productId__', productId).replace('__orderId__', orderId).replace('__employeeId__', employeeId).replace('__mode__', mode);
    window.location.href = params;
}

Answer 2

Get the base url to the action method using Url.Action helper method and add the querystring params to that.

This should work fine

$(function(){

  var productId = 23;
  var employeeId = 44;
  var orderId = 34;
  var mode = "tes";

  var url = '@Url.Action("Index", "Post")';
  url += '?productId=' + productId + '&orderId=' + orderId + 
                                            '&employeeId=' + employeeId + '&mode=' + mode;
  window.location.href = url;