Kendo 按钮应该使用 ASP.NET MVC 在 kendo window 中显示记录

Kendo button should display record in kendo window using ASP.NET MVC

我正在使用 ASP.NET MVC 和 Kendo UI MVC。我有一个编辑按钮,应该在 Kendo Window 中显示当前记录。 这是我的按钮:

@(Html.Kendo().Button()
    .Name("editButton")
    .HtmlAttributes(new { type = "button" })
    .Content("Edit Record")
    .Events(ev => ev.Click("onClick"))        

)

这里是JavaScript代码:

$("#editButton")
    .bind("click", function () {
        //alert("OK");
        location.href = '@Url.Content("~/Students/StudentDetails/EditStudentRecord?StudentID=" + @ViewBag.url)';
        //$("#studentWindow").data("kendoWindow").open();
    });

并且此按钮应 post 此操作方法的 ID:

[HttpGet]
    public JsonResult EditStudentRecord(int? StudentID) 
    {
        Student student = new Student();
        ViewBag.StudentID = new SelectList(db.Student, "StudentID", "UserName");

        student = db.Student.Find(StudentID);
        ViewBag.ShouldClose = false;
        return Json(student, JsonRequestBehavior.AllowGet);
    }

但我遇到错误,无法在 window 中获取记录。 提前致谢。

如果我能理解您的意图,您似乎遇到了一些问题。下面是我将如何解决这个问题。

将您的 EditStudentRecord 端点更改为 return a PartialViewResult 而不是 JSON,如下所示。

[HttpGet]
public PartialViewResult EditStudentRecord(int? StudentID) 
{
    Student student = new Student();
    ViewBag.StudentID = new SelectList(db.Student, "StudentID", "UserName");

    student = db.Student.Find(StudentID);
    ViewBag.ShouldClose = false;

    return PartialView("_EditStudentRecord", student);
}

请注意,您需要创建一个新的局部视图,在我的示例中称为“_EditStudentRecord”。

然后我会创建一个 Kendo Window,类似于以下内容:

@(Html.Kendo.Window()
    .Name("edit-student-window")
    .Title("Edit Student Record")
    .Width(400)
    .Modal(true)
    .Visible(false)
    .LoadContentFrom("EditStudentRecord", "StudentDetails", new { studentID = ViewBag.StudentID })

然后您可以将按钮的 JS 更改为与此类似(请注意,我可能会更改此函数的名称,但由于它是您的按钮中引用的名称,所以我保留了它)。

function onClick() {
    $('#edit-student-window').data('kendoWindow').open();
}