PHP - REFRESCAR UNA PARTE DE MI WEB CON JQUERY O AJAX

   
Vista:

REFRESCAR UNA PARTE DE MI WEB CON JQUERY O AJAX

Publicado por Hector (22 intervenciones) el 28/08/2015 05:35:44
Buenas noches amigo el problema es el siguiente tengo un formulario de registro en la misma pagina principal, todo funciona bien solo que quiero cuando se envie se refresque solo ese bloque y no la pagina completa, aclaro que no refresca la pagina porque ya estoy usando AJAX , con Jquery para el envio del mismo solo que cuando realiza el envio se quedan puestas las validaciones correctas y el catcha introducido, entonces yo estaba tratando de resetear el formulario luego del envio con esta linea:

1
$('#formulario').trigger("reset");

pero no me sirve xq aun deja las validaciones, no se como escribirla con un load, esto hace durante el envio:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
$.ajax({
            type: "POST",
            url: "./includes/proceso_form.php",
            data: datos,
            beforeSend: function(){
                $('#loader').show();
                $("#registrar").attr("disabled", true);
            },
            cache: false,
            success: function() {
                $('#register_form').html("<div id='mostrar_success'></div>");
                $('#loader').show();
                $('#mostrar_success').html("<h5>Registro Exitoso Revisa tu correo Electronico para Acceder a Warkeys!</h5>")
 
                .hide()
                .fadeToggle(1500, function() {
                    $('#mostrar_success');
                    $('#loader').hide();
                    $('#mostrar_success').fadeOut(6000, function() {
                          //limpia el formulario
                        $('#formulario').trigger("reset");
                         $("#registrar").attr("disabled", false);
pero luego queda como la imagen que les mande y lo que quiero es que quede luego del envio todo en blanco solo ese bloque espero me puedan ayudar.
imagen1
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder

REFRESCAR UNA PARTE DE MI WEB CON JQUERY O AJAX

Publicado por Octavio (7 intervenciones) el 28/08/2015 08:54:20
No se si he entendido bien tu pregunta, pero parece que lo que quieres es que tras el loggin desaparezca el formulario de entrada de datos. Si fuera ese el caso, ¿no te valdría simplemente con limpiar la capa que contiene el formulario?

1
$('#formulario').html('');
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

REFRESCAR UNA PARTE DE MI WEB CON JQUERY O AJAX

Publicado por Hector (22 intervenciones) el 28/08/2015 13:43:44
buenos dias amigo, bueno esa puede ser una opcion lo que quiero es que los valores introducidos no solo se reseteen , tambien tienen que ser las validaciones para eso tengo que refrescar la pagina completa con f5 y no es lo correcto, lo ideal seria mando el formulario le muestro el mensaje exitoso que dura como 6 segundos que ya lo tengo listo y luego quiero que ese formulario se refresque se actualize ese elemento de la pagina nada mas
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Vainas

REFRESCAR UNA PARTE DE MI WEB CON JQUERY O AJAX

Publicado por Vainas (254 intervenciones) el 28/08/2015 19:02:47
Buenas:

Tu quieres que quede el formulario vacio y que las validaciones tambien queden sin el check verder.

Dinos con que codigo estas haciendo las validaciones? A lo mejor tienes que pasarle al mismo tambien algun reset para que desaparezcan los checks verdes.

Ya nos diras algo.

Saludos.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

REFRESCAR UNA PARTE DE MI WEB CON JQUERY O AJAX

Publicado por Hector (22 intervenciones) el 29/08/2015 16:24:22
si asi es amigo, que se quiten los cheks verdes ya logre que limpie solo falta los cheks pero tambien debe refrescar el catcha por eso quiero hacer lo de refrescar esa parte aqui esta el codigo q pasa las validaciones

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
$(document).ready(function() {
        function randomNumber(min, max) {
        return Math.floor(Math.random() * (max - min + 1) + min);
    };
    function generateCaptcha() {
        $('#captchaOperation').html([randomNumber(1, 100), '+', randomNumber(1, 200), '='].join(' '));
    };
    generateCaptcha();
    $('#formulario').bootstrapValidator({
        message: 'This value is not valid',
        container: 'tooltip',
        feedbackIcons: {
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        },
        fields: {
            nombres: {
                container: 'popover',
                validators: {
                    notEmpty: {
                        message: 'El primer Nombre es Requerido'
                    },
                    stringCase: {
                        message: 'El primer nombre solo debe contenr mayúsculas',
                        case: 'upper'
                    },
                    regexp: {
                        regexp: /^[A-Z\s]+$/i,
                        message: 'No se permite números, espacios ni acentos'
                    }
                }
            },
            apellidos: {
                container: 'popover',
                validators: {
                    notEmpty: {
                        message: 'El primer Apellido es Requerido'
                    },
                    stringCase: {
                        message: 'El primer apellido solo debe contenr mayúsculas',
                        case: 'upper'
                    },
                    regexp: {
                        regexp: /^[A-Z\s]+$/i,
                        message: 'No se permite números, espacios ni acentos'
                    }
                }
            },
             captcha: {
                container: 'popover',
                    validators: {
                        notEmpty: {
                        field: 'captcha',
                        message: 'El Captcha es Requerido'
                        },
                        callback: {
                            message: 'Respuesta Incorrecta',
                            callback: function(value, validator) {
                                var items = $('#captchaOperation').html().split(' '), sum = parseInt(items[0]) + parseInt(items[2]);
                                return value == sum;
                            }
                        }
                    }
                },
            username: {
                container: 'popover',
                message: 'El usuario no es válido',
                validators: {
                    notEmpty: {
                        message: 'El usuario es requerido'
                    },
                    stringLength: {
                        min: 6,
                        max: 30,
                        message: 'El usuario debe contener al menos 6 caracteres y/o 30 máximo'
                    },
                    regexp: {
                        regexp: /^[a-zA-Z0-9_\.]+$/,
                        message: 'No se permite usuario con acentos ni números'
                    }
 
                }
            },
            correo: {
                container: 'popover',
                validators: {
                      notEmpty: {
                        message: 'El correo es requerido'
                    },
                    emailAddress: {
                        message: 'El correo no es válido'
                    }
                }
            },
             password: {
                container: 'popover',
                validators: {
                    notEmpty: {
                        field: 'password',
                        message: 'El password es requerido'
                    },
                    identical: {
                        field: 'confirm_password',
                        message: 'El password debe coincidir'
                    },
                    different: {
                        field: 'username',
                        message: 'El password debe ser diferente al usuario'
                    },
 
                }
            },
            confirm_password: {
                container: 'popover',
                validators: {
                    notEmpty: {
                        message: 'Introducir el password para validar'
                    },
                    identical: {
                        field: 'password',
                        message: 'El password debe coincidir'
                    }
 
                }
            },
            idgender: {
                container: 'popover',
                validators: {
                    notEmpty: {
                        message: 'El sexo es requerido'
                    }
                }
            },
            birthday: {
                container: 'popover',
                validators: {
                    date: {
                        format: 'YYYY/MM/DD',
                        message: 'The birthday is not valid'
                    }
                }
            },
            phoneNumber: {
                container: 'popover',
                validators: {
                    digits: {
                        message: 'The value can contain only digits'
                    }
                }
            }
        }
    }).on('error.form.bv', function(e) {
        console.log('error');
 
        // Active the panel element containing the first invalid element
        var $form         = $(e.target),
            validator     = $form.data('bootstrapValidator'),
            $invalidField = validator.getInvalidFields().eq(0),
            $collapse     = $invalidField.parents('.collapse');
 
        $collapse.collapse('show');
 
           if (!validator.isValidField('captcha')) {
                // The captcha is not valid
                // Regenerate the captcha
                generateCaptcha();
            }
    });
 // $('#formulario').find('[name="password"]').on('keyup', function() {
 //        var isEmpty = $(this).val() == '';
 //        $('#formulario').bootstrapValidator('enableFieldValidators', 'password', !isEmpty)
 //                        .bootstrapValidator('enableFieldValidators', 'confirm_password', !isEmpty);
 //        if ($(this).val().length == 1) {
 //            $('#formulario').bootstrapValidator('validateField', 'password')
 //                            .bootstrapValidator('validateField', 'confirm_password');
 //        }
 //    });
});
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Vainas

REFRESCAR UNA PARTE DE MI WEB CON JQUERY O AJAX

Publicado por Vainas (254 intervenciones) el 29/08/2015 17:35:57
Estoy viendo que para el capchat posiblemente tengas que llamar de nuevo a generateCaptcha(); en principio.

No conozco mucho la API pero estoy leyendo algo sobre http://formvalidation.io/api/#reset-form pero no me termina de quedar claro como se usa.

Si veo algo mas te digo.

Saludos.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

REFRESCAR UNA PARTE DE MI WEB CON JQUERY O AJAX

Publicado por HECTOR LOIZ (22 intervenciones) el 31/08/2015 16:09:34
OK AMIGO ESTA BIEN ME NOTIFICAS POR FAVOR
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar