Ventana emergente para ver ayuda

Rails 2.3.5 (servidor de trabajo, no hay opción de estar en Rails 3). Actualmente sigo usando Prototype, pero también agregué JQuery (sin conflictos) para experimentar con su UI Dialog. Soy un novato sin experiencia en javascript o JQuery y con unos meses de experiencia en Rails.

Tengo una página de índice que enumera 'equipos'. Los listados no muestran toda la información y tienen campos de texto truncados. Entonces, en cada lista de 'equipo' tengo un enlace para mostrar y editar que va a una ventana emergente:

<%= link_to "Team_Details", {:controller => 'teams', :action => 'show', :id => t.id},
popup => ['show','toolbar=no,location=no,directories=no,status=no,
menubar=no,scrollbars=yes,resizable=yes,autosize=yes'] %>

Donde estoy atrapado es:

  • tener la pantalla central abierta emergente
  • haciendo que la ventana emergente tenga un tamaño automático
  • El link_to title no funciona (parece estar sobrescrito por el título de la vista)
  • El aspecto general no es excelente (y no hay animación para abrir / cerrar)

Intenté hacer que esto funcionara en un diálogo de interfaz de usuario de JQuery, pero solo llegué hasta la apertura de una ventana de diálogo vacía. Pensé que poder abrir una vista en una ventana emergente sería bastante común donde habría mucha información de Google, pero no tengo suerte esta noche. Gran parte de la información que encontré trata sobre mostrar el contenido de un div oculto en el diálogo de la interfaz de usuario.

Supongo que me pregunto en qué dirección ir aquí. Solo quiero pasar un parámetro: id a una vista y hacer que esa vista se muestre en una ventana emergente. Si JQuery UI Dialog es un buen camino a seguir, ¿hay algún ejemplo de uso simple por ahí para algo como esto?

Gracias por cualquier ayuda!

preguntado el 09 de enero de 11 a las 06:01

2 Respuestas

Usaría javascript discreto con la caja de luz de la interfaz de usuario de jQuery o con:

http://colorpowered.com/colorbox/

Si usa la última versión, no olvide poner el diseño en falso.

Respondido el 09 de enero de 11 a las 13:01

Gracias, estoy tratando de resolver eso ahora. En los ejemplos, debe definir cada enlace en el script que no veo que funcione muy bien para una lista de páginas de índice. También he estado mirando Topup. Es dos veces más grande, pero simplemente funciona con nombres de clases, por lo que solo necesita una única línea de script para todos sus enlaces. - Reno

En mi aplicación, tengo una lista de usuarios. Al hacer clic en su imagen, se muestra una ventana emergente con detalles. Mi único js es: 'jQuery (". Showdetails"). Colorbox ();' y el código es: 'home', :action => 'details', :type => "team", :id =>member.id%> "class =" showdetails "> <% = image_tag member.picture.url (: small)%> . Ver aquí: phdtalent.com/home/about_us - apneadiving

Si alguien más busca ayuda con el asistente de ventana emergente link_to, el mayor problema que encontré fue que si el usuario vuelve a hacer clic en el navegador sin cerrar la ventana emergente, la ventana emergente perderá el foco y se irá detrás del navegador. Luego, si se abre una nueva ventana emergente, se cargará en esa ventana emergente existente. Parece que tiene una probabilidad extremadamente alta de confundir al usuario porque podría pensar que nunca se abrió una nueva ventana emergente. Para agregar a este problema, IE 6/7/8 tiene un error en su comportamiento para un evento window.onblur. El error cerrará la ventana cuando cambie el contenido. Por lo tanto, si permite que un usuario cambie entre mostrar y editar en la ventana del grupo, ese cambio cerrará la ventana emergente en IE.

Encontré que el script (con la corrección de IE onblur para IE 6/7/8) se encargará de todo:

De Vladimir Kelman http://pro-thoughts.blogspot.com/2006/10/incorrect-behavior-of-windowonblur.html

<head>
     <script type="text/javascript">
          var active_element;
          var bIsMSIE;

          function initiateSelfClosing() {
              if (navigator.appName == "Microsoft Internet Explorer") {
                  active_element = document.activeElement;
                  document.onfocusout = closeWnd;
                  bIsMSIE = true;
                  }
                    else { window.onblur = closeWnd; }
                  }

                  function closeWnd() {
                  if (window.opener != null) {
                  if (bIsMSIE && (active_element != document.activeElement)) {
                    active_element = document.activeElement;
                  }
                      else {
                      window.close();
                  }
              }
          }
      </script>

<body onload="initiateSelfClosing()">

stuff

<body/>

Respondido el 09 de enero de 11 a las 20:01

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.