Flexigrid: проблема window.resize

Question

Мне удалось создать код, который может сделать flexigrid более «жидким», более конкретно он может изменяться в зависимости от размера окна при загрузке страницы, но теперь я хотел бы добавить функцию к автоматически изменяйте размер, когда размер окна изменяется без обновления.

Это то, что я до сих пор:

$(document).ready(function(){ 
var myWidth; 
var myHeight; 
var rowno; 
    if($(window).resize(function(e) { 
    // do something when window resizes 
    if(typeof(window.innerWidth) == 'number') { 
    //Non-IE 
    myWidth = window.innerWidth; 
    myHeight = window.innerHeight; 
    } else if(document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) { 
    //IE 6+ in 'standards compliant mode' 
    myWidth = document.documentElement.clientWidth; 
    myHeight = document.documentElement.clientHeight; 
    } else if(document.body && (document.body.clientWidth || document.body.clientHeight)) { 
    //IE 4 compatible 
    myWidth = document.body.clientWidth; 
    myHeight = document.body.clientHeight; 
    } 
    var rowno = Math.floor((myHeight - 96)/29) 
    })); 
    $("#flex1").flexigrid 
      (
      { 
      url: 'post2.php', 
      dataType: 'json', 
      colModel : [ 
       {display: 'ID', name : 'id', width : (myWidth*0.018), sortable : true, align: 'center', hide: false}, 
       {display: 'URL', name : 'url', width : (myWidth*0.38), sortable : false, align: 'left'}, 
       {display: 'File Name', name : 'filename', width : (myWidth*0.239), sortable : true, align: 'left'}, 
       {display: 'Availability', name : 'availability', width : (myWidth*0.038), sortable : true, align: 'center'}, 
       {display: 'State', name : 'state', width : (myWidth*0.029), sortable : true, align: 'center'}, 
       {display: 'Total Size', name : 'totalsize', width : (myWidth*0.05), sortable : false, align: 'center'}, 
       {display: 'Current Size', name : 'currentsize', width : (myWidth*0.05), sortable : false, align: 'center'}, 
       {display: 'Procent', name : 'procent', width : (myWidth*0.04), sortable : true, align: 'center'}, 
       {display: 'Log', width : (myWidth*0.018), sortable : false, align: 'center'}, 
       ], 
      buttons : [ 
       {name: 'Add', bclass: 'add', onpress : test}, 
       {name: 'Delete', bclass: 'delete', onpress : test}, 
       {separator: true}, 
       {name: 'Start', bclass: 'start', onpress : test}, 
       {name: 'Stop', bclass: 'stop', onpress : test}, 
       {separator: true},    
       {name: 'Select All', bclass : 'selectall', onpress : test}, 
       {name: 'DeSelect All', bclass : 'deselectall', onpress : test}, 
       {separator: true} 
       ], 
      searchitems : [ 
       {display: 'URL', name : 'url'}, 
       {display: 'Filename', name : 'filename', isdefault: true} 
       ], 
      sortname: "id", 
      sortorder: "asc", 
      usepager: true, 
      title: '', 
      useRp: false, 
      rp: rowno, 
      showTableToggleBtn: true, 
      height: (myHeight - 96) 
      } 
      ); 
}); 

Сейчас он бросает мне ошибку в JQuery о недопустимом аргументе, но я уверен, что это синтаксис проблема.

Thanks,

Cristian.

Answer 1

лучше использовать% для размера вместо пикселей или эм он прекрасно работает без такого большого сценария

** редактировать **

если и все еще хотите сделать дать функцию SetTimeout, которая будет проверяйте каждые 1 сек размер окна браузера. Высота и ширина с помощью window.width :)

если у вас это получилось, я первый, кто скопировал ваш сценарий. Я ищу то же самое. , но привык к%

Answer 2

, если вы видите размер высоты любого элемента и u добавляете его вместе 120px aprox. так что если у делать что-то вроде этого (Flexigrid объекта конфигурации) свойства, u'll быть в порядке:

$("#tabla").flexigrid({ 
    ..., 
    width:'auto', 
    height:$("#container").innerHeight()-120 
}); 

---