Post List of object using ajax in server side

  This is simple step how to send data client side to server side using javascript and jquery
/// arry your object u can store value of json type
  var array = [];
        function SendData() {
            if (array.length > 0) {
                var json_Parse = JSON.stringify(array);
             
                console.log(json_Parse);
                $.ajax({
                    type: "post",
                    url: "LargeDataPageLoad.aspx/GetString",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    data: '{ "obj":' + json_Parse + ' }',
                    success: function (response) {
                        response ? alert("It worked!") : alert("It didn't work.");
                        onCustomerClick();
                    },
                    error: function (xhr, status, error) {
                        alert(error);
                    }
                });
           
            }
       
         }

Best way manipulate data in json array get server side using client side

 <script type="text/javascript">
        $(document).ready(function () { });
        function onCustomerClick() {
            $("#CustomerDetails").html('');
            $("#CustomerDetails").append('<table widht="100%" id="newTable"  cellpadding="5">' +
            '<tr><th>&nbsp;</th><th>&nbsp;</th><th>CustomerCode</th><th>Customer Name</th><th>Name On Card</th><th>Created Date</th><th>&nbsp;</th></tr>');
            var optionHTML = '';
            optionHTML += '<select>';
            $.ajax({
                type: "post",
                url: "LargeDataPageLoad.aspx/LoadHugeData",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (response) {
                    $.each(response, function (key, value) {

                        var json_data = JSON.parse(value);
                        console.log();
                        for (var index = 0; index < json_data.dt.length; index++) {

                            var selectId = "select_" + index;
                            var d = new Date(json_data.dt[index]["CreatedDate"]);
                            $("#newTable").append('<tr><td>' + (index + 1) + '</td><td><input type="checkbox" onchange="enableDropdown(this,' + selectId + ')" id="chk_' + index + '"/></td><td>' + json_data.dt[index]["CustomerCode"] + '</td><td>'
                                                     + json_data.dt[index]["NameOnCard"] + '</td><td>'
                                                     + json_data.dt[index]["CustomerName"] + '  <td>' + d.toLocaleDateString()
                                                     + '</td><td id="td_' + index + '"></td></tr>'

                                               );

                            { $('#td_' + index).append('<select id="select_' + index + '" disabled="disabled" >'); }
                            for (var option = 0; option < json_data.dtOption.length; option++) {
                                if (option == 0)
                                    $('#select_' + index).append('<option value="-1">-Select-</option>');
                                $('#select_' + index).append('<option  value="' + json_data.dtOption[option]["Value"] + '">' + json_data.dtOption[option]["Name"] + '</option>');

                            }
                            $('#td_' + index).append('</select></td>');
                            //$('#td_' + index).html(optionHTML);
                        }
                        //                        $.each(value, function (key1, value1) {
                        //                            console.log(key1);
                        //                            var json_data = JSON.parse(value1);
                        //                            for (var index = 0; index < json_data.length; index++) {
                        //                                $("#newTable").append('<tr><td>' + json_data[index]["CustomerCode"] + '</td><td>'
                        //                             + json_data[index]["NameOnCard"] + '</td><td>'
                        //                             + json_data[index]["CustomerName"] + '</td>'

                        //                           );
                        //                            }

                        //                        });

                    });
                },
                error: function (xhr, status, error) {
                    alert(error);
                }
            });

            $("#CustomerDetails").append('</table>');
        }
        var array = [];

        function enableDropdown(value, ddlValue) {

            var ddlId = '#' + ddlValue.id;
            var splitValue = ddlId.split('_');
            var json_data = { id: parseInt(splitValue[1]) };

            $(ddlId).attr('disabled', !document.getElementById(value.id).checked);
            if (document.getElementById(value.id).checked) {
                array.push(json_data);
              
            } else {
              $.grep(array, function (n, i) {
                 if(typeof n != "undefined")
                if (n.id == parseInt(splitValue[1])) {
                  
                    var index = array.indexOf(array[i]);
                  
                    if (index > -1) {
                        array.splice(index, 1);
                    }
                }
                return array;
            });
            }
            console.log(array);
        }
    </script>