Tema: jquery modal y validacion
Ver Mensaje Individual
  #2 (permalink)  
Antiguo 07/05/2012, 22:18
Montes28
 
Fecha de Ingreso: septiembre-2010
Mensajes: 1.853
Antigüedad: 14 años, 3 meses
Puntos: 6
Respuesta: jquery modal y validacion
hola amigos el problema era porque estaba mal ubicado el if ( bValid ) {

este es el codigo de la ventana modal funcionando con validacion por si alguien lo necesita

Código Javascript: 
Ver original
  1. $("#dialog-form").dialog('open');
  2.          $( "#dialog:ui-dialog" ).dialog( "destroy" );
  3.          var title = $( "#title" ),
  4.          allFields = $( [] ).add( title ),
  5.          tips = $( ".validateTips" ); 
  6.                 function updateTips( t ) {
  7.             tips
  8.                 .text( t )
  9.                 .addClass( "ui-state-highlight" );
  10.             setTimeout(function() {
  11.                 tips.removeClass( "ui-state-highlight", 1500 );
  12.             }, 500 );
  13.         }
  14.  
  15.         function checkLength( o, n, min, max ) {
  16.             if ( o.val().length > max || o.val().length < min ) {
  17.                 o.addClass( "ui-state-error" );
  18.                 updateTips("Error este campo es obligatorio, Debe ingresar un nombre para el evento");
  19.                 //updateTips( "Length of " + n + " must be between " +
  20.                 //  min + " and " + max + "." );
  21.                 return false;
  22.             } else {
  23.                 return true;
  24.             }
  25.         }
  26.  
  27.         /*function checkRegexp( o, regexp, n ) {
  28.             if ( !( regexp.test( o.val() ) ) ) {
  29.                 o.addClass( "ui-state-error" );
  30.                 updateTips( n );
  31.                 return false;
  32.             } else {
  33.                 return true;
  34.             }
  35.         }*/
  36.         
  37.         
  38.                  
  39.         $( "#dialog-form" ).dialog({
  40.             autoOpen: false,
  41.             height: 580,
  42.             width: 850,
  43.             modal: true,
  44.             buttons: {
  45.                 "Crear Nuevo Evento": function() {
  46.                 
  47.                 var bValid = true;
  48.                     allFields.removeClass( "ui-state-error" );
  49.  
  50.                     bValid = bValid && checkLength( title, "title", 3, 80 );
  51.                     //bValid = bValid && checkRegexp( title, /^[a-z]([0-9a-z_])+$/i, "Username may consist of a-z, 0-9, underscores, begin with a letter." );
  52.                     
  53.                         var arrayOpt = new Array;
  54.               $('input[type=checkbox]').each(function() {
  55.                         if ($(this).attr('name') == 'opcion[]') {
  56.                             if ($(this).attr('checked') == 'checked') {
  57.                                 arrayOpt.push($(this).val());
  58.                                 
  59.                             }
  60.                         }
  61.                     });
  62.                 //alert (arrayOpt);
  63.          $("#start").val($.fullCalendar.formatDate(start, 'MM/dd/yyyy HH:mm:ss'));
  64.          $("#end").val($.fullCalendar.formatDate(end, 'MM/dd/yyyy HH:mm:ss'));
  65.          $("#allDay").val(allDay);
  66.                 
  67.                 var titleq = $("#title").val();
  68.                 var startq = $("#start").val();
  69.                 var endq = $("#end").val();
  70.                 var allDayq = $("#allDay").val();
  71.                 var nombre = $("#autor").val();
  72.                 
  73.                   
  74.               
  75.               /*$('#modal').each (function(){
  76.               this.reset();
  77.               });*/
  78.                   if ( bValid ) {
  79.                   $.ajax({ 
  80.                   url:'archivo.php',
  81.                   type:'post',
  82.                   data:'opciones='+arrayOpt+'&title='+titleq+'&start='+startq+'&end='+endq+'&allDay='+allDay+'&nombre='+nombre,
  83.                   }).done(function(data) {
  84.                  //alert(titleq+" "+arrayOpt+" "+startq+" "+endq);
  85.                  $('#calendar').fullCalendar( 'refetchEvents' )
  86.                 
  87.     
  88.                   }); 
  89.                   $( this ).dialog( "close" );
  90.                   }
  91.                     //$( this ).dialog( "close" );
  92.                                         
  93.                     
  94.                 },
  95.                 
  96.                 
  97.                 Cancelar: function() {
  98.                 $('input:checkbox').removeAttr('checked');
  99.                 allFields.val( "" ).removeClass( "ui-state-error" );
  100.                     $( this ).dialog( "close" );
  101.                     
  102.                     
  103.                 }
  104.             },
  105.             close: function() {
  106.             allFields.val( "" ).removeClass( "ui-state-error" );
  107.             $('input:checkbox').removeAttr('checked');
  108.                 
  109.             }
  110.         });