1

私は自分のページのテンプレートシステムとしてjQoteを使用しています。テキストで何が起こっているのかを説明するのに苦労したので、ビデオをアップロードしました。

http://www.youtube.com/watch?v=ugw4lIsF0HM

基本的に、正しくレンダリングされる場合もあれば、エラーが発生したくない場合もあります。ChromeとFirefoxはレポートとエラーを報告しません。また、Chromeで検査を行った場合、正しくレンダリングされない場合でも、正しくレンダリングされる場合でも、出力は同じです。

これは私のコードです。

    <script type="text/javascript"> 

    $.getJSON('/json/testData', function(data) {
        $('#reportDiv').prepend($('#template').jqote(data));       
        // $('#reportDiv').html($.jqote('#template', data));   
    });     

</script>

<div id="pkgLineTabs" style="font-style: inherit; font-size: 13px" >
    <div id="reportDiv"></div>
</div>

<script type="text/x-jqote-template" id="template">
    <![CDATA[
    <ul>
        <% for (i = 0; i <= data.length; i++) { %>
        <li><a href="#pkgLineTabs_<%= this.data[i].hash %>" class="toolTip" id="<%= this.data[i].hash %>"><%= this.data[i].shortname %></a></li>
        <% } %>
    </ul>

    ]]>
</script>

私は考えられるすべてを試しました。ファイルを頭からページの一番下まで移動しました。順序を変更しました。何が起こっているのかわかりません。

これは、それを見る必要がある人のための私のjsonです。

{"data":[{"hash":"FB900DF","shortname":"Lines 3 & 4 - Baltimore"},{"hash":"FBAE86D","shortname":"Line 1 Cans"}]}

誰かがこれを見たことがあるかどうかは知りませんでした。$ {文字のため、jqueryテンプレートに切り替えることができません。PlayFrameworkはそれが好きではありません。

$ .getJSON呼び出しと関係があると感じています。これは、setTimeout関数を使用して、1または10のように設定すると、正しく完了しないためです。

助けてくれてありがとう。

編集：

<script type="text/x-jqote-template" id="template">
<![CDATA[
<ul>
    <% for (i = 0; i <= data.length; i++) { %>
    <li><a href="#pkgLineTabs_<%= this.data[i].hash %>" class="toolTip" id="<%= this.data[i].hash %>"><%= this.data[i].shortname %></a></li>
    <% } %>
</ul>
<% for (i = 0; i <= data.length; i++) { %>
<div id="pkgLineTabs_<%= this.data[i].hash %>">
    <table class="reportTable display" style="font-size:13px" title="<%= this.data[i].hash %>" >
        <thead> 
            <tr> 
                <th style="">Row Color</th> <!--hidden -->
                <th style="">Time Stamp</th> 
                <th style="">Ounces</th> 
                <th style="">Revolutions</th>  
                <th style="">Pallet Count</th> 
                <th style="">Roll Change</th>
                <th style="">Breaks</th>                
            </tr> 
        </thead>
        <tbody> 
            <tr> 
                <td colspan="5" class="dataTables_empty">Loading data from server...</td> 
            </tr> 
        </tbody> 
    </table>
</div>
<% } %>
]]>

これは完全なコードです。

これは私のデータテーブル関数です

$(window).load(function() {         

    $('.reportTable').each(function() {     

        var pkgLineId = $(this).attr('title');

        var reportTable = $(this).dataTable({         

            "bJQueryUI": true,
            "sPaginationType": "full_numbers",
            "bPaginate": true,
            "bLengthChange": true,
            "bFilter": false,
            "bSort": false,
            "bInfo": true,
            "bAutoWidth": false,       
            "bProcessing": true,
            "bServerSide": true,
            "bProcessing": true,
            "sDom": '<"H"lfrp>t<"F"lip>',
            "iDisplayLength": 15,
            "aLengthMenu": [[10, 15, 20, 50, 100, 200, 500], [10, 15, 20, 50, 100, 200, 500]], 
            "aoColumns": [
            {
                "bVisible": false
            },          
            null,
            null,
            null,                  
            null,
            null,
            null      
            ],
            "sAjaxSource": '/json/reportData/'+pkgLineId,
            "fnDrawCallback": function() {

                var nodes = reportTable.fnGetNodes(); 
                var lineStatus;
                for (var i = 0; i < nodes.length; i++) {                
                    lineStatus = reportTable.fnGetData(nodes[i]);              
                    nodes[i].setAttribute("style", "background: " + lineStatus[0]);                
                }   
            }           
        }); 
    });

});

これを$.getJSONのcomplete（）関数に入れてみましたが、かなりの量のデータであるため、window.loadが必要です。でも何かが足りないかもしれません。

私のデータテーブルは時々起動します。時々それはただハングし、何も起こりません。

4

1 に答える 1

1

あなたが示したコードで、あなたは正確にどこでタブを始めていますか？見た目からは、タブを開始する前にjsonリクエストが完了したかどうかを確認していないため、その場合、得られる結果は驚くことではありません（現在ローカルにいると仮定すると、おそらく1回は機能しないインターウェブに移動します）。

これを試して、以下を編集してください：

   $.getJSON('/json/testData', function(data) {
        $('#reportDiv').prepend($('#template').jqote(data));       
        // $('#reportDiv').html($.jqote('#template', data));   
    });

次のように、タブを開始する部分を含めるには、次のようにします。

   $.getJSON('/json/testData', function(data) {
        $('#reportDiv').prepend($('#template').jqote(data));       
        // $('#reportDiv').html($.jqote('#template', data));
        $( "#pkgLineTabs" ).tabs(); //and whatever settings you have for it currently, i.e. move it here
    });
于 2011-06-08T19:23:31.080 に答える