Ad

Insert Multiple Record Into Database

Inserting record into database on javascript function but ajax is failed and give error.first i try to insert three record at one click but it does n't work so then i call javascript function on button click to insert record one by one by getting id and value.

javascript function:

<script type="text/javascript">
    debugger;
    $(document).ready(function () {
    $('#btnEmail1').click(function ()
    {
  var email1 = $("#email1").val();
            var chk = $("#chk1").val();

            $.ajax({
                type: "POST",
                url: "/User/AddTeamEmail",
                data: JSON.stringify(email1 + chk),
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (r) {
                    alert(r + " record(s) inserted.");
                }
            });



        });

        $("#btnEmail2").click(function () {
            debugger;
            var email = $("#email2").val();
            //var chk2 = $("#chk2").val();
            alert(email);
            $.ajax({
                type: "POST",
                url: '/User/AddTeamEmail',
                data: "{'email': '" + email + "'}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",


                success: function (r) {
                    alert("success");
                    alert(r + " record(s) inserted.");
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    alert("Status: " + textStatus); alert("Error: " + errorThrown);
                    alert("error")
                }
            });



        })

        $("#btnEmail3").click(function () {
            debugger;
            var email3 = $("#email3").val();
            var chk3 = $("#chk3").val();

            $.ajax({

                url: "/User/AddTeamEmail",
                data: JSON.stringify(email3 + chk3),
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (r) {
                    alert(r + " record(s) inserted.");
                }
            });
        })
    });
</script>

My view page code:

 <div class="form-example-area">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="form-example-wrap mg-t-30">
                        <div class="cmp-tb-hd cmp-int-hd">
                        </div>
                        <div class="form-example-int form-horizental">


                            <div class="form-group">
                                <div class="row">
                                    <div class="col-lg-2 col-md-3 col-sm-3 col-xs-12">
                                        @Html.LabelFor(model => model.email, htmlAttributes: new { @class = "hrzn-fm" })
                                    </div>
                                    <div class="col-lg-4 col-md-12 col-sm-12 col-xs-12">
                                        <div class="nk-int-st">
                                            @Html.EditorFor(model => model.email, new { htmlAttributes = new { @class = "form-control input-sm" ,@id = "email1" } })
                                        </div>
                                        <input type="checkbox" name="role" value="Executive" id="chk1"  /><button onclick="btnEmail1()" type="submit">Add</button>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="row">
                                    <div class="col-lg-2 col-md-3 col-sm-3 col-xs-12">
                                        @Html.LabelFor(model => model.email, htmlAttributes: new { @class = "hrzn-fm" })
                                    </div>
                                    <div class="col-lg-6 col-md-4 col-sm-7 col-xs-12">
                                        <div class="nk-int-st">
                                            @Html.EditorFor(model => model.email, new { htmlAttributes = new { @class = "form-control input-sm", @id = "email2" } })
                                        </div>
                                        <input type="checkbox" name="role" value="senior user" id="chk2"  /><button id="btnEmail2" type="submit">Add</button>

                                    </div>
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="row">
                                    <div class="col-lg-2 col-md-3 col-sm-3 col-xs-12">
                                        @Html.LabelFor(model => model.email, htmlAttributes: new { @class = "hrzn-fm" })
                                    </div>
                                    <div class="col-lg-6 col-md-4 col-sm-7 col-xs-12">
                                        <div class="nk-int-st">
                                            @Html.EditorFor(model => model.email, new { htmlAttributes = new { @class = "form-control input-sm", @id = "email3" } })
                                        </div>
                                        <input type="checkbox" name="role" value="supplier" id="chk3"  /><button type="submit" onclick="btnEmail3()">Add</button>

                                    </div>
                                </div>
                            </div>
                            </div>
                        </div>
                </div>
                </div>
            </div>
        </div>

controller:

  public ActionResult AddTeamEmail(string email )
    {
        return View();

        //return View("ok" ,JsonRequestBehavior.AllowGet);
    }
Ad

Answer

I found this Insert multiple record using Ajax call working for me.

Ad
source: stackoverflow.com
Ad