2012-04-30 17 views
0

はJavaScriptバグ:そこにあると思われ私はこのJSFのテーブルを持っているJSFテーブル

$(document).ready(function() { 
      $("#tabs").tabs(); 
      }); 

      $(window).load(function() { 
        jsf.ajax.addOnEvent(function (data) { 
          if (data.status === "success") { 
            $("#tabs").tabs(); 
          } 
        }); 
      }); 

<?xml version='1.0' encoding='UTF-8' ?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" 
     xmlns:h="http://java.sun.com/jsf/html" 
     xmlns:f="http://java.sun.com/jsf/core" 
     xmlns:ui="http://java.sun.com/jsf/facelets"> 
    <h:head> 
     <ui:insert name="header">   
      <ui:include src="header.xhtml"/>   
     </ui:insert> 
    </h:head> 
    <h:body> 

     <h1><img src="resources/css/images/icon.png" alt="DX-57" /> History Center</h1> 
     <!-- layer for black background of the buttons --> 
     <div id="toolbar" style="margin: 0 auto; width:1180px; height:30px; position:relative; background-color:black"> 
      <!-- Include page Navigation --> 
      <ui:insert name="Navigation">   
       <ui:include src="Navigation.xhtml"/>   
      </ui:insert> 

     </div> 

     <div id="logodiv" style="position:relative; top:35px; left:0px;"> 
      <h:graphicImage alt="Dashboard" style="position:relative; top:-20px; left:9px;" value="resources/images/logo_sessions.png" /> 
     </div> 
     <div id="main" style="margin: 0 auto; width:1190px; height:700px; position:absolute; background-color:transparent; top:105px"> 

      <div id="mainpage" style="margin: 0 auto; width:1190px; height:500px; position:absolute; background-color:transparent; top:80px"> 

       <div id="settingsHashMap" style="width:750px; height:400px; position:absolute; background-color:r; top:20px; left:1px"> 

        <h:form id="form"> 

         <ui:debug /> 

         <!-- The sortable data table --> 
         <h:dataTable id="dataTable" value="#{SessionsController.dataList}" binding="#{table}" var="item"> 
          <!-- Check box --> 
          <h:column> 
           <f:facet name="header"> 
            <h:outputText value="Select" /> 
           </f:facet> 
           <h:selectBooleanCheckbox onclick="highlight(this)" value="#{SessionsController.selectedIds[dataItem.id]}" /> 
          </h:column> 
          <h:column> 
           <f:facet name="header"> 
            <h:commandLink value="№" actionListener="#{SessionsController.sort}"> 
             <f:attribute name="№" value="№" /> 
            </h:commandLink> 
           </f:facet> 
           <h:outputText value="#{table.rowIndex + SessionsController.firstRow + 1}" /> 
          </h:column> 
          <h:column> 
           <f:facet name="header"> 
            <h:commandLink value="Account Session ID" actionListener="#{SessionsController.sort}"> 
             <f:attribute name="sortField" value="Account Session ID" /> 
            </h:commandLink> 
           </f:facet> 
           <h:outputText value="#{item.aSessionID}" /> 
          </h:column> 
          <h:column> 
           <f:facet name="header"> 
            <h:commandLink value="User ID" actionListener="#{SessionsController.sort}"> 
             <f:attribute name="sortField" value="User ID" /> 
            </h:commandLink> 
           </f:facet> 
           <h:outputText value="#{item.userID}" /> 
          </h:column> 
          <h:column> 
           <f:facet name="header"> 
            <h:commandLink value="Activity Start Time" actionListener="#{SessionsController.sort}"> 
             <f:attribute name="sortField" value="Activity Start Time" /> 
            </h:commandLink> 
           </f:facet> 
           <h:outputText value="#{item.activityStart}" /> 
          </h:column> 
          <h:column> 
           <f:facet name="header"> 
            <h:commandLink value="Activity End Time" actionListener="#{SessionsController.sort}"> 
             <f:attribute name="sortField" value="Activity End Time" /> 
            </h:commandLink> 
           </f:facet> 
           <h:outputText value="#{item.activityEnd}" /> 
          </h:column> 
          <h:column> 
           <f:facet name="header"> 
            <h:commandLink value="Activity" actionListener="#{SessionsController.sort}"> 
             <f:attribute name="sortField" value="Activity" /> 
            </h:commandLink> 
           </f:facet> 
           <h:outputText value="#{item.activity}" /> 
          </h:column> 
         </h:dataTable> 

         <!-- The paging buttons --> 
         <h:commandButton value="first" action="#{SessionsController.pageFirst}" 
             disabled="#{SessionsController.firstRow == 0}" > 
          <f:ajax render="@form" execute="@form"></f:ajax> 
         </h:commandButton> 


         <h:commandButton value="prev" action="#{SessionsController.pagePrevious}" 
             disabled="#{SessionsController.firstRow == 0}" > 
          <f:ajax render="@form" execute="@form"></f:ajax> 
         </h:commandButton> 

         <h:commandButton value="next" action="#{SessionsController.pageNext}" 
             disabled="#{SessionsController.firstRow + SessionsController.rowsPerPage >= SessionsController.totalRows}" > 
          <f:ajax render="@form" execute="@form"></f:ajax> 
         </h:commandButton> 

         <h:commandButton value="last" action="#{SessionsController.pageLast}" 
             disabled="#{SessionsController.firstRow + SessionsController.rowsPerPage >= SessionsController.totalRows}" > 
          <f:ajax render="@form" execute="@form"></f:ajax> 
         </h:commandButton> 

         <h:outputText value="Page #{SessionsController.currentPage}/#{SessionsController.totalPages}" /> 
         <br /> 

         <!-- The paging links --> 
         <ui:repeat value="#{SessionsController.pages}" var="page"> 
          <h:commandLink value="#{page}" actionListener="#{SessionsController.page}" 
              rendered="#{page != SessionsController.currentPage}" > 
           <f:ajax render="@form" execute="@form"></f:ajax> 
          </h:commandLink> 
          <h:outputText value="#{page}" escape="false" 
              rendered="#{page == SessionsController.currentPage}" /> 
         </ui:repeat> 
         <br /> 

         <!-- Set rows per page --> 
         <h:outputLabel for="rowsPerPage" value="Rows per page" /> 
         <h:inputText id="rowsPerPage" value="#{SessionsController.rowsPerPage}" size="3" maxlength="3" /> 
         <h:commandButton value="Set" action="#{SessionsController.pageFirst}" > 
          <f:ajax render="@form" execute="@form"></f:ajax> 
         </h:commandButton> 
         <h:message for="rowsPerPage" errorStyle="color: red;" /> 

        </h:form>     

       </div> 

       <div id="settingsdivb" style="width:350px; height:400px; position:absolute; background-color:transparent; top:20px; left:800px"> 

       </div> 
      </div> 
     </div> 

     <script type="text/javascript"> 
       $("tr").not(':first').hover(
       function() { 
       $(this).css("background","#707070"); 
       }, 
       function() { 
       $(this).css("background",""); 
       } 
      );    

      function highlight(param) { 
      var row = jQuery(param).parent().parent().children(); 
       row.toggleClass('highlited'); 
      }  

      $(document).ready(function() { 
      $("#tabs").tabs(); 
      }); 

      $(window).load(function() { 
        jsf.ajax.addOnEvent(function (data) { 
          if (data.status === "success") { 
            $("#tabs").tabs(); 
          } 
        }); 
      }); 
     </script> 


    </h:body> 
