MOSS 2007：向 ListView Web 部件添加筛选器

Question

我参与了一个 sharepoint 2007 项目，而且我在更改现有 Web 部件方面经验相对较少。

我的第一个任务是向列表视图中三列中的两列添加过滤器。我的首席开发人员建议尝试添加 jquery 组合框过滤器，另一位开发人员建议扩展 Web 部件并覆盖某些功能。

我认为一个不错的选择是更改列表视图标题的上下文菜单，这样就不会出现“显示过滤器选项”显示仅响应第一个字母的标准下拉列表，而是会有一个 jquery 组合框。如果企业要求的话，也许可以更改该选项的措辞。

我问你的问题是，解决这个问题的好方法是什么？另外，除了阅读书籍和博客之外，还有哪些资源可以指导 SP 新手做到这一点？

谢谢。

Answer 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 部件将其添加到页面。