{"id":2857,"date":"2020-09-09T08:50:07","date_gmt":"2020-09-09T13:50:07","guid":{"rendered":"http:\/\/linuxitos.com\/main\/?p=2857"},"modified":"2020-09-09T08:50:09","modified_gmt":"2020-09-09T13:50:09","slug":"enviar-por-ajax-un-formulario-devuelto-por-ajax-previamente","status":"publish","type":"post","link":"https:\/\/linuxitos.com\/main\/enviar-por-ajax-un-formulario-devuelto-por-ajax-previamente\/","title":{"rendered":"Enviar por ajax un formulario devuelto por ajax previamente"},"content":{"rendered":"\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"788\" height=\"616\" src=\"https:\/\/linuxitos.com\/main\/wp-content\/uploads\/2020\/09\/ajax.png\" alt=\"\" class=\"wp-image-2858\" srcset=\"https:\/\/linuxitos.com\/main\/wp-content\/uploads\/2020\/09\/ajax.png 788w, https:\/\/linuxitos.com\/main\/wp-content\/uploads\/2020\/09\/ajax-300x235.png 300w, https:\/\/linuxitos.com\/main\/wp-content\/uploads\/2020\/09\/ajax-768x600.png 768w\" sizes=\"auto, (max-width: 788px) 100vw, 788px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Introducci\u00f3n<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Al enviar un formulario v\u00eda ajax para realizar una acci\u00f3n, lo normal es utilizar el c\u00f3digo siguiente, sin embargo, si por alguna raz\u00f3n, el formulario que se desea enviar por ajax, fue devuelto tambi\u00e9n por ajax, el c\u00f3digo siguiente no funciona:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">$(\"#form\").submit(function( event ) {\n\tvar parametros = $(this).serialize();\n\t$.ajax({\n\t\ttype: \"POST\",\n\t\tdataType: 'json',\n\t\turl: \"ajax\/addForm.php\",\n\t\tdata: parametros,\n\t\tbeforeSend: function(objeto){\n                      \/\/algo antes\n\t\t},\n\t\tsuccess: function(response){\n                      \/\/algo si todo va bien\n\t\t},\n\t\terror: function(response) {\n                      \/\/algo si fall\u00f3\n\t\t}\n\t});\n\tevent.preventDefault();\n});<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u00c9ste fragmento de c\u00f3digo es muy simple de invocar, ya que espera cuando se ejecuta el evento submit del formulario, y realiza la acci\u00f3n previamente programada, sin embargo, si el formulario tambi\u00e9n se obtuvo mediante una respuesta ajax, en mi caso no ha funcionado.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Soluci\u00f3n<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u00c9sta soluci\u00f3n es aplicable para muchos formulario al mismo tiempo, ya que se utiliza dom para acceder al elemento mediante una clase, por lo tanto, s\u00f3lo basta a\u00f1adir la el nombre de la clase al formulario y listo. El c\u00f3digo siguiente permite enviar formulario por ajax que fue devuelto por ajax.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">$(document).on(\"submit\", \".formUp\", function () {\n\tvar parametros = $(this).serialize();\n\t$.ajax({\n\t\ttype: \t\t\"POST\",\n\t\tdataType: \t\"JSON\",\n\t\tmethod: \t\"POST\",\n\t\turl: \"ajax\/formUp.php\",\n\t\tdata: parametros,\n\t\tbeforeSend: function(objeto){\n\t\t\t\/\/algo previo al enviar\n\t\t},\n\t\tsuccess: function(respuesta){\n\t\t\t\/\/algo si va todobien\n\t\t},\n\t\terror: function(data) {\n\t\t\t\/\/algo si falla\n\t\t}\n\t});\n\tevent.preventDefault();\n});<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u00c9sta es la soluci\u00f3n que encontr\u00e9, asumir\u00e9 que las otras secci\u00f3n que son el catch de la informaci\u00f3n desde php, la podr\u00e1n generar, cualquier duda, dejar un comentario.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Introducci\u00f3n Al enviar un formulario v\u00eda ajax para realizar una acci\u00f3n, lo normal es utilizar el c\u00f3digo siguiente, sin embargo, si por alguna raz\u00f3n, el formulario que se desea enviar por ajax, fue devuelto tambi\u00e9n por ajax, el c\u00f3digo siguiente no funciona: \u00c9ste fragmento de c\u00f3digo es muy simple de invocar, ya que espera cuando [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[61,1540],"tags":[1699,1556],"class_list":["post-2857","post","type-post","status-publish","format-standard","hentry","category-ajax","category-develepmet","tag-jquery","tag-php"],"_links":{"self":[{"href":"https:\/\/linuxitos.com\/main\/wp-json\/wp\/v2\/posts\/2857","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/linuxitos.com\/main\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/linuxitos.com\/main\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/linuxitos.com\/main\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/linuxitos.com\/main\/wp-json\/wp\/v2\/comments?post=2857"}],"version-history":[{"count":1,"href":"https:\/\/linuxitos.com\/main\/wp-json\/wp\/v2\/posts\/2857\/revisions"}],"predecessor-version":[{"id":2859,"href":"https:\/\/linuxitos.com\/main\/wp-json\/wp\/v2\/posts\/2857\/revisions\/2859"}],"wp:attachment":[{"href":"https:\/\/linuxitos.com\/main\/wp-json\/wp\/v2\/media?parent=2857"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/linuxitos.com\/main\/wp-json\/wp\/v2\/categories?post=2857"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/linuxitos.com\/main\/wp-json\/wp\/v2\/tags?post=2857"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}