Search code examples
javascriptjqueryarraysmodel-view-controllerhidden-field

how to convert javaScript array into string And store in Hidden field in MVC?


onclick Function:-

    //$(document).ready(function() {
AddRemoveCustomer = function(){
    var CustomerIDArray =[];
    $(".checkBoxClass").click(function(e) {
        var arr = CustomerIDArray;
        var checkedId =$(this).attr('id');
        if ($(this).prop('checked')){
            CustomerIDArray.push(checkedId);
            arr = CustomerIDArray;
        }
        else
        {
            jQuery.each(CustomerIDArray, function(i, item){
                if (arr[i] == checkedId)
                {
                    arr.splice(i, 1);
                }
            });
            CustomerIDArray = arr;
        }
        var ids = "";
        jQuery.each(CustomerIDArray, function(i, item){
            if (ids == "")
            {
                ids = CustomerIDArray[i];
            }
            else
            {
                ids = ids + "," + CustomerIDArray[i];
            }
        });
        alert(ids);
    });;
    };
    </script>

View:-

<table id="tblEmailScheduler"  class="table-bordered col-offset-12">
            <thead>
                <tr class="label-primary">
                    <th style="padding:5px 15px;">
                        First Name
                    </th>
                    <th style="padding:5px 15px;">
                        Last Name
                    </th>
                    <th style="padding:5px 15px;">
                        Email ID
                    </th>
                    <th style="padding:5px 15px;">
                        Customer Type
                    </th>
                    <th style="padding:5px 15px;">
                        Customer Designation
                        @Html.DropDownList("CustomerDesignation", new SelectList(ViewBag.SelectAllCustomerDesignationDDL, "Value", "Text"), new { id = "CustomerDesignationDDL" , name = "CustomerDesignationDDL" })
                    </th>
                    <th style="padding:5px 15px;">
                        Select All
                        <div class="checkbox control-group">
                            <label>
                                <input type="checkbox" id="cbSelectAll" />
                            </label>
                        </div>
                    </th>

                </tr>
            </thead>
            <tfoot>
                <tr>
                    <th colspan="2">
                        EmailTemplate :
                        @Html.DropDownList("EmailSubject", new SelectList(ViewBag.SelectAllEmailTemplateDDL, "Value", "Text"), new { id = "SelectAllEmailTemplateDDL" })
                    </th>
                    <th colspan="2">
                        Set Date And Time:
                        <input type="text" class = "from-date-picker" readonly = "readonly"  />
                    </th>
                    <th colspan="2">
                       <input type="submit" value="Schedule" id="btnSubmit" class="btn btn-default" />
                    </th>
                    <td>

                    </td>
                </tr>
            </tfoot>
            @foreach (var item in Model)
            {
                <tr style="text-align:center">
                    <td id="tblFirstName">
                        @item.FirstName
                    </td>
                    <td id="tblLastName">
                        @item.LastName
                    </td>
                    <td id="tblEmailID">
                        @item.EmailID
                    </td>
                    <td id="tblCustomerType">
                        @item.CustomerType
                    </td>
                    <td id="tblCustomerDesignation">
                        @item.CustomerDesignation
                    </td>
                    <td>
                        <div class="checkbox control-group">
                            <label>
                                <input type="checkbox" id="@item.CustomerID" value="@item.CustomerID"  onclick="AddRemoveCustomer()" class="checkBoxClass"/>
                                @*@Html.CheckBox("Select", new { id = "cbCustomer", item.CustomerID})*@
                            </label>
                        </div>
                    </td>
                </tr>
            }
      </table>
        <input type="hidden" id="hfCustomerID"/>
  1. I have given checkbox as i check checkbox value of row stored in array in JavaScript.
  2. I want to convert JavaScript array into string and it should save in hidden field.
  3. When I click on paging then hidden field value should load in array and then in array it also stores the new checked value with existing value from hidden field

Solution

  • Sample

    var fruits = ["Banana", "Orange", "Apple", "Mango"];
    var value=fruits.toString();
    

    declare an input in html page.

    <input type="hidden" id="hidden" class="btn btn-default" />
    

    using jquery you can set value.

     $('#hidden').val(value);