2010-03-26 4 views
7

Vorrei aggiungere il supporto per l'ordinamento alle tabelle che ho creato.jquery.ui ordinabile usando una tabella e un elemento: tr, difficoltà segnaposto

Il segnaposto che ho implementato non funziona affatto in IE 7 quando si utilizza l'elemento: TR. Funziona bene in FF.
Ho provato il codice su <UL\> e funziona correttamente. Sembra essere specifico per le tabelle e

Ho ricercato attraverso forum, e sembra che non un sacco di persone stanno usando l'ordinamento con tavoli:

<style type="text/css"> 
    .dndPlaceHolder 
    { 
    background-color:Red ; 
    color:Red; 
    height: 20px; 
    line-height:30px; 
    border: solid 2px black; 
    }  
    .dndItem 
    { 
    background-color: #c0c0c0; 
    border:solid 1px black; 
    padding:5px; 
    } 
</style> 

<script type="text/javascript" > 
    $(function() { 
    $("#myTable").sortable(
    { 
     placeholder:'dndPlaceHolder', 
     distance:15, 
     items:'tr', 
     forcePlaceholderSize:true, 
     change : dndChange, 
     update : dndUpdate 
    }); 

    $("#myTable").disableSelection(); 

    $("#myList").sortable(
    { 
     placeholder:'dndPlaceHolder', 
     distance:15, 
     items:'li', 
     forcePlaceholderSize:true, 
     change : dndChange, 
     update : dndUpdate 
    }); 

    $("#myList").disableSelection(); 

    }); 

    function dndChange(event,ui){ 

    } 

    function dndUpdate(event,ui){ 
    var msg = ''; 
    }  
</script> 

<table id='myTable' > 
    <tr class='dndItem' id='1'> 
     <td>0 Active - Active</td> 
    </tr> 
    <tr class='dndItem' id='2'> 
     <td>1 Closed - Closed</td> 
    </tr> 
    <tr class='dndItem' id='3'> 
     <td>2 OnHold - On Hold</td> 
    </tr> 
    <tr class='dndItem' id='4'> 
     <td>3 Pending - Pending</td> 
    </tr> 
</table> 
<BR> 
<UL id='myList' > 
    <li class='dndItem' id='1'>0 Active - Active</li> 
    <li class='dndItem' id='2'>1 Closed - Closed</li> 
    <li class='dndItem' id='3'>2 OnHold - On Hold</li> 
    <li class='dndItem' id='4'>3 Pending - Pending</li> 
</ul> 

Potete aiutarmi con le mie esigenze utilizzando il codice Ho fornito o mi ha fatto riferimento a una guida che dimostra come è fatto?

+0

Si prega di correggere il codice della vostra presentazione. – dclowd9901

+0

Formattazione codice correzione – jitter

risposta

19

Prova questo:

$("#myTable").sortable({ 
    ... 
    'start': function (event, ui) { 
     ui.placeholder.html('<!--[if IE]><td>&nbsp;</td><![endif]-->'); 
    }, 
    ... 
}; 
+0

Questo ha funzionato per me :) –

+2

potresti anche usare '' per abbinare meglio l'interfaccia utente – machineaddict

+0

Grazie! Ottima soluzione. – Alex

Problemi correlati