如何使用 Telerik MVC 网格重新绑定 Json 对象

发布于 2024-11-01 20:51:53 字数 4909 浏览 3 评论 0原文

我在使用 Json 对象重新绑定网格时遇到问题…。 我正在尝试创建自定义删除按钮... 到目前为止,我有 Jquery 函数:获取所选列(用户名)的 ID 并调用控制器操作“UserDetails”

删除按钮:

$("#DeleteUser").click(function () {
    if (id != "") {
        var answer = confirm("Delete user " + id)
        if (answer) {
            $.ajax({
                type: "POST",
                url: "/Admin/UserDetails",
                data: "deleteName=" + id,
                success: function (data) {

                }
            });
        }
    } else {
        $("#erorMessage").html("First you must select user you whant to delete!");
    }
});

这是操作控制器 UserDetails(stringstartsWith, stringdeleteName)

[GridAction]
    public ActionResult UserDetails(string startsWith, string deleteName)
    {   // Custom search...
        if (!string.IsNullOrEmpty(startsWith))
        {
            return GetSearchUserResult(startsWith);
        }
        if (!string.IsNullOrEmpty(deleteName))
        {
            TblUserDetails user = db.TblUserDetails.Single(a => a.TblUser.userName == deleteName);
            try
            {
                TblUser userToDelete = db.TblUser.Single(a => a.userId == user.TblUser.userId);
                db.DeleteObject(user);
                db.DeleteObject(userToDelete);

                db.SaveChanges();
                Membership.DeleteUser(deleteName);

                List<UserDto> retModelData = new List<UserDto>();
                //GetAllUsers() returns a List<UserDto> of users.
                retModelData = GetAllUsers();

                var model = new GridModel
                {
                    Data = retModelData,
                    Total = GetAllUsers().Count()
                };
                return View(model);
            }
            catch
            {
                return View(new GridModel());
            }
        }

        else
        {
            var user = GetAllUsers();
            return View(new GridModel(user));
        }
    }

到目前为止,一切正常。但是我可以将我的网格与这些 Json 数据绑定吗?如何绑定? 这是我的 Json 结果,我想与网格绑定......

在这里是我的网格

@(Html.Telerik().Grid<App.Web.Models.UserDto>()
.Name("Grid")
.DataKeys(key =>
{
    key.Add(a => a.Id);
})
.Columns(column =>
{
    column.Bound(a => a.Username).Filterable(false);
    column.Bound(a => a.FirstName).Filterable(false);
    column.Bound(a => a.LastName).Filterable(false);
    column.Bound(a => a.Email).Filterable(false);
})
.DetailView(detailView => detailView.ClientTemplate(
                "<table id='DetailTable'><tbody><tr class='UserRow'><td class='Tbllable'><b>First name</b></td><td><#= FirstName #></td>"
                        + "<td></td><td></td>"
                        + "</tr><tr><td class='Tbllable'><b>Last name</b></td>"
                        + "<td><#= LastName #></td>"
                        + "<td id='Roles'></td><td id='Operations'></td>"
                        + "</tr><tr><td class='Tbllable'><b>Username</b></td><td><#= Username #></td></tr><tr><td class='Tbllable'><b>Address</b></td>"
                        + "<td><#= Address #></td></tr><tr><td class='Tbllable'><b>Email</b></td><td><#= Email #></td></tr><tr><td class='Tbllable'><b>Birth date</b></td>"
                        + "<td></td></tr><tr><td class='Tbllable'><b>Registration date</b></td><td></td></tr><tr><td class='Tbllable'><b>Phone number</b></td>"
                        + "<td><#= PhoneNumberHome #></td></tr><tr><td class='Tbllable'><b>Mobile number</b></td><td><#= PhoneNumberMobile #></td></tr></tbody></table>"
                ))
//.EnableCustomBinding(true)
.DataBinding(bind => bind.Ajax().Select("UserDetails", "Admin", new { startsWith = ViewBag.startsWith }))
.Pageable(paging =>
        paging.PageSize(12)
              .Style(GridPagerStyles.NextPreviousAndInput)
              .Position(GridPagerPosition.Bottom)
    )
.ClientEvents(e => e
    .OnRowDataBound("Expand")
    .OnRowSelect("select")
    .OnLoad("replaceConfirmation")
)
    .RowAction(row =>
    {
        if (row.Index == 0)
        {
            row.DetailRow.Expanded = true;
        }
    })
.Editable(editing => editing.Mode(GridEditMode.PopUp))
.Selectable()
.Sortable()

:)

