Javascript 立即通过动态复选框过滤SharePoint列表（使用C#和/或Ajax）

我目前正在寻找一种在SharePoint中向列表添加过滤功能的方法，该功能通过复选框选择过滤列表内容

这个小模型可能有助于理解我所说的：

其想法是在右侧有一个普通的SharePoint自定义列表，在左侧有一个复选框列表，该列表将根据列表的内容动态生成->一列是“过滤器组”，所有字段内容都是过滤器值

在左侧选择一个或多个值时，列表中的项目应立即进行相应过滤（ajax，无需重新加载页面）。 例如，在模型中，选择“纽约”和“蓝色”只会显示项目“史蒂夫的汽车”

你现在，就像一个产品过滤器在几乎每一个网上商店等等

如何才能做到这一点？如果这可以包含在我的解决方案包中（其中已经包含了C#/jQuery中的其他内容），那就太棒了

我不熟悉SharePoint中的前端定制，但我相信有一种方法：-）

编辑：顺便说一下，我正在使用SP2016。

潘多拉

据我所知，您的第一个问题是如何从逻辑上获取左侧过滤器的值。我看到有两种方法：第一种方法，您可以构建caml查询并从列表中获取项；第二种方法是，您可以使用ctx.ListData，它由sharepoint自己初始化，并在ctx.ListData.Row（项目数组）中处理项目并获取唯一的字段值。请注意，ctx.ListData.Row仅包含页面列表视图中加载的项

对于列表过滤，您可以为页面的哈希设置过滤器链接。示例：“？List={ListID}&View={ViewID}&FilterField1=Color-FilterValue1=Blue”。尝试筛选列表中的列，您将看到url修改。可以通过ctx.listName和ctx.view检索ListID和ViewId

然后将其传递到函数MyRefreshPageToEx中。列表将被筛选

函数过滤器列表（）{
var tableId=$（“.ms listviewtable”）.attr（“id”）；
var filterUrl=“？List={ListID}&View={ViewID}&FilterField1=Color-FilterValue1=Blue”；
MyRefreshPageToEx（tableId，filterUrl，false）；
}
函数MyRefreshPageToEx（lvTableID、url、bForceSubmit）{
var tblv=document.getElementById（lvTableID）；
var clvp=CLVPFromCtx（tblv）；
if（clvp！=null&&clvp.ctx.IsClientRendering）{
clvp.RefreshPaging（url）；
clvp.ctx.queryString=url；
if（（typeof clvp.ctx.operationType==“undefined”| | clvp.ctx.operationType==splistooperationtype.Default）&&Boolean（clvp.ctx.ListData））{
var fromPage=clvp.ctx.ListData.FirstRow-1；
var toPage=Number（GetUrlKeyValue（“PageFirstRow”，false，url））；
如果（！isNaN（fromPage）&&！isNaN（toPage）&&fromPage！=toPage）
fromPage

潘多拉

据我所知，您的第一个问题是如何从逻辑上获取左侧过滤器的值。我看到有两种方法：第一种方法，您可以构建caml查询并从列表中获取项；第二种方法是，您可以使用ctx.ListData，它由sharepoint自己初始化，并在ctx.ListData.Row（项目数组）中处理项目并获取唯一的字段值。请注意，ctx.ListData.Row仅包含页面列表视图中加载的项

对于列表过滤，您可以为页面的哈希设置过滤器链接。示例：“？List={ListID}&View={ViewID}&FilterField1=Color-FilterValue1=Blue”。尝试筛选列表中的列，您将看到url修改。可以通过ctx.listName和ctx.view检索ListID和ViewId

然后将其传递到函数MyRefreshPageToEx中。列表将被筛选

函数过滤器列表（）{
var tableId=$（“.ms listviewtable”）.attr（“id”）；
var filterUrl=“？List={ListID}&View={ViewID}&FilterField1=Color-FilterValue1=Blue”；
MyRefreshPageToEx（tableId，filterUrl，false）；
}
函数MyRefreshPageToEx（lvTableID、url、bForceSubmit）{
var tblv=document.getElementById（lvTableID）；
var clvp=CLVPFromCtx（tblv）；
if（clvp！=null&&clvp.ctx.IsClientRendering）{
clvp.RefreshPaging（url）；
clvp.ctx.queryString=url；
if（（typeof clvp.ctx.operationType==“undefined”| | clvp.ctx.operationType==splistooperationtype.Default）&&Boolean（clvp.ctx.ListData））{
var fromPage=clvp.ctx.ListData.FirstRow-1；
var toPage=Number（GetUrlKeyValue（“PageFirstRow”，false，url））；
如果（！isNaN（fromPage）&&！isNaN（toPage）&&fromPage！=toPage）
fromPage

---

我的建议对你有帮助吗？我的建议对你有帮助吗？

function FilterList(){
  var tableId = $(".ms-listviewtable").attr("id");
  var filterUrl = "?List={ListID}&View={ViewID}&FilterField1=Color-FilterValue1=Blue";
  MyRefreshPageToEx(tableId, filterUrl, false);
}

function MyRefreshPageToEx(lvTableID, url, bForceSubmit) {
    var tblv = document.getElementById(lvTableID);
    var clvp = CLVPFromCtx(tblv);

    if (clvp != null && clvp.ctx.IsClientRendering) {
        clvp.RefreshPaging(url);
        clvp.ctx.queryString = url;
        if ((typeof clvp.ctx.operationType == "undefined" || clvp.ctx.operationType == SPListOperationType.Default) && Boolean(clvp.ctx.ListData)) {
            var fromPage = clvp.ctx.ListData.FirstRow - 1;
            var toPage = Number(GetUrlKeyValue("PageFirstRow", false, url));

            if (!isNaN(fromPage) && !isNaN(toPage) && fromPage != toPage)
                fromPage < toPage ? (clvp.ctx.operationType = SPListOperationType.PagingRight) : (clvp.ctx.operationType = SPListOperationType.PagingLeft);
        }
    }
    else {
        SubmitFormPost(url, bForceSubmit);
    }
}