Flexigrid: window.resize problème

Question

J'ai réussi à trouver un code qui peut rendre flexigrid plus "fluide", plus précisément il peut redimensionner en fonction de la taille de la fenêtre sur le chargement de la page, mais maintenant je voudrais ajouter la fonction à redimensionner automatiquement lorsque la taille de la fenêtre change sans l'actualiser.

C'est ce que j'ai jusqu'à présent:

$(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) 
      } 
      ); 
}); 

En ce moment, il me renvoie une erreur dans jquery au sujet d'un argument non valide, mais je suis assez sûr est le problème de syntaxe.

Merci,

Cristian.

Answer 1

mieux utiliser% pour la taille en place de px ou em il fonctionne très bien sans ce grand scénario

** modifier **

si tu veux encore faire donner une fonction settimeout qui sera vérifier toutes les 1 secondes la taille de la fenêtre du navigateur.heure et la largeur avec window.width :)

si vous réussissez avec ceci, je suis le premier à copier votre script, je cherche la même chose. . mais s'est habitué à%

Answer 2

si vous voyez la taille de taille de n'importe quel élément et vous l'ajoutez ensemble 120px aprox. donc si u faire quelque chose comme ça (la propriété Flexigrid objet config), être u'll ok:

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

---