How to convert array to send as query string?

Question

In my view, I have checkboxes and some data displayed and button on each row to approve or reject requests put up.

I want to send my integer array to my action method but this cannot be done by just sending it to action query parameters and it would be like the picture below:

public int[] Ids 
{
  get { return new int[] { 1, 2, 3 }; }
  set {}
}
public ActionResult Approval([ModelBinder(typeof(IntArrayModelBinder))] int[] ids)
{
    ...
    return View(...);
}

@Html.ActionLink("Approve", "Approval", new {id = item.Ids, approvalAction = "approve"})

How do I implement the checkboxes to be checked and hover of the approve/reject actionlink will show the url with ../ids=1&ids=2&ids=3 instead of System.Int32[]?

I am not sure why you want to generate multiple ids in link, those ids must associated with 1 another id or main associated table id, use that one. For instance : all above ids are related to Approvald : 1055 @Html.ActionLink("Approve", "Approval", new { id = item.ApprovalId, approvalAction = "approve" }) — Altaf Khokhar, Dec 11 '19 at 11:29
The website I am building uses either ? or & in the url, so to standardize the url link generated I have to make it always include &. I was told to do it this way :\ — DatB, Dec 13 '19 at 01:48

Amir Jelo · Answer 1 · 2019-12-11T13:00:37.140

Option 1: Send your array as a comma-separated string and then split them in your action like this :

@Html.ActionLink("Approve", "Approval", new { id = string.Join("," , Ids), approvalAction = "approve" } )

your action :

public ActionResult YourAction(string id , string approvalAction)
{
    var ids = id.Split(',');
    //rest of your action method business
}

Option 2: another way to achieve your exactly url is to create your URL like this :

var baseUrl = Url.Action("YourAction", "YourController", null, Request.Url.Scheme);
var uriBuilder = new UriBuilder(baseUrl);
uriBuilder.Query = string.Join("&", Ids.Select(x => "ids=" + x));
string url = uriBuilder.ToString();
url += "&approvalAction=approve"

and your action would be like this :

public ActionResult YourAction(int[] ids , string approvalAction)
{}

I followed this link for the reference: https://stackoverflow.com/questions/9508265/how-do-i-accept-an-array-as-an-asp-net-mvc-controller-action-parameter. The problem now is that my url is generating the int[] instead of individual ids. I was told not to the option 2 logic on the backend, have to do it with JS on the frontend instead. — DatB, Dec 13 '19 at 06:22

score 0 · Accepted Answer · answered Dec 16 '19 at 07:29

     <script>
        function multiSelect(selectedArray, action) {

            if (selectedArray[0] === undefined) {
                alert("You have not selected any employee");
            }

            //example url
            //..?ids=1&ids=2&ids=3&aprovalAction=approve
            else {
                var param = "";
                var currUrl = "";
                var idUrl = "";

                idUrl = "ids=" + selectedArray[0];
                for (var i = 1; i < selectedArray.length; ++i) {
                    idUrl += "&ids=" + selectedArray[i];
                }

                switch (action) {
                    case "Approve":
                        param = "approve";
                        break;

                    case "Reject":
                        param = "reject";
                        break;
                }

                currUrl = "approvalAction=" + param;

                window.location.href = "?" + idUrl + "&" + currUrl;
            }           
        }
    </script>

    <script>
        $('#MultiApproveBtn').click(function () {
            var selected = $('input[type=checkbox]:checked').map(function (_, el) {
                return $(el).val();
            }).get();

            var x = document.getElementById("MultiApproveBtn").value;
            //alert(selected);
            multiSelect(selected, x);
        })
    </script>

    <script>
        $('#MultiRejectBtn').click(function () {
            var selected = $('input[type=checkbox]:checked').map(function (_, el) {
                return $(el).val();
            }).get();

            var x = document.getElementById("MultiRejectBtn").value;
            //alert(selected);
            multiSelect(selected, x);
        })
    </script>

How to convert array to send as query string?

2 Answers2