2010-10-31 13 views
11

Estoy interesado en aprender cómo AJAX un diálogo modal. Normalmente, si quería agregar un cuadro de diálogo modal a mi sitio web, agregué el código de diálogo de la interfaz de usuario de jquery en mi archivo JS principal y lo vinculé a una ID.Rieles: ¿AJAX es un cuadro de diálogo modal?

Creo que con Rails puedo crear un enlace, que recupera todo el código de diálogo del servidor y luego abre el cuadro de diálogo.

¿Es esto cierto?

Si es así, ¿me puede ayudar a entender ofreciendo un ejemplo simple de dónde todo vive en el mundo de los rieles MVC?

Gracias

+0

El deber es solo usar JqueryUI.dialog. No necesita algunos rieles específicos – shingara

+0

¿Qué quiere decir con "obtiene todo el código de diálogo del servidor"? ¿Quiere decir buscar el código jQuery que puede crear el diálogo? ¿Por qué no tendrías este código en un archivo js que está incluido en tu diseño o vista? Si intentas recuperar algo con lo que poblar el diálogo, esa es una historia diferente. – Samo

+0

Hmm, ¿hay algo más a la pregunta que no contesté a continuación? Si es aceptable, agradecería que aceptara la respuesta :) –

Respuesta

35

Gosh, que hizo esta hace 4 meses por lo que probablemente ha dado cuenta de esto por ahora. También tuve problemas para encontrar un buen escrito sobre cómo hacer esto. Esto es lo que me di cuenta:

En cualquier página que desea tirar de este cuadro de diálogo, que desea tener un div al igual que (nótese que no desea mostrar este aún):

<div id="person-form" title="Person" style="display:none"></div> 

en ese punto de vista, también quiere una llamada Ajax para tirar de este cuadro de diálogo:

<%= link_to 'Edit Profile', edit_person_path(person), :remote => true %> 

Obviamente, desea que esta edit_person_path para encaminar a alguna acción. Esa acción debe rendir un js.erb que tiene algo como lo siguiente (en jQuery):

$("#person-form").dialog({ 
    autoOpen: true, 
    height: 600, 
    width: 600, 
    modal: true, 
    title: 'Edit Person', 
    buttons: { 
    "Edit": function() { $("#edit_person_<%= @person.id %>").submit() }, 
    }, 
    open: function() { 
    $("#person-form").html("<%= escape_javascript(render('form')) %>") 
    }, 
}); 

Esto hará que un _form.html.erb parcial en el cuadro de diálogo.

Nota: también necesitará configurar el estilo de jQueryUI para que el cuadro de diálogo se vea agradable y bonito.

+0

Hola, acabo de encontrar este ejemplo. Muchas gracias porque al menos hace que la ventana modal aparezca en la pantalla. Sin embargo ... parece desde el principio. Así que, tan pronto como entre en mi vista de índice, aparece, no cuando hago clic en el enlace remoto. Estoy seguro de que no debería funcionar así. tal vez tienes sugerencias? – Lievcin

+0

Jinyoung: estoy tratando de implementar un formulario en un cuadro de diálogo utilizando su orientación. ¿Estoy haciendo algo obviamente mal? [link] (http://stackoverflow.com/questions/8953135/trying-to-make-a-form-in-a-jquery-dialog-modal-form-work-what-am-i-missing) Gracias – thatdankent

+1

Hola thatdankent, creo que podría haber encontrado el error y lo publiqué en tus preguntas. Buena suerte. –

Cuestiones relacionadas