0

I'm trying to load the jQuery Mobile 'styles' (in this case the buttons).

Here is my HTML code (ajax):

<!-- jQuery + Mobile (LOCAL) -->
<link rel="stylesheet" href="../../jquery.mobile/jquery.mobile-1.3.2.min.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-2.0.3.js"></script>
<script src="../../jquery.mobile/jquery.mobile-1.3.2.min.js"></script>

<script>

$.ajax({
            type : "GET",
            url : "http://localhost/asistencia/mant/scripts/s_m_zona.php?id_zona="+id_zona,
            async : true,
            success : function(datos) {
                var dataJson = eval(datos);
                for ( i in dataJson) {
                    // SOME CODE HEDE


                    // GUARDAR NOMBRE ZONA
                    $("#btn_guardar").html("<button data-ajax='false' onclick='GuardarNombreZona("+dataJson[i].id_zona+");return false;'>Modificar nombre </button>");

                    $("#botones").html("<button data-ajax='false' onclick='Remover("+dataJson[i].id_zona+")'>Crear nueva área</button>");
                    $("#crearnuevo").button('refresh');
                }

            },
            error : function(obj, error, objError) {
                //avisar que ocurrió un error
                alert("ERROR DE RED");
            }

        });

</script>

<body>
    <div data-role="page" id="index">
        <div data-role="header">
            <a href="../index.html" data-icon="back" data-iconpos="notext" rel="external"  data-transition="fade">Volver</a>
            <h3> Modificar zona </h3>
        </div> <!-- header -->

        <div data-role="content">
            <!-- <div id="zonas">
            </div> <br/> -->
            <div id="botones">
            </div>
            <table>
                    <tr>
                    <td>Zona: <input type="text" id="zona_name" name="zona_name" /></td>
                    <td><div id="btn_guardar"></div></td>
                    </tr>
            </table>
        </div> <!-- content -->
    </div>
</body>

The buttons on #btn_guardar and #botones divs show like any button and don't displays the CSS from jquery mobile.

Thank you for answers, sry for bad english

1 Answer 1

0

Try using trigger("create"); after putting the html of the buttons on the parent :

$("#btn_guardar").html("<button data-ajax='false' onclick='GuardarNombreZona("+dataJson[i].id_zona+");return false;'>Modificar nombre </button>");
$("#btn_guardar").trigger("create");

$("#botones").html("<button data-ajax='false' onclick='Remover("+dataJson[i].id_zona+")'>Crear nueva área</button>");
$("#botones").trigger("create");
0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.