2011-09-15 9 views
0

私はSharePoint 2007プロジェクトに参加しましたが、既存のWebパーツを変更する経験はほとんどありません。MOSS 2007:ListView Webパーツにフィルタを追加する

私の最初の作業は、リストビューで3つのうち2つの列にフィルタを追加することです。 My Lead Devはjqueryのコンボボックスフィルタを追加しようと提案し、別の開発者はWebパーツを拡張して機能の一部をオーバーライドすることを提案しています。

良いオプションは、リストビューヘッダーのコンテキストメニューを変更することです。最初の文字にしか応答しない標準のドロップダウンリストを表示する「フィルタの選択肢を表示」ではなく、jqueryコンボボックス。ビジネスが要求する場合は、そのオプションの言い回しを変更します。

あなたに私の質問は、これを取る良い道は何でしょうか?また、書籍やブログの周りを辿るだけでなく、これを行うための初心者ガイドもあります。

ありがとうございました。

答えて

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パーツを経由してページに追加する必要があります。

関連する問題