如何通过jquery和Ajax将与文本框值连接的选定复选框值数组传递给MVC控制器

时间:2016-05-24 08:42:47

标签: c# jquery asp.net ajax asp.net-mvc

我是MVC的新手。我有一个使用ASP.NET使用MVC5框架的项目。我有一个名为addContract的视图,它包含两个dropdownList,一个是服务提供者,第二个是服务提供者。我还有一个两个datepickers开始和结束日期,一个合同数量的文本框,最后一个包含文章列表的表,我将在合同和价格中选择我想要的文章。每件事都有利于我已经实现了一个函数,它将添加所选复选框的值和价格的文本框的值,并将它们合并到一个数组中,并通过ajax和jquery发送给控制器。问题是,当我去控制器时,我在数组的变量中得到了Null。但服务和日期的所有其他值都很好。

请帮帮我,最好的办法是什么!!!

这是我的视图代码,只是我发现问题的表的代码:

         <table class="table table-bordered table-striped table-hover" id="tab">
                        <thead>
                            <tr>
                                <td>Choose</td>
                                <td>Reference</td>
                                <td>Article Name</td>
                                <td>Price</td>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach (var ar in Model)
                            {
                                <tr>

                                    <td><input type="checkbox" name="CheckboxGroup1" value="@ar.reference" ID="chk" class="check"></td>

                                    <td>@ar.reference</td>
                                    <td>@ar.Name</td>


                                 <td> <input type="text" id="txt" name="@ar.reference" placeholder="TND" ></td>

                                </tr>
                            }

                        </tbody>
                    </table>



this is the jquery script :

    //***testing if a checkbox is selected and add the selected row in an array***//
    //the table that will store selected items
    var Num_Contrat = "";
    var Date_Deb = "";
    var Date_Fin = "";
    var Price = "";
    var Service_Provider_List = "";
    var Service_List = "";
    var selected = [];

    //**(1)   -im gonna find the table body and checkbox
    $('table#tab tbody').on('change', '.check', function () {


            var ischecked = $(this).is(":checked");

            if (ischecked) {

                selected.push($(this).val() + "," + $(this).closest('tr').find("#txt").val());







            } else {
                if ((index = selected.indexOf($(this).val() + "," + $(this).closest('tr').find("#txt").val())) !== -1) {
                    selected.splice(index, 1);
                }
            }

            // (4) -and finnally i m gonna  Remove duplicate elements from selected array
            selected = $.unique(selected);
            alert(selected);

        });

        //Validation
        $("#Service_Provider_List").keyup(function () {
            var vall = $(this).val();
            if (vall == "") {
                $("#dpl1error").html("<span class='glyphicon glyphicon-warning-sign' style='color:red;'></span>");
                Service_Provider_List = "";
            }
            else {
                $("#dpl1error").html("<span class='glyphicon glyphicon-ok' style='color:green;'></span>");
                Service_Provider_List = vall;
            }
        });
        $("#Service_List").keyup(function () {
            var vall = $(this).val();
            if (vall == "") {
                $("#dpl2error").html("<span class='glyphicon glyphicon-warning-sign' style='color:red;'></span>");
                Service_List = "";
            }
            else {
                $("#dpl2error").html("<span class='glyphicon glyphicon-ok' style='color:green;'></span>");
                Service_List = vall;
            }
        });
        $("#Date_Deb").keyup(function () {
            var vall = $(this).val();
            if (vall == "") {
                $("#dpkerror").html("<span class='glyphicon glyphicon-warning-sign' style='color:red;'></span>");
                Date_Deb = "";
            }
            else {
                $("#dpkerror").html("<span class='glyphicon glyphicon-ok' style='color:green;'></span>");
                Date_Deb = vall;
            }
        });
        $("#Date_Fin").keyup(function () {
            var vall = $(this).val();
            if (vall == "") {
                $("#dpk2error").html("<span class='glyphicon glyphicon-warning-sign' style='color:red;'></span>");
                Date_Fin = "";
            }
            else {
                $("#dpk2error").html("<span class='glyphicon glyphicon-ok' style='color:green;'></span>");
                Date_Fin = vall;
            }
        });
        $("#Num_Contrat").keyup(function () {
            var vall = $(this).val();
            if (vall == "") {
                $("#inpnumerror").html("<span class='glyphicon glyphicon-warning-sign' style='color:red;'></span>");
                Num_Contrat = "";
            }
            else {
                $("#inpnumerror").html("<span class='glyphicon glyphicon-ok' style='color:green;'></span>");
                Num_Contrat = vall;
            }
        });




        $("#btnsub").click(function () {
            var prices = [];
            $('input:checked').each(function () {

                prices.push($(this).attr("value"));
            });
            var test = JSON.stringify(selected);


            if (Service_Provider_List == "" || Service_List == "" || Date_Deb == "" || Date_Fin == "" || Num_Contrat == "") {
                $("#btnerror").html("<span class='glyphicon glyphicon-warning-sign' style='color:red;'> Please enter the missing fields ! </span>");
            }
            else {

            $("#btnerror").html("<span class='glyphicon glyphicon-ok' style='color:green;'> You successfully added a contract</span>");

            //ajax call


            $.ajax({
                type: "POST",
                url: '@Url.Action("addcontract")',
                data: '{"Num_Contrat":' + JSON.stringify(Num_Contrat) + '"Date_Deb":' + JSON.stringify(Date_Deb) + '"Date_Fin":' + JSON.stringify(Date_Fin) + '"Service_Provider_List":' + JSON.stringify(Service_Provider_List) + '"Service_List":' + JSON.stringify(Service_List) + '"selected":' + test + '}',
                async: false,
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                traditional: true,


                success: function (data) {
                    alert(data);
                }

            });



            }

        });

控制器:

 //Manage Contract
    // **Add Contract
    [HttpPost]
    public ActionResult addcontract(string Num_Contrat,string Date_Deb,string Date_Fin,string Service_Provider_List,
        string Service_List,IEnumerable<string> selected)
    {
        if (ModelState.IsValid)
        {

            OracleConnection con = new OracleConnection();
            con.ConnectionString = "DATA SOURCE=XE;USER ID=gbon;password=gbon";
            con.Open();
            OracleCommand com = new OracleCommand();
            OracleCommand com1 = new OracleCommand();
            com.Connection = con;
            com1.Connection = con;
            com.CommandText = "INSERT INTO CONTRACT VALUES('" + Num_Contrat + "','" + Date_Deb + "','" + Date_Fin + "','" + Service_Provider_List + "','" + Service_List + "')";
         //   com1.CommandText = "INSERT INTO ARTICLE_CONTRACT VALUES('" + selected + "')";
            return Json(new { add="done"});
        }
        return View();

    }

0 个答案:

没有答案