Javascript 使用Ajax将Json数据添加到表中而不刷新MVC中的页面？

我有订单表和订单注释表。OrderNotes中包含外键OrderID。我想使用AJAX将JSON数据插入到我的OrderNotes表中。下面是我的代码

下面是包含Ajax的asps文件

<script>
   $(document).ready(function () {
                $.ajax({
                    url: "Orders/Index",
                    type: 'POST',
                    success: function (data) {
                        $("#divContent").html(data);
                        $('.dropdown').hover(function () {
                            var $text = $(this).closest("tr").find(".nearest").text();
                        $.ajax({
                            url: "OrderNotes/Index?orderId=" + $text + "",
                            type: 'POST',
                            success: function (data) {
                                $(".orderContent").html(data);
                                function CreateOrderNotes() {
                                    var Bywho = $("#By").val();
                                    var NoteBy = $("#Note").val();
                                    var OrderIdgiven = $("#OrderID").val();
                                    var $text = $(this).closest("tr").find(".nearest").text();
                                    $.ajax({
                                        type: "POST",
                                        URL: "OrderNotes/Create",
                                        data: JSON.stringify({
                                            By: Bywho, Note: NoteBy, OrderID: OrderIdgiven
                                        }),
                                        contentType: "application/json",
                                        success: function (result) {
                                            $("#table").append("<tr><td>" +
                                                result.OrderNotesID + "</td><td>" +
                                                result.By + "</td><td>" +
                                                result.Note + "</td><td>" +
                                                result.OrderID + "</td></tr>")
                                        }
                                    });
                                }
                            }
                        });


                    });
                }
            });

        });
    </script>
    <div id="divContent" class="container">
    </div>

$（文档）.ready（函数（）{
$.ajax({
url:“订单/索引”，
键入：“POST”，
成功：功能（数据）{
$（“#divContent”）.html（数据）；
$（'.dropdown'）。悬停（函数（）{
var$text=$（this.nexist（“tr”）.find（“.nexist”）.text（）；
$.ajax({
url:“OrderNotes/Index？orderId=“+$text+”，
键入：“POST”，
成功：功能（数据）{
$（“.orderContent”）.html（数据）；
函数CreateOrderNotes（）{
var Bywho=$（“#By”）.val（）；
var NoteBy=$（“#Note”）.val（）；
var OrderIdgiven=$（“#OrderID”）.val（）；
var$text=$（this.nexist（“tr”）.find（“.nexist”）.text（）；
$.ajax({
类型：“POST”，
URL:“OrderNotes/Create”，
数据：JSON.stringify({
By:Bywho，Note:NoteBy，OrderID:OrderIdgiven
}),
contentType:“应用程序/json”，
成功：功能（结果）{
$（“#表”）。追加（“”+
result.OrderNotesID+“”+
结果由+“”+
结果。注意+“”+
result.OrderID+“”）
}
});
}
}
});
});
}
});
});

订单控制器和视图不重要，因此已排除这些文件

OrderNotes视图和控制器

OrderNotes控制器

namespace Ordernotes.Controllers
{
    public class OrderNotesController : Controller
    {
        private OrderDbContext db = new OrderDbContext();
        // GET: OrderNotes
        public ActionResult Index(int orderid)
        {
            List<OrderNote> OrderNotesforOrderId = new List<OrderNote>();
            if (db.Orders != null)
            {
                List<OrderNote> notesforeachorder = db.OrderNotes.Where(m => m.OrderID == orderid).ToList();
                foreach (var ev in notesforeachorder)
                {
                    OrderNotesforOrderId.Add(ev);
                }
            }
            return PartialView(OrderNotesforOrderId);
        }
        [HttpPost]
        public ActionResult Create(OrderNote orderNote)
        {
            OrderDbContext entities = new OrderDbContext();
            var notes = new OrderNote();
            notes.By =orderNote.By;
            notes.Note = orderNote.Note;
            notes.OrderID = orderNote.OrderID;
            entities.OrderNotes.Add(notes);
            entities.SaveChanges();
            return Json(notes, JsonRequestBehavior.AllowGet);
        }
    }
}