Im having problem with rebinding grid with Json object….
I
m trying to create custom delete button…
So far I have Jquery function: Gets an ID of selected column (username) and call controller action “UserDetails”

Delete button:

$("#DeleteUser").click(function () {
    if (id != "") {
        var answer = confirm("Delete user " + id)
        if (answer) {
            $.ajax({
                type: "POST",
                url: "/Admin/UserDetails",
                data: "deleteName=" + id,
                success: function (data) {

                }
            });
        }
    } else {
        $("#erorMessage").html("First you must select user you whant to delete!");
    }
});

This is action controller UserDetails(string startsWith, string deleteName)

[GridAction]
    public ActionResult UserDetails(string startsWith, string deleteName)
    {   // Custom search...
        if (!string.IsNullOrEmpty(startsWith))
        {
            return GetSearchUserResult(startsWith);
        }
        if (!string.IsNullOrEmpty(deleteName))
        {
            TblUserDetails user = db.TblUserDetails.Single(a => a.TblUser.userName == deleteName);
            try
            {
                TblUser userToDelete = db.TblUser.Single(a => a.userId == user.TblUser.userId);
                db.DeleteObject(user);
                db.DeleteObject(userToDelete);

                db.SaveChanges();
                Membership.DeleteUser(deleteName);

                List<UserDto> retModelData = new List<UserDto>();
                //GetAllUsers() returns a List<UserDto> of users.
                retModelData = GetAllUsers();

                var model = new GridModel
                {
                    Data = retModelData,
                    Total = GetAllUsers().Count()
                };
                return View(model);
            }
            catch
            {
                return View(new GridModel());
            }
        }

        else
        {
            var user = GetAllUsers();
            return View(new GridModel(user));
        }
    }

So far everything is working OK. But can I bind my grid with these Json data and how???
This is my Json result that I want to bind with grid...

And here is my grid:

@(Html.Telerik().Grid<App.Web.Models.UserDto>()
.Name("Grid")
.DataKeys(key =>
{
    key.Add(a => a.Id);
})
.Columns(column =>
{
    column.Bound(a => a.Username).Filterable(false);
    column.Bound(a => a.FirstName).Filterable(false);
    column.Bound(a => a.LastName).Filterable(false);
    column.Bound(a => a.Email).Filterable(false);
})
.DetailView(detailView => detailView.ClientTemplate(
                "<table id='DetailTable'><tbody><tr class='UserRow'><td class='Tbllable'><b>First name</b></td><td><#= FirstName #></td>"
                        + "<td></td><td></td>"
                        + "</tr><tr><td class='Tbllable'><b>Last name</b></td>"
                        + "<td><#= LastName #></td>"
                        + "<td id='Roles'></td><td id='Operations'></td>"
                        + "</tr><tr><td class='Tbllable'><b>Username</b></td><td><#= Username #></td></tr><tr><td class='Tbllable'><b>Address</b></td>"
                        + "<td><#= Address #></td></tr><tr><td class='Tbllable'><b>Email</b></td><td><#= Email #></td></tr><tr><td class='Tbllable'><b>Birth date</b></td>"
                        + "<td></td></tr><tr><td class='Tbllable'><b>Registration date</b></td><td></td></tr><tr><td class='Tbllable'><b>Phone number</b></td>"
                        + "<td><#= PhoneNumberHome #></td></tr><tr><td class='Tbllable'><b>Mobile number</b></td><td><#= PhoneNumberMobile #></td></tr></tbody></table>"
                ))
//.EnableCustomBinding(true)
.DataBinding(bind => bind.Ajax().Select("UserDetails", "Admin", new { startsWith = ViewBag.startsWith }))
.Pageable(paging =>
        paging.PageSize(12)
              .Style(GridPagerStyles.NextPreviousAndInput)
              .Position(GridPagerPosition.Bottom)
    )
.ClientEvents(e => e
    .OnRowDataBound("Expand")
    .OnRowSelect("select")
    .OnLoad("replaceConfirmation")
)
    .RowAction(row =>
    {
        if (row.Index == 0)
        {
            row.DetailRow.Expanded = true;
        }
    })
.Editable(editing => editing.Mode(GridEditMode.PopUp))
.Selectable()
.Sortable()

)

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文