2016-10-04 20 views
1

获得所选行我创建了一个响应表中使用XPages DataTable,并使用插件:bootstrap-table-mobile每一件事情做工精细的观点是能够从表视图切换桌面上,以卡片视图上移动。的XPages:如何从自举表

然后我在其他复选框添加到tavle得到一些打印的onClick或checbox的的onChange但无一不发生的事件不会触发。是否有任何工作围绕它? 下面是我的DataTable

<xp:dataTable id="dataTable2" rows="30"> 
     <xp:this.attrs> 
      <xp:attr name="data-toggle" value="table"></xp:attr> 
      <xp:attr name="data-show-columns" value="true"> 
      </xp:attr> 
      <xp:attr name="data-mobile-responsive" value="true"></xp:attr> 
      <xp:attr name="data-check-on-init" value="true"></xp:attr> 
      <xp:attr name="data-click-to-select" value="true"> 
      </xp:attr> 
      <xp:attr name="data-click-to-select" value="true"></xp:attr> 
     </xp:this.attrs> 
     <xp:column id="column12"> 
      <xp:checkBox id="checkBox2"> 

       <xp:eventHandler event="onclick" submit="true" 
        refreshMode="partial" refreshId="viewTable" id="eventHandler3"> 
        <xp:this.action><![CDATA[#{javascript: 
print("onClick_Server")}]]></xp:this.action> 
        <xp:this.script><![CDATA[console.log("onClick_cllient")]]></xp:this.script> 
       </xp:eventHandler> 
       <xp:eventHandler event="onchange" submit="true" 
        refreshMode="complete"> 
        <xp:this.action><![CDATA[#{javascript:print("onChange_Server")}]]></xp:this.action> 
        <xp:this.script><![CDATA[console.log("onChange_client")]]></xp:this.script> 
       </xp:eventHandler> 
      </xp:checkBox> 
     </xp:column> 
     <xp:column id="column14"> 
      <xp:text escape="true" id="id" value="#{curDoc.id}"> 

      </xp:text> 
      <xp:this.facets> 
       <xp:label value="Id" id="label10" for="column1" xp:key="header"> 
       </xp:label> 
      </xp:this.facets> 
     </xp:column> 
     <xp:column id="column13"> 
      <xp:this.facets> 
       <xp:label value="Item Mame" id="label2" for="column1" 
        xp:key="header"> 
       </xp:label> 
      </xp:this.facets> 
      <xp:text escape="true" id="ItemName" value="#{curDoc.itemname}"> 

      </xp:text> 
     </xp:column> 
    </xp:dataTable> 
+0

可能这可以帮助你,HTTP:// notesspeak.blogspot.nl/2013/09/creating-event-for-selected-row-in.html –

+0

感谢您的链接,它为我工作,为什么不ü添加作为一个答案,所以我可以接受它 –

+0

我已经加入作为答案 –

回答

1

Click this link to Run.. This may help you, if not means just ignore

<div class="container"> 
    <div class="row"> 
     <div class="col-xs-12"> 
      <table class="table table-bordered" id="tblemp"> 
       <thead> 
        <th>Name</th> 
        <th>Mobile No</th> 
        <th>Email Id</th> 
       </thead> 
       <tbody> 
        <tr id="emp001" class="clickable-row"> 
         <td>AAA</td> 
         <td>1111111</td> 
         <td>[email protected]</td> 
        </tr> 
        <tr id="emp002" class="clickable-row"> 
         <td>BBB</td> 
         <td>2222222</td> 
         <td>[email protected]</td> 
        </tr> 
        <tr id="emp003" class="clickable-row"> 
         <td>CCC</td> 
         <td>3333333</td> 
         <td>[email protected]</td> 
        </tr> 
       </tbody> 
      </table> 
     </div> 
    </div> 
</div> 

<script> 
    var emp_id = ""; 
    $('#tblemp').on('click', '.clickable-row', function(event) { 
     $(this).addClass('active').siblings().removeClass('active'); 
     emp_id = $(this).closest('tr').attr('id'); 
     alert(emp_id); 
    }); 
</script>