简体   繁体   English

使用asp.net C#和jquery过滤数据集合

[英]Using asp.net C# and jquery to filter a collection of data

I'm developing a webpage where users can filter data and then export the selection to pdf or excel. 我正在开发一个网页,用户可以在其中过滤数据,然后将选择内容导出为pdf或excel。 The website is using ASP .NET C#. 该网站正在使用ASP .NET C#。

To filter the data I have crated a webpage containing a left column with boxes and drop downs enabling users to enter search criteria and then click a search button. 为了筛选数据,我创建了一个网页,该网页包含一个带有框和下拉菜单的左列,使用户能够输入搜索条件,然后单击搜索按钮。 This is the typical search/filter functionality that a lot of websites contains. 这是许多网站包含的典型搜索/过滤器功能。 After filtering the data, the selecting is displayed using an asp listview. 过滤数据后,将使用asp列表视图显示选择。 This listview generates a table. 此列表视图生成一个表。 I've implemented Dragtable , enabling users to alter the sequence of the columns in this table, and also the columnManager enabling users to select which columns to display. 我已经实现了Dragtable ,使用户可以更改此表中列的顺序,还可以实现columnManager,使用户可以选择要显示的列。

So my problem is that the filter/search functionality is resolved back-end using asp .net C#, while the selecting and rearranging of columns is done client-side using jQuery. 所以我的问题是,使用asp .net C#在后台解析了过滤器/搜索功能,而使用jQuery在客户端进行了列的选择和重新排列。 When users now click the "export"-button, I'd like to collect the filter done by the asp controls in addition to the filter done by jQuery, and create the file. 现在,当用户单击“导出”按钮时,除了由jQuery完成的筛选器之外,我还希望收集由asp控件完成的筛选器,并创建文件。 This file should only contain the columns selected using columnManager, in the same order they are in after being altered using dragtable. 该文件应仅包含使用columnManager选择的列,并以使用dragtable进行更改后的顺序相同。

What is best practice when using both server side filter and client side filter? 同时使用服务器端过滤器和客户端过滤器的最佳实践是什么? I've also considered to drop all of the server-side filtering and use only ajax.post() to send all filters in JSON format to the server. 我还考虑过删除所有服务器端过滤,而仅使用ajax.post()将所有JSON格式的过滤器发送到服务器。 I also want to enable users to save their current filter for another time. 我还希望使用户能够再次保存其当前过滤器。

Update 更新资料

I've decided to drop the server side and use ajax (getJSON to be more precisely) to get the search result. 我决定删除服务器端,并使用ajax(更精确地说是getJSON)来获取搜索结果。 This way I don't loose the ordering and sorting of columns that is done with jQuery/js, which I would with a post-back (could use cookies'n stuff, of course). 这样,我就不会松散使用jQuery / js完成的列的排序和排序,而我会回发一次(当然可以使用Cookies的东西)。 I also keep all the logic in one place, and JSON objects can easily be wrapped/unwrapped server-side. 我还将所有逻辑都放在一个地方,并且JSON对象可以很容易地在服务器端进行包装/展开。 Thanks for your answers, though! 不过,谢谢您的回答!

It's not at all bad to have Client side and Server side working at same place. 客户端和服务器端在同一位置工作并不坏。 All the good applications running in the world have these combination together. 世界上所有运行良好的应用程序都将这些组合在一起。

However we need to see the approach. 但是,我们需要了解这种方法。

If you don't want any postbacks , I would recommend to go with Jquery. 如果您不希望有任何回发,我建议您使用Jquery。

If you are ok with roundtrips, go ahead with Server Side and Ajax. 如果您可以往返,请继续使用Server Side和Ajax。

Your approach has another problem: What happens if the user orders the columns first and than filters it? 您的方法还有另一个问题:如果用户先订购列而不是对其进行过滤,会发生什么? The order of the columns is resetted. 列的顺序被重置。

However with the jquery ui draggable you are able to fire ajax calls to notify the server side code about the change. 但是,通过可拖动的jQuery ui,您可以触发ajax调用,以将有关更改通知服务器端代码。 You can bind a function to the stop event: http://api.jqueryui.com/draggable/#event-stop 您可以将函数绑定到停止事件: http : //api.jqueryui.com/draggable/#event-stop

So I would do the following: 因此,我将执行以下操作:

  • Fire ajax call when the user changes the order of the columns, but do not refresh the data 当用户更改列的顺序但不刷新数据时触发ajax调用
  • Fire ajax calls when the user adds a filter AND refresh the data 用户添加过滤器并刷新数据时触发ajax调用

The server side code is always up to date and renders the correct ouput if it has to. 服务器端代码始终是最新的,并根据需要呈现正确的输出。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM