2012-03-16 20 views
-2

JQueryを使用してSharePointリストからリストアイテムデータを抽出し、そのデータを使用してSimile TimelineJavaScript関数が実行されていません(コンソールから関数 "関数ではありません"が返されます)

このページには、AJAXのいくつかの形式を使用すると思われるフィルタが含まれています。テキストボックスに入力された内容に基づいて、イベントがタイムラインに表示されます(例:here参照)。何らかの理由で、SharePoint上でこのすべてを実装すると(SharePointライブラリに.aspxファイルやその他の必要なファイルを置くだけで)、フィルタを除いてすべて動作します。コンソールログ(Firebugを使用)をチェックすると、エラーは次のようになります。

"onKeyPressは関数ではありません"。

onKeyPressは、フィルタの実装に関わる機能の一つですが、私は、ブラウザがにonKeyPressイベントを呼び出す関数を含む(同じ.jsファイルから他の関数​​のこの機能 - 多くを見ていない理由はわかりませんちょうどうまく動く)。問題をさらに奇妙なものにするために、関数が実行される直前にブレークポイントを置き、それを停止後も継続できるようにすると、すべて正常に動作します。

このことは、タイミング関連の問題になる可能性があると考えているように私につながるが、私はwindow.onload, $(document).readyで周りいじり、及び_spBodyOnLoadFunctionNameと呼ばれるSharePointの特定の機能についての日のために、コードの動作に影響を見ていないしてきました。

状況に最も関連すると思われるファイルが(下記)

<%@ Page Language="C#" MasterPageFile="~masterurl/default.master" inherits="Microsoft.SharePoint.WebPartPages.WebPartPage, Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" meta:progid="SharePoint.WebPartPage.Document" %> 

<asp:Content runat="server" ContentPlaceHolderID="PlaceHolderAdditionalPageHead"> 

    <script> 
     Timeline_ajax_url="timeline/timeline_ajax/simile-ajax-api.js"; 
     Timeline_urlPrefix='timeline/timeline_js/'; 
     Timeline_parameters='bundle=true'; 
    </script> 
    <script src="timeline/timeline_js/timeline-api.js" type="text/javascript"></script> 

    <script src="examples.js" type="text/javascript"></script> 
    <script> <script type="text/javascript" src="jquery-1.3.2.min.js"></script> 
    <script src="tline.js" type="text/javascript"></script> 
    <script type="text/javascript"> 

     $(document).ready(function() { 
      // Build the URL of the Lists.asmx web service. 
      // This is done by stripping the last two parts (/doclib/page) of the URL. 
      var hrefParts = window.location.href.split('/'); 
      var wsURL = ""; 
      for (i = 0; i < (hrefParts.length - 2); i++) { 
       if (i > 0) 
        wsURL += "/"; 
       wsURL += hrefParts[i]; 
      } 
      wsURL += "/_vti_bin/lists.asmx"; 

      // The SOAP Envelope to send to the Lists.asmx web service. 
      // Tip: this XML can be copied from /_vti_bin/lists.asmx?op=GetListCollection 
      var soapEnv = 
       "<soapenv:Envelope xmlns:soapenv='http://schemas.xmlsoap.org/soap/envelope/'> \ 
        <soapenv:Body xmlns='http://schemas.microsoft.com/sharepoint/soap/'> \ 
         <GetListItems> \ 
          <listName>SimileData</listName> \ 
         </GetListItems> \ 
        </soapenv:Body> \ 
       </soapenv:Envelope>"; 

      // Do the web service call async. 
      $.ajax({ 
       url: wsURL, 
       type: "POST", 
       dataType: "xml", 
       data: soapEnv, 
       complete: processResult, 
       contentType: "text/xml; charset=\"utf-8\"" 
      }); 
     }); 

     window.onresize=onResize; 

    </script> 

