2010-03-26 9 views
7

Me gustaría agregar soporte para ordenar tablas que he creado.jquery.ui ordenable usando una tabla y un elemento: tr, dificultades con el marcador de posición

El marcador de posición que he implementado no funciona en absoluto en IE 7 cuando se utiliza el elemento: TR. Funciona bien en FF.
He intentado el código en <UL\> y funciona correctamente. Parece ser específica a las tablas y

he investigado a través de foros, y parece que no mucha gente está utilizando la clasificación con mesas:

<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> 

¿Me puede ayudar con mis requisitos utilizando el código ¿Me proporcionó o me remitió a una guía que demuestra cómo se hace esto?

+0

fije por favor el código de su presentación. – dclowd9901

+0

Formato de código de reparación – jitter

Respuesta

19

Prueba esto:

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

Esto funcionó para mí :) –

+2

también podría usar '' para que coincida mejor con la interfaz de usuario – machineaddict

+0

¡Gracias! Gran solución – Alex

Cuestiones relacionadas