【问题标题】:MOSS 2007: Adding Filter to ListView web partMOSS 2007:向 ListView Web 部件添加筛选器
【发布时间】:2011-11-18 02:00:33
【问题描述】:
我参与了一个 sharepoint 2007 项目,我在更改现有 webpart 方面的经验相对较少。
我的第一个任务是在列表视图的三列中的两列中添加一个过滤器。我的首席开发人员建议尝试添加一个 jquery 组合框过滤器,另一位开发人员建议扩展 Web 部件并覆盖一些功能。
我认为一个不错的选择是更改列表视图标题的上下文菜单,以便“显示过滤器选择”不会显示仅响应第一个字母的标准下拉列表,而是会有一个 jquery 组合框.如果业务需要,也许可以更改该选项的措辞。
我的问题是,什么是解决这个问题的好方法?另外,除了翻阅书籍和博客之外,还有哪些资源可以指导 sp 新手这样做?
谢谢。
【问题讨论】:
标签:
sharepoint
sharepoint-2007
web-parts
moss
【解决方案1】:
这样的事情怎么样:
<script src="http://www.google.com/jsapi"></script>
<script>
google.load("jquery", "1.2.6");
google.setOnLoadCallback(function() {
$(document).ready(function()
{
jQuery.extend(jQuery.expr[':'], {
containsIgnoreCase: "(a.textContent||a.innerText||jQuery(a).text()||'').toLowerCase().indexOf((m[3]||'').toLowerCase())>=0"
});
$("table.ms-listviewtable tr.ms-viewheadertr").each(function()
{
if($("td.ms-vh-group", this).size() > 0)
{
return;
}
var tdset = "";
var colIndex = 0;
$(this).children("th,td").each(function()
{
if($(this).hasClass("ms-vh-icon"))
{
// attachment
tdset += "<td></td>";
}
else
{
// filterable
tdset += "<td><input type='text' class='vossers-filterfield' filtercolindex='" + colIndex + "' /></td>";
}
colIndex++;
});
var tr = "<tr class='vossers-filterrow'>" + tdset + "</tr>";
$(tr).insertAfter(this);
});
$("input.vossers-filterfield")
.css("border", "1px solid #7f9db9")
.css("width", "100%")
.css("margin", "2px")
.css("padding", "2px")
.keyup(function()
{
var inputClosure = this;
if(window.VossersFilterTimeoutHandle)
{
clearTimeout(window.VossersFilterTimeoutHandle);
}
window.VossersFilterTimeoutHandle = setTimeout(function()
{
var filterValues = new Array();
$("input.vossers-filterfield", $(inputClosure).parents("tr:first")).each(function()
{
if($(this).val() != "")
{
filterValues[$(this).attr("filtercolindex")] = $(this).val();
}
});
$(inputClosure).parents("tr.vossers-filterrow").nextAll("tr").each(function()
{
var mismatch = false;
$(this).children("td").each(function(colIndex)
{
if(mismatch) return;
if(filterValues[colIndex])
{
var val = filterValues[colIndex];
// replace double quote character with 2 instances of itself
val = val.replace(/"/g, String.fromCharCode(34) + String.fromCharCode(34));
if($(this).is(":not(:containsIgnoreCase('" + val + "'))"))
{
mismatch = true;
}
}
});
if(mismatch)
{
$(this).hide();
}
else
{
$(this).show();
}
});
}, 250);
});
});
});
需要通过内容编辑器 Web 部件将其添加到页面。