</asp:Content> 
<asp:Content runat="server" ContentPlaceHolderID="PlaceHolderMain"> 
    <ul id="data"> 
    </ul> 
    <div id="body"> 
     <h1>Simile Timeline Demo</h1> 
     <p>Timeline version <span id='tl_ver'></span>.</p> 
     <script>Timeline.writeVersion('tl_ver')</script> 

     <div id="tl" class="timeline-default" style="height: 300px;"> 
     </div> 
     <div class="footnotes"> 
      <br /> <br /> 
     </div> 

     <div class="controls" id="controls"> 
     </div> 
     <div class="theButton" id="theButton"> 
      <button type="button">Load Timeline</button> 
     </div> 
    </div> 

</asp:Content> 
<asp:Content runat="server" ContentPlaceHolderID="PlaceHolderPageTitleInTitleArea"> 
    List Details 
</asp:Content> 
<asp:Content runat="server" ContentPlaceHolderID="PlaceHolderPageTitle"> 
    List Details 
</asp:Content> 

tline.js、

var tl; 
var eventSource = new Timeline.DefaultEventSource(); 

function processResult(xData, status) { 
    var tStart, tEnd, tLate, tEarly, tTitle, tText, tLink; 
    var tInst = true; 
    var evt; 
    $(xData.responseXML).find("z\\:row").each(function() { 
     tTitle = $(this).attr("ows_Title0").split("#")[1]; 
     tStart = Timeline.DateTime.parseGregorianDateTime($(this).attr("ows_Delivery_x0020_Date").split(" ")[0]); 
     tText = $(this).attr("ows_Description_x0020_of_x0020_Chang"); 
     tLink = $(this).attr("ows_ID"); 
     tLink = "some_link_stuff" + tLink + "some_link_stuff"; 

     var evt = new Timeline.DefaultEventSource.Event(tStart, tEnd, tLate, tEarly, tInst, tTitle, tText); 
     evt._start = tStart; 
     evt._end = tStart; 
     evt._earliestEnd = tStart; 
     evt._latestStart = tStart; 
     evt._description = tText; 
     evt._title = tTitle; 
     evt._text = tTitle; 
     evt._link = tLink; 
     eventSource.add(evt); 
    }); 

    onLoad(); 
} 

