当前位置：文江博客话题详情

如何制作ajax更新面板？（MVC2）

发布于 2024-10-16 07:06:13 字数 605 浏览 2 评论 0原文

我正在使用 Telerik 树视图控件：

我想要做的是在左侧设置此控件，然后在右侧设置一个“面板”，即单击树视图时更新的视图。

因此，我想在树视图中单击时进行 AJAX 调用以从数据库检索信息。然后我可以使用当前项目的信息更新“面板”。

我该如何构建这个“面板”？任何为 ASP.NET MVC2 设计的控件都更好，因为这就是我实现的。我看到了一个名为 UFRAME 的东西，但它让我想起了 IFRAME，并认为我应该避免使用它。

我可以使用部分视图来执行此操作，然后仅更新页面的部分视图区域吗？

谢谢。

原文

分享到QQ

分享到微博

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

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

勿忘初心 2024-10-23 07:06:13

Telerik TreeView 有：

OnSelect 客户端事件，
您希望订阅该事件，并
发生选择时发出 Ajax 调用
在 Asp.net MVC 应用程序控制器操作
，该操作将返回 < code>PartialView
然后您可以将其附加到右侧面板

这就是要开发的过程。

我一生中从未使用过 Telerik 的控件，但根据其页面上的文档，它似乎是这样工作的。除了您必须使用的 OnSelect 客户端事件之外，一切基本上都是常见的 Asp.net MVC + jQuery。因此，只要 Telerik 的控件按预期工作（这可能是一个独立的故事），就没有什么特别复杂的事情。

一些代码

由于我从未使用过 Telerik，我仍然认为这可以沿着线完成一些事情：

你在你的视图之一中定义了 TreeView，例如：
```
<%= Html.Telerik().TreeView().Name("ClientSideID") %>
```
然后使用 jQuery 完成其余操作：
<前><代码>$(函数(){
$("#ClientSideID").bind("选择", 函数(e){
e.preventDefault();
$.ajax({
url: "一些URL",
数据：e.item，
类型：“帖子”，
成功：函数（partialView）{
部分视图 = $(部分视图);
$("RightPanelSelector").append(partialView);
},
错误：函数（xhr，状态，错误）{
// 处理错误
}
});
});
});

此代码未经测试，但可以帮助您入门。

Telerik TreeView has:

OnSelect client side event that
you want to subscribe to and
issue an Ajax call when select happens
to your Asp.net MVC application controller action that
would return a PartialView which
you can then append to right panel

That's the process to be developed.

I've never used Telerik's controls in my life but based on the documentation on their page it seems that it works this way. Everything is basically the usual Asp.net MVC + jQuery except for the OnSelect client side event that you have to use. So nothing particularly complicated as long as Telerik's controls work as expected (which can be a story of its own).

Some code

Since I've never used Telerik, I still think this can be done something along the line:

You have your TreeView defined in one of your views like:
```
<%= Html.Telerik().TreeView().Name("ClientSideID") %>
```

Then use jQuery to do the rest:

$(function(){
    $("#ClientSideID").bind("select", function(e){
        e.preventDefault();
        $.ajax({
            url: "SomeURL",
            data: e.item,
            type: "POST",
            success: function(partialView) {
                partialView = $(partialView);
                $("RightPanelSelector").append(partialView);
            },
            error: function(xhr, status, err){
                // handle error
            }
        });
    });
});

This code isn't tested but will get you started.

回复收藏 0 原文

~没有更多了~