ASP.NET部分页面上传无UpdatePanel /使用jQuery

我有一个ASPX页面。在顶部我显示5个类别（例如：笔，书，鞋，手机，镜像）当我点击任何类别，我想要在标题下方显示该类别下的产品。我不想重新加载整个页面。我想保持我的页面原样（页眉，页脚和侧面板），当点击发生，除了图像的中心位置（可能是一个DIV或表来显示产品）。最好的办法是做到这一点？。我不想去ASP.NET Ajax更新面板。我已经在我的项目中使用jQuery了。无论如何有jQuery做到这一点？请提前。谢谢ASP.NET部分页面上传无UpdatePanel /使用jQuery

来源

2009-05-22 Shyju

有关JSON的更多信息已添加到我的答案中，您可以结合下面给出的所有好答案，并从中找出您自己的解决方案:) – Kirtan 2009-05-22 11:57:12

正如Kirtan提到的，最简单的回答是是使用更新面板。

如果您不想走这条路线，那么您可以使用jQuery对一个IHttpHandler进行Ajax调用，该IHttpHandler返回您需要填充要更新的面板的数据。

的步骤会去如下：

使用jQuery称之为 “.ashx” 的Ajax处理。
让您的“.ashx”文件以您选择的格式生成响应。这可以是JSON或XML（如果您希望JavaScript解析出响应并生成列表），或者将HTML内容本身添加到页面中。
jQuery将收到您的处理程序的响应，并使用适当的数据填充面板。

有几个关于如何使用IHttpHander的教程。基本上，它是一个非常简单的接口，ASP.NET的“Page”类源自于此。它比Page类重量轻得多，因此您可以获得比UpdatePanel更好的性能，但是，与大多数性能提升技术一样，您的代码稍微复杂一些。

这里是a tutorial on how to use an IHttpHandler类。

来源

2009-05-22 11:48:12

根据我的说法，使用UpdatePanel环绕Repeater/DataGrid/GridView将是一个更容易实现的方法。

它也可以用jQuery来完成。它包括发送CateogryId使用ajax请求到服务器，得到产品'JSON作为回应，并使用DOM操作填充与JSON数据的div。

编辑：使用JSON，复杂的数据可以用易读的文本格式表示，面向对象的方式。看看这个 -

var person = { 
    "firstName": "John", 
    "lastName": "Smith", 
    "address": { 
     "streetAddress": "21 2nd Street", 
     "city": "New York", 
     "state": "NY", 
     "postalCode": 10021 
    }, 
    "phoneNumbers": [ 
     "212 555-1234", 
     "646 555-4567" 
    ] 
};

person是由下列属性的JSON对象：“名字”，“姓氏”等，您可以使用person.firstName，person.lastName等访问这些属性。

这是JSON的一个例子，您可以利用它创建包含产品信息的自己的JSON字符串，并将其以数组形式发送给客户端。总之，这将是对象的一个这样的数组 -

var persons = [person1, person2, person3, ...]; //person1, person2, etc. are objects like the person object declared above.

可以使用DataContractJsonSerializer类（在框架3.5）进行序列化/反序列化对象，并从JSON。如果您使用Framework < 3.5，则可以使用JavaScriptSerializer类AjaxToolKit来执行相同操作。

来源

2009-05-22 11:40:55 Kirtan

谢谢Kirtan。我想为每个产品提供4个或5个属性。如何获得这些产品？我不知道JSON的用法。任何指导我的例子？ – Shyju 2009-05-22 11:45:46

我会建议在

calling Web Services using jQuery

或

calling Page Methods using jQuery读了。

根据您的Web应用程序运行的位置（Intranet而不是Internet），使用UpdatePanel可能是实现AJAX样式功能的更快选项。

来源

2009-05-22 11:46:59

你也可以考虑一个“快速和肮脏”的解决方案：在你的页面代码后面，实现ICallbackEventHandler，然后返回一个html代码块，将其填入你的div或table中。

更新：看看http://msdn.microsoft.com/en-us/library/ms178208.aspx了解您需要实现的更多细节。

来源

2009-05-22 12:45:35 chris

ASP.NET部分页面上传无UpdatePanel /使用jQuery

回答

相关问题