function onLoad() { 

    var theme = Timeline.ClassicTheme.create(); 
    theme.event.bubble.width = 250; 
    theme.mouseWheel = 'zoom'; 

    var rightNow = new Date(); 
    var theDay = rightNow.getDate(); 
    theDay = theDay.toString(); 
    if(theDay.length < 2){ 
     theDay = "0" + theDay; 
    } 
    var theYear = rightNow.getFullYear(); 
    var theMonth = rightNow.getMonth() + 1; 
    theMonth = theMonth.toString(); 
    if(theMonth.length < 2){ 
     theMonth = "0" + theMonth; 
    } 

    var theDate = theYear + "-" + theMonth + "-" + theDay; 
    var date = Timeline.DateTime.parseGregorianDateTime(theDate); 

    var bandInfos = [ 
     Timeline.createBandInfo({ 
      width:   "80%", 
      intervalUnit: Timeline.DateTime.MONTH, 
      intervalPixels: 600, 
      eventSource: eventSource, 
      zoomIndex:  10, 
      zoomSteps:  new Array(
       {pixelsPerInterval: 280, unit: Timeline.DateTime.HOUR}, 
       {pixelsPerInterval: 140, unit: Timeline.DateTime.HOUR}, 
       {pixelsPerInterval: 70, unit: Timeline.DateTime.HOUR}, 
       {pixelsPerInterval: 35, unit: Timeline.DateTime.HOUR}, 
       {pixelsPerInterval: 400, unit: Timeline.DateTime.DAY}, 
       {pixelsPerInterval: 200, unit: Timeline.DateTime.DAY}, 
       {pixelsPerInterval: 100, unit: Timeline.DateTime.DAY}, 
       {pixelsPerInterval: 50, unit: Timeline.DateTime.DAY}, 
       {pixelsPerInterval: 1000, unit: Timeline.DateTime.MONTH}, 
       {pixelsPerInterval: 800, unit: Timeline.DateTime.MONTH}, 
       {pixelsPerInterval: 600, unit: Timeline.DateTime.MONTH}, 
       {pixelsPerInterval: 400, unit: Timeline.DateTime.MONTH}, 
       {pixelsPerInterval: 200, unit: Timeline.DateTime.MONTH}, 
       {pixelsPerInterval: 100, unit: Timeline.DateTime.MONTH}, 
       {pixelsPerInterval: 50, unit: Timeline.DateTime.MONTH}, 
       {pixelsPerInterval: 400, unit: Timeline.DateTime.YEAR}, 
       {pixelsPerInterval: 200, unit: Timeline.DateTime.YEAR}, 
       {pixelsPerInterval: 100, unit: Timeline.DateTime.YEAR}, 
       {pixelsPerInterval: 50, unit: Timeline.DateTime.YEAR}, 
       {pixelsPerInterval: 400, unit: Timeline.DateTime.DECADE}, 
       {pixelsPerInterval: 200, unit: Timeline.DateTime.DECADE}, 
       {pixelsPerInterval: 100, unit: Timeline.DateTime.DECADE}, 
       {pixelsPerInterval: 50, unit: Timeline.DateTime.DECADE} 
      ), 
      date:   date, 
      theme:   theme 
     }), 
     Timeline.createBandInfo({ 
      width:   "20%", 
      intervalUnit: Timeline.DateTime.MONTH, 
      intervalPixels: 200, 
      eventSource: eventSource, 
      date:   date, 
      overview:  true, 
      theme:   theme 
     }) 
    ]; 
    bandInfos[1].syncWith = 0; 

    bandInfos[1].highlight = true; 

    tl = Timeline.create(document.getElementById("tl"), bandInfos, Timeline.HORIZONTAL); 
    // tl.loadXML("https://portal.gtri.gatech.edu/gtri/elsys/joshtest/experiment/elsys.xml", function(xml, url) { eventSource.loadXML(xml, url); }); 

    setupFilterHighlightControls(document.getElementById("controls"), tl, [0,1], theme); 
} 
var resizeTimerID = null; 
function onResize() { 
    if (resizeTimerID == null) { 
     resizeTimerID = window.setTimeout(function() { 
      resizeTimerID = null; 
      tl.layout(); 
     }, 500); 
    } 
} 

と(下)examples.js(下記)listdetails.aspxです

function centerSimileAjax(date) { 
    tl.getBand(0).setCenterVisibleDate(SimileAjax.DateTime.parseGregorianDateTime(date)); 
} 

function setupFilterHighlightControls(div, timeline, bandIndices, theme) { 
    var table = document.createElement("table"); 
    var tr = table.insertRow(0); 

    var td = tr.insertCell(0); 
    td.innerHTML = "Filter:"; 

    td = tr.insertCell(1); 
    td.innerHTML = "Highlight:"; 

    var handler = function(elmt, evt, target) { 
     onKeyPress(timeline, bandIndices, table); 
    }; 

    tr = table.insertRow(1); 
    tr.style.verticalAlign = "top"; 

    td = tr.insertCell(0); 

    var input = document.createElement("input"); 
    input.type = "text"; 
    SimileAjax.DOM.registerEvent(input, "keypress", handler); 
    td.appendChild(input); 

    for (var i = 0; i < theme.event.highlightColors.length; i++) { 
     td = tr.insertCell(i + 1); 

     input = document.createElement("input"); 
     input.type = "text"; 
     SimileAjax.DOM.registerEvent(input, "keypress", handler); 
     td.appendChild(input); 

     var divColor = document.createElement("div"); 
     divColor.style.height = "0.5em"; 
     divColor.style.background = theme.event.highlightColors[i]; 
     td.appendChild(divColor); 
    } 

    td = tr.insertCell(tr.cells.length); 
    var button = document.createElement("button"); 
    button.innerHTML = "Clear All"; 
    SimileAjax.DOM.registerEvent(button, "click", function() { 
     clearAll(timeline, bandIndices, table); 
    }); 
    td.appendChild(button); 

    div.appendChild(table); 
} 