namespace Ordernotes.Controllers
{
公共类OrderNotesController:控制器
{
private OrderDbContext db=new OrderDbContext（）；
//获取：订购单
公共操作结果索引（int orderid）
{
List ordernotesforderId=new List（）；
如果（db.Orders！=null）
{
List notesforeachorder=db.OrderNotes.Where（m=>m.OrderID==OrderID.ToList（）；
foreach（票据预收器中的var ev）
{
OrderNotesforOrderId.Add（ev）；
}
}
返回PartialView（OrderNotesForderId）；
}
[HttpPost]
公共操作结果创建（OrderNote OrderNote）
{
OrderDbContext实体=新的OrderDbContext（）；
var notes=newordernote（）；
notes.By=orderNote.By；
notes.Note=orderNote.Note；
notes.OrderID=orderNote.OrderID；
实体.OrderNotes.Add（notes）；
entities.SaveChanges（）；
返回Json（notes，JsonRequestBehavior.AllowGet）；
}
}
}

订单索引

@model IEnumerable<Ordernotes.Models.OrderNote>
<table class="table" id="table">
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.OrderNoteID)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Note)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.By)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.OrderID)
        </th>
    </tr>
@foreach (var item in Model) {
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.OrderNoteID)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Note)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.By)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.OrderID)
        </td>
    </tr>
}
</table>
<div class="notesfooter div-table">
    @Html.Partial("Create",new Ordernotes.Models.OrderNote())
</div>

@model IEnumerable
@DisplayNameFor（model=>model.OrderNoteID）
@DisplayNameFor（model=>model.Note）
@DisplayNameFor（model=>model.By）
@DisplayNameFor（model=>model.OrderID）
@foreach（模型中的var项目）{
@DisplayFor（modelItem=>item.OrderNoteID）
@DisplayFor（modeleItem=>item.Note）
@DisplayFor（modeleItem=>item.By）
@DisplayFor（modelItem=>item.OrderID）
}
@Html.Partial（“创建”，new Ordernotes.Models.OrderNote（））

订单创建

@model Ordernotes.Models.OrderNote



<div class="form-horizontal">
    <div class="form-group">
        @Html.LabelFor(model => model.By, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.TextBoxFor(model => model.By, new { htmlAttributes = new { @class = "form-control" } })
        </div>
    </div>
    <div class="form-group">
        @Html.LabelFor(model => model.Note, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.TextBoxFor(model => model.Note, new { htmlAttributes = new { @class = "form-control" } })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.OrderID, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.TextBoxFor(model => model.OrderID, new { htmlAttributes = new { @class = "form-control", @readonly = "readonly" } })
        </div>
    </div>
    <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
            <a id="savesnotes" onclick="CreateOrderNotes()" class="btn btn-default" >Save</a>
        </div>
    </div>
</div>

@model Ordernotes.Models.OrderNote
@LabelFor（model=>model.By，htmlAttributes:new{@class=“controllabel col-md-2”}）
@TextBoxFor（model=>model.By，new{htmlAttributes=new{@class=“form control”}）
@LabelFor（model=>model.Note，htmlAttributes:new{@class=“controllabel col-md-2”}）
@TextBoxFor（model=>model.Note，new{htmlAttributes=new{@class=“form control”}）
@LabelFor（model=>model.OrderID，htmlAttributes:new{@class=“controllabel col-md-2”}）
@TextBoxFor（model=>model.OrderID，new{htmlAttributes=new{@class=“form control”，@readonly=“readonly”}）
拯救

---

只有第三个调用不起作用。无法确定如何发送JSON数据以及在OrderNotes创建函数中传递什么参数。

请阅读-总结是，这不是解决志愿者问题的理想方法，可能会对获得答案产生反作用。请不要在你的问题中添加这个。事实上，我必须在早上之前完成这个作业。这就是为什么我加了紧急？你能帮忙解决这个问题吗？如果你阅读我提供的链接，你会发现社区认为“紧急”请求是一种粗鲁行为，带有强烈的假设，即问题作者可以将社会义务强加给他们的读者。我们