{"id":196,"date":"2016-01-04T21:11:17","date_gmt":"2016-01-04T21:11:17","guid":{"rendered":"http:\/\/www.josejavierfm.es\/blog\/?p=196"},"modified":"2016-01-04T21:16:00","modified_gmt":"2016-01-04T21:16:00","slug":"usar-verify-js-para-validar-un-formulario-usando-ajax","status":"publish","type":"post","link":"https:\/\/www.josejavierfm.es\/blog\/2016\/01\/04\/usar-verify-js-para-validar-un-formulario-usando-ajax\/","title":{"rendered":"Usar verify.js para validar un formulario usando AJAX"},"content":{"rendered":"<p>El plugin\u00a0<a href=\"http:\/\/verifyjs.com\/\">verify.js<\/a>\u00a0nos permite validar un formulario r\u00e1pidamente, pero funciona cuando se env\u00eda el formulario con el bot\u00f3n submit.<\/p>\n<p>Si el formulario lo queremos utilizar mediante ajax no se dispara el evento.<\/p>\n<p><a href=\"http:\/\/www.josejavierfm.es\/blog\/wp-content\/uploads\/2016\/01\/campoobligatorio.png\"><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-197\" src=\"http:\/\/www.josejavierfm.es\/blog\/wp-content\/uploads\/2016\/01\/campoobligatorio.png\" alt=\"campoobligatorio\" width=\"209\" height=\"72\" \/><\/a><\/p>\n<p>Para ellos vamos a utilizar el evento beforeSubmit<\/p>\n<pre>\r\n<form id=\"formulario1\" action=\"destiny.php\" method=\"POST\" name=\"formulario1\">\r\n<input id=\"field\" class=\"form-control\" name=\"field\" type=\"text\" value=\"\" placeholder=\"\" data-validate=\"required\" \/> \r\n<input type=\"submit\" onclick=\"function_validate_form()\"\/>\r\n<\/form>\r\n<script>\r\nfunction function_validate_form(){\r\n    $('#formulario1').verify({\r\n    'beforeSubmit': function(form, result) {\r\n    if (result) {\r\n        \/\/ Since the form is valid, submit form via AJAX.\r\n      alert('OK, send ajax');\r\n      send_ajax();\r\n    }else{\r\n        \/\/do nothing\r\n    }\r\n\r\n    \/\/ Form is either invalid or was already submitted, return `false` to tell verify.js to not submit the form.\r\n    return false; \r\n}\r\n});\r\n}\r\nfunction send_ajax(){\r\nvar formData = $(\"#formulario1\").serializeArray(); \r\nvar URL = $(\"#formulario1\").attr(\"action\"); \r\n$.post(URL, formData, function(data) { console.log(data); },\"json\") .fail(function(jqXHR, textStatus, errorThrown) { alert( \"error ajax\" ); });\r\n}\r\n<\/script>\r\n<script src=\"plugins\/jQuery\/jQuery-2.1.4.min.js\"><\/script>\r\n<script src=\"plugins\/jQueryUI\/jquery-ui.min.js\"><\/script>\r\n<script src=\"plugins\/verify.notify.min.js\"><\/script>\r\n<\/pre>\n\n<div class=\"twitter-share\"><a href=\"https:\/\/twitter.com\/intent\/tweet?via=josejavierfm\" class=\"twitter-share-button\">Twittear<\/a><\/div>\n","protected":false},"excerpt":{"rendered":"<p>El plugin\u00a0verify.js\u00a0nos permite validar un formulario r\u00e1pidamente, pero funciona cuando se env\u00eda el formulario con el bot\u00f3n submit. Si el formulario lo queremos utilizar mediante ajax no se dispara el evento. Para ellos vamos a utilizar el evento beforeSubmit<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[14,10],"tags":[],"_links":{"self":[{"href":"https:\/\/www.josejavierfm.es\/blog\/wp-json\/wp\/v2\/posts\/196"}],"collection":[{"href":"https:\/\/www.josejavierfm.es\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.josejavierfm.es\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.josejavierfm.es\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.josejavierfm.es\/blog\/wp-json\/wp\/v2\/comments?post=196"}],"version-history":[{"count":4,"href":"https:\/\/www.josejavierfm.es\/blog\/wp-json\/wp\/v2\/posts\/196\/revisions"}],"predecessor-version":[{"id":201,"href":"https:\/\/www.josejavierfm.es\/blog\/wp-json\/wp\/v2\/posts\/196\/revisions\/201"}],"wp:attachment":[{"href":"https:\/\/www.josejavierfm.es\/blog\/wp-json\/wp\/v2\/media?parent=196"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.josejavierfm.es\/blog\/wp-json\/wp\/v2\/categories?post=196"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.josejavierfm.es\/blog\/wp-json\/wp\/v2\/tags?post=196"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}