var timerID = null; 
function onKeyPress(timeline, bandIndices, table) { 
    if (timerID != null) { 
     window.clearTimeout(timerID); 
    } 
    timerID = window.setTimeout(function() { 
     performFiltering(timeline, bandIndices, table); 
    }, 300); 
} 
function cleanString(s) { 
    return s.replace(/^\s+/, '').replace(/\s+$/, ''); 
} 
function performFiltering(timeline, bandIndices, table) { 
    timerID = null; 

    var tr = table.rows[1]; 
    var text = cleanString(tr.cells[0].firstChild.value); 

    var filterMatcher = null; 
    if (text.length > 0) { 
     var regex = new RegExp(text, "i"); 
     filterMatcher = function(evt) { 
      return regex.test(evt.getText()) || regex.test(evt.getDescription()); 
     }; 
    } 

    var regexes = []; 
    var hasHighlights = false; 
    for (var x = 1; x < tr.cells.length - 1; x++) { 
     var input = tr.cells[x].firstChild; 
     var text2 = cleanString(input.value); 
     if (text2.length > 0) { 
      hasHighlights = true; 
      regexes.push(new RegExp(text2, "i")); 
     } else { 
      regexes.push(null); 
     } 
    } 
    var highlightMatcher = hasHighlights ? function(evt) { 
     var text = evt.getText(); 
     var description = evt.getDescription(); 
     for (var x = 0; x < regexes.length; x++) { 
      var regex = regexes[x]; 
      if (regex != null && (regex.test(text) || regex.test(description))) { 
       return x; 
      } 
     } 
     return -1; 
    } : null; 

    for (var i = 0; i < bandIndices.length; i++) { 
     var bandIndex = bandIndices[i]; 
     timeline.getBand(bandIndex).getEventPainter().setFilterMatcher(filterMatcher); 
     timeline.getBand(bandIndex).getEventPainter().setHighlightMatcher(highlightMatcher); 
    } 
    timeline.paint(); 
} 
function clearAll(timeline, bandIndices, table) { 
    var tr = table.rows[1]; 
    for (var x = 0; x < tr.cells.length - 1; x++) { 
     tr.cells[x].firstChild.value = ""; 
    } 

    for (var i = 0; i < bandIndices.length; i++) { 
     var bandIndex = bandIndices[i]; 
     timeline.getBand(bandIndex).getEventPainter().setFilterMatcher(null); 
     timeline.getBand(bandIndex).getEventPainter().setHighlightMatcher(null); 
    } 
    timeline.paint(); 
} 

ロードされていない機能(onKeyPressイベント)がexamples.js(上記)です。皆さんの助けをありがとうございます。

+0

私はただ推測していますが、onKeyPressはすべてのブラウザで保護されたキーワードだと思います。 examples.jsを書きましたか?関数名を変更しようとしましたか? – dtryan

+0

@dtryanはChromeでコンソールを開いただけで、onKeyPressという名前の関数がうまく動作します。 – Snuffleupagus

+0

関数名はすべて正常でなければなりません。私はexamples.jsを書きませんでした。私は[この例](http://simile-widgets.googlecode.com/svn/timeline/tags/latest/src/webapp/examples/jfk/jfk.html)から入手しました。 。 – user1226409

答えて

0

私は関数の名前を変更しようとしましたが、何とか修正したので、dtryanに感謝します。しかし、私は本当に名前がわからない理由を理解していません。user1090190が観察したように、名前は他のコンテキストでは関係ありません。SharePoint内に置くまで、コードはすべて完璧に機能し、同じ名前の関数、つまりブラウザの機能やSharePointの機能を検索すると何も返されなかったので、この問題の原因がわからない。 SharePointにはOnKeyPressとonkeypressという関数があるため、onKeyPressと呼ばれる文書化されていない関数もあります。私はこれがこの問題を抱えている可能性がある他の誰かを助けてくれることを願っていますが、なぜ誰かがその名前がうまくいかなかった理由についてより良い説明があれば、コメントしてください

ご協力いただきありがとうございます。

関連する問題