Necesito un poco de ayuda en jQuery MobileMesa de foo. Estoy agregando datos dinámicamente en una tabla.

HTML:

    <table id="tblSRNDetails" class="footable">
        <thead>
            <tr>
                <th data-class="expand">SRN</th>
                <th >Failure Date</th>  
                <th >Complaint Report Date</th>                 
                <th>Promised Date</th>  
                <th >Customer Name</th>
                <th >Log Time</th>
                <th >Create FSR</th>    
                <th  data-hide="phone,tablet">Days Open</th>        
                <th  data-hide="phone,tablet">SRN Allocated Time</th>   
                <th  data-hide="phone,tablet"> SRN Status</th>  
                <th  data-hide="phone,tablet"> ESN Number</th>  
                <th  data-hide="phone,tablet"> Request Type</th>    
                <th  data-hide="phone,tablet">Service Request Details</th>                          
            </tr>
        </thead>
        <tbody>
        </tbody>
    </table>

código js:

$("#page-id").live('pagebeforeshow', function() {
    console.log("Page before show");
    $("#tblSRNDetails > tbody tr").remove();
    for (var indx = 0; indx < 2; indx++ )
    {
        $("#tblSRNDetails > tbody").append("<tr>"+
        "<td>Name</td>"+
        "<td>failureDate</td>"+
        "<td>complaintReportDate</td>"+
        "<td>promisedDate</td>"+
        "<td>custName</td>"+
        "<td><a href='#'><b>Log Time</b></a></td>"+
        "<td><b>Create FSR</b></td>"+
        "<td>daysOpen</td>"+
        "<td>allocatedTime</td>"+
        "<td>srn_status</td>"+
        "<td>ESNNumber</td>"+
        "<td>requestType</td>"+
        "<td>customerComplaint</td>"+
        "</tr>");   
    }
    $('#tblSRNDetails').footable();
});

Con esta tabla Foo se aplica correctamente cuando se abre por primera vez. Si hago clic en el botón de la página de inicio y vuelvo, y vuelvo a esa página, la tabla Foo no se aplica correctamente.

Captura de pantalla:

Así que los problemas que estoy enfrentando en ese momento incluyen:

Se muestran los campos ocultos. (Significa que no se aplica Footable): Este problema se resuelve después de cambiar la orientación en el dispositivo dos veces.

El primer campo ya no incluye el botón de expansión de datos (no se aplica Significable de medios):

Creo que el problema es porque estoy eliminando las filas antiguas y agregando nuevas. Lo intenté sin dar la llamada de quitar. En ese momento, las filas antiguas se mostraban correctamente. Los campos recién agregados tenían problemas como se muestra en la captura de pantalla.

¿Puede alguien ayudarme con esto?

P.S: Estoy renderizando esto en la vista web de Android. Y el mismo problema se reproduce en el navegador, también.