Tema: jQuery - Obtener valores de inputs dentro de UI Dialog
Ver Mensaje Individual
  #2 (permalink)  
Antiguo 19/10/2010, 18:18
Avatar de disenopop
disenopop
 
Fecha de Ingreso: septiembre-2005
Mensajes: 10
Antigüedad: 19 años, 2 meses
Puntos: 0
jQuery - Obtener valores de inputs dentro de UI Dialog
Para mayor referencia, este es el código que estoy utilizando:

Código HTML: 
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
  2.     <head>
  3.         <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  4.         <title>jQuery dialog Test</title>
  5.         <!-- jQUery -->
  6.         <link type="text/css" href="sys-assets/plugins/jquery-ui-1.8.4/css/smoothness/jquery-ui-1.8.4.custom.css" rel="stylesheet" />
  7.         <script type="text/javascript" src="sys-assets/plugins/jquery-ui-1.8.4/js/jquery-1.4.2.min.js"></script>
  8.         <script type="text/javascript" src="sys-assets/plugins/jquery-ui-1.8.4/js/jquery-ui-1.8.4.custom.min.js"></script>
  9.         <!-- default 1.0 -->
  10.         <link href="sys-assets/themes/default1.0/css/admin-screen.css" rel="stylesheet" type="text/css" media="screen" />
  11.         <link href="sys-assets/themes/default1.0/css/admin-print.css" rel="stylesheet" type="text/css" media="print" />
  12.         <script type="text/javascript" src="sys-assets/themes/default1.0/js/admin-functions.js"></script>
  13.     </head>
  14.     <body>
  15.         <form action="<?=$_SERVER["PHP_SELF"];?>" method="post" id="register-adminusers">
  16.                 <fieldset class="form-type">
  17.                     <legend>Account</legend>
  18.                     <div class="first-form-row">
  19.                         <label for="adminuser_username"><strong class="red">(*)</strong> Username:</label>
  20.                         <div class="inputs">
  21.                             <input name="adminuser_username" type="text" class="input-med" id="adminuser_username" value="<?=$_POST["adminuser_username"];?>" maxlength="10" tabindex="28" />
  22.                             <!--div class="text-alert">Sin espacios, m&iacute;nimo 3 caracteres, m&aacute;ximo 10</div-->
  23.                             <!--div class="text-alert-no">Mensaje de error</div-->
  24.                         </div>
  25.                     </div>
  26.                     <div class="rel">
  27.                         <div class="form-row">
  28.                             <label>Avatar:</label>
  29.                             <div class="inputs">
  30.                                 <input id="opener_list_images" type="button" name="button" class="input" value="Open gallery" tabindex="35" />
  31.                                 <!--div class="text-alert">Mensaje de ayuda</div-->
  32.                                 <!--div class="text-alert-no">Mensaje de error</div-->
  33.                             </div>
  34.                         </div>
  35.                     </div>
  36.                 </fieldset>
  37.                 <p><input type="submit" name="save_button" class="button" value="Save" tabindex="56" /></p>
  38.                 <!-- jQuery inicia mensajes de ayuda / adicionales inline -->
  39.                 <div id="list_images" class="fields" title="Avatars" style="display:none;">
  40.                     <p>Select an image</p>
  41.                     <div id="image-list">
  42.                         <div class="thumb-container">
  43.                             <img src="sys-uploads/avatars/fgreen.jpg" width="110" height="110" alt="" />
  44.                             <div class="thumb-radio">
  45.                                 <input name="selected_file" type="radio" value="fgreen.jpg" />
  46.                             </div>
  47.                         </div>
  48.                         <div class="thumb-container">
  49.                             <img src="sys-uploads/avatars/fred.jpg" width="110" height="110" alt="" />
  50.                             <div class="thumb-radio">
  51.                                 <input name="selected_file" type="radio" value="fred.jpg" />
  52.                             </div>
  53.                         </div>
  54.                         <div class="thumb-container">
  55.                             <img src="sys-uploads/avatars/mgreen.jpg" width="110" height="110" alt="" />
  56.                             <div class="thumb-radio">
  57.                                 <input name="selected_file" type="radio" value="mgreen.jpg" />
  58.                             </div>
  59.                         </div>
  60.                         <div class="thumb-container">
  61.                             <img src="sys-uploads/avatars/mred.jpg" width="110" height="110" alt="" />
  62.                             <div class="thumb-radio">
  63.                                 <input name="selected_file" type="radio" value="mred.jpg" />
  64.                             </div>
  65.                         </div>
  66.                     </div>
  67.                 </div>
  68.                 <!-- jQuery termina mensajes de ayuda / adicionales inline -->
  69.                 <!-- jQuery inicia definición de parámetros -->
  70.                 <script type="text/javascript">
  71.                 $(function() {
  72.         
  73.                     // Dialogs
  74.                     $('#list_images').dialog({
  75.                         autoOpen: false,
  76.                         show: 'blind',
  77.                         hide: 'blind',
  78.                         width: 400,
  79.                         height: 400,
  80.                         modal: true,
  81.                         buttons: {
  82.                             Ok: function() {
  83.                                 $(this).dialog('close');
  84.                             }
  85.                         }
  86.                     });
  87.                     $('#opener_list_images').click(function() {
  88.                         $('#list_images').dialog('open');
  89.                         return false;
  90.                     });
  91.  
  92.                 });
  93.                 </script>
  94.                 <!-- jQuery termina definición de parámetros -->
  95.             </form>
  96.     </body>
  97. </html>