如何在不同的监视器屏幕上自动调整dhtmlxgrid的大小

我正在使用DHTMLX并排设置在表格中的网格，因为这是我似乎已经使它们以这种方式得到的唯一方法。如何在不同的监视器屏幕上自动调整dhtmlxgrid的大小

我想获得网格以某种方式自动调整大小，当它在一个特定的大小监视器，因为我目前似乎无法弄清楚如何。它适用于我们的一些客户拥有的较小屏幕，但是在较大的显示器上，它们有较大的开放空间，看起来不太好。我的代码去如下：

HTML：

 <table class="table tblExp "> 
         <thead> 
          <tr> 
           <th>Business</th> 
           <th>Personal</th> 
          </tr> 
         </thead> 
         <tbody> 
         <tr> 
          <td > 
           <div id="grdBusExp" style= "width:100%;;height:400px;"></div> 
           <div class="btnBusGrp"> 
            <button class="btn btn-primary" id ="newBusiness" onclick ="addNewBusiness()">Add Expense </button> 
            <button class="btn btn-primary" onclick="busExpGrd.deleteSelectedItem()">Delete Expense</button> 
            </div> 
          </td> 
          <td><div id="grdPrslExp" style="width:100%;height:400px;overflow:auto;"></div> 
           <div class="btnpersGrp"> 
           <button class="btn btn-primary" id="newPersonal" onclick="addNewPersonal()">Add Expense</button> 
           <button class="btn btn-primary" onclick="prlsExpGrd.deleteSelectedItem()">Delete Expense</button> 
            </div> 
          </td> 
         </tr> 
          </tbody> 
        </table> 

the grids: 

    busExpGrd = new dhtmlXGridObject('grdBusExp'); 
       busExpGrd.setStyle("background:#7db9e8;color:white;"); 
       busExpGrd.setImagePath("/codebase36/imgs/"); 
       busExpGrd.setHeader("Id,CMAID,P_B,Description,Amount"); 
       busExpGrd.setInitWidths("50,50,5,375,230"); 
       busExpGrd.enableAutoWidth(true, 882, 500); 
       busExpGrd.setColAlign("center,center,left,left,left"); 
       busExpGrd.setColTypes("ed,ed,ed,ed,ed"); 
       busExpGrd.setColSorting("int,int,str,str,str"); 
       busExpGrd.enableAutoWidth(true); 
       busExpGrd.enableEditEvents(false, true, false); 
       busExpGrd.attachEvent("onEditCell", editBusiness); 
       busExpGrd.attachEvent("onSubAjaxLoad", addNewBusiness); 
       busExpGrd.attachEvent("onBeforeRowDeleted", deleteBusiness); 
       busExpGrd.setCustomSorting(sort_custom, 1); 
       busExpGrd.csv.cell = "|"; 
       busExpGrd.csv.row = "$"; 
       busExpGrd.setColumnHidden(0, true); 
       busExpGrd.setColumnHidden(1, true); 
       busExpGrd.setColumnHidden(2, true); 
       busExpGrd.init(); 
       busExpGrd.attachFooter("TOTAL,#cspan,#cspan,#cspan,{#stat_total}", ["font-weight:bold;", "", "", "", "font-weight:bold;"]); 

prlsExpGrd = new dhtmlXGridObject('grdPrslExp'); 
      prlsExpGrd.setImagePath("/codebase36/imgs/"); 
      prlsExpGrd.setStyle("background:#7db9e8;color:white;"); 
      prlsExpGrd.setHeader("Id,CMAID,P_B,Description, Amount"); 
      prlsExpGrd.setInitWidths("50,50,5,375,230"); 
      prlsExpGrd.enableAutoWidth(true, 1000, 500); 
      prlsExpGrd.setColAlign("left,left,left,left,left"); 
      prlsExpGrd.setColTypes("ed,ed,ed,ed,ed"); 
      prlsExpGrd.setColSorting("int,int,str,str,str"); 
      prlsExpGrd.enableAutoWidth(true); 
      prlsExpGrd.enableEditTabOnly(true); 
      prlsExpGrd.enableEditEvents(false, true, false); 
      prlsExpGrd.attachEvent("onEditCell", editPersonal); 
      prlsExpGrd.attachEvent("onSubAjaxLoad", addNewPersonal); 
      prlsExpGrd.attachEvent("onBeforeRowDeleted", deleteBusiness); 
      prlsExpGrd.setCustomSorting(sort_custom, 1); 
      prlsExpGrd.csv.cell = "|"; 
      prlsExpGrd.csv.row = "$"; 
      prlsExpGrd.setColumnHidden(0, true); 
      prlsExpGrd.setColumnHidden(1, true); 
      prlsExpGrd.setColumnHidden(2, true); 
      prlsExpGrd.init(); 
      prlsExpGrd.attachFooter("TOTAL,#cspan,#cspan,#cspan,{#stat_total}", ["font-weight:bold;", "", "", "", "font-weight:bold;"]);

有我丢失的东西或做我必须programeticly设置呢？

来源

2016-09-20 Ravyn

使用setInitWidthsP函数来设置百分比的网格宽度。这将自动在更大的屏幕上扩展栅格列。

来源

2016-09-28 15:42:40 Viv

如何在不同的监视器屏幕上自动调整dhtmlxgrid的大小

回答

相关问题