</html> 

私は、Firefoxにページを開いたときに、私はこれらの行にFirebugの中にエラーが出ますこのJavaScriptコードのバグ。どのようにコードを修正できますか?

function onclick(event) { 
    highlight(this); 
} 

答えて

1

そのテーブルに関連していない:

ベストウイッシュ

EDIT

これは、ここで

highlight is not defined 

Firebugの

で正確なエラーでは、Firebugのでは間違いです...

私はあなたが投稿コード内の任意のタブを参照してください...ので、このコードをJS削除しないでください...

これはコードの目的は、HTMLコードに基づいてタブをレンダリングすることで、JS ...と私はしないでください

<h:panelGroup id="tabs" layout="block"> in your page... 

ところで、jsに表示される正確なエラーは何ですか?

更新それはあなたのJSコードでハイライトという名前の関数は、あなたがそれを実装するか、それ内に位置していることのjsがあなたのページ

に含まれていることを確認する必要があります...がないことを言う

例えば

次はうまくいくかもしれないjqueryのを使用していた場合は...(あなた渡される変数に依存)

function highlight(myThis){ 
    $(myThis).effect("highlight", {}, 3000); 
} 
+0

私は置き換えポスト –

+0

を更新このようにコード:http://pastebin.com/Ez7jTmnZしかし、それを選択する行をクリックすると強調表示されません。たぶん何かが見当たりませんか? –

+0

まあ、私は悪いニュースと良いニュースがあります - 私はヘッダーにハイライトJavaScript関数を配置し、今はエラーなしで動作します。悪い点は、行の間にカーソルを移動すると、強調表示されない - このコードが見つからないか、表示されない - http://pastebin.com/2QQ2Gv6k作業のためにこのコードを配置する必要がある場所はどこですか? –

関連する問題