{"id":5983,"date":"2013-11-08T20:46:47","date_gmt":"2013-11-08T20:46:47","guid":{"rendered":"https:\/\/www.jose-aguilar.com\/blog\/?p=5983"},"modified":"2019-05-23T11:25:55","modified_gmt":"2019-05-23T11:25:55","slug":"combos-dependientes-con-jquery-ajax-php-base-datos","status":"publish","type":"post","link":"https:\/\/www.jose-aguilar.com\/blog\/combos-dependientes-con-jquery-ajax-php-base-datos\/","title":{"rendered":"Combos dependientes con jQuery, Ajax y PHP con base de datos"},"content":{"rendered":"<p>En este art\u00edculo vamos a implementar unos <strong>combos dependientes o selectores<\/strong> utilizando <strong>jQuery<\/strong>, <strong>Ajax<\/strong>, <strong>PHP<\/strong> y <strong>MySQLi<\/strong> con el objetivo principal de interactuar con una base de datos.<\/p>\n<p>Este art\u00edculo va asociado a un art\u00edculo anterior en el que explic\u00e1bamos <a href=\"https:\/\/www.jose-aguilar.com\/blog\/combos-dependientes-con-jquery-ajax-y-php\/\" target=\"_blank\" rel=\"noopener noreferrer\">como realizar combos dependientes con jQuery, Ajax y PHP<\/a>.<\/p>\n<p>En este caso queremos ampliarlo con un ejemplo de <strong>combos dependientes o selectores<\/strong>\u00a0con <strong>jQuery<\/strong>, <strong>Ajax<\/strong> y <strong>PHP<\/strong> interactuando con los datos de una base de datos trabajando con <strong>MySQLi<\/strong> orientado a objetos.<\/p>\n<p>En el ejemplo que vamos a ilustrar vamos\u00a0 a jugar con una base de datos de una tienda de demostraci\u00f3n que tenemos desarrollada con <strong>PrestaShop<\/strong> que utiliza su sistema de categor\u00edas para contemplar las marcas y modelos de los coches que se venden. Por lo tanto, vamos a tener un primer selector con las marcas (primer nivel de categor\u00edas) y un segundo selector ser\u00e1 din\u00e1mico en funci\u00f3n de lo que hayamos escogido en el primero para mostrar el modelo.<\/p>\n<p>Para implementarlo lo primero que tendremos que considerar es la recogida de la informaci\u00f3n a depositar en el primer selector, en el cuerpo de la p\u00e1gina o dentro del &lt;body&gt; a\u00f1adiremos el formulario:<\/p>\n<div id=\"wpshdo_1\" class=\"wp-synhighlighter-outer\"><div id=\"wpshdt_1\" class=\"wp-synhighlighter-expanded\"><table border=\"0\" width=\"100%\"><tr><td align=\"left\" width=\"80%\"><a name=\"#codesyntax_1\"><\/a><a id=\"wpshat_1\" class=\"wp-synhighlighter-title\" href=\"#codesyntax_1\"  onClick=\"javascript:wpsh_toggleBlock(1)\" title=\"Click to show\/hide code block\">Source code<\/a><\/td><td align=\"right\"><a href=\"#codesyntax_1\" onClick=\"javascript:wpsh_code(1)\" title=\"Show code only\"><img decoding=\"async\" border=\"0\" style=\"border: 0 none\" src=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/plugins\/wp-synhighlight\/themes\/default\/images\/code.png\" \/><\/a>&nbsp;<a href=\"#codesyntax_1\" onClick=\"javascript:wpsh_print(1)\" title=\"Print code\"><img decoding=\"async\" border=\"0\" style=\"border: 0 none\" src=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/plugins\/wp-synhighlight\/themes\/default\/images\/printer.png\" \/><\/a>&nbsp;<a href=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/plugins\/wp-synhighlight\/About.html\" target=\"_blank\" title=\"Show plugin information\"><img decoding=\"async\" border=\"0\" style=\"border: 0 none\" src=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/plugins\/wp-synhighlight\/themes\/default\/images\/info.gif\" \/><\/a>&nbsp;<\/td><\/tr><\/table><\/div><div id=\"wpshdi_1\" class=\"wp-synhighlighter-inner\" style=\"display: block;\"><pre class=\"php\" style=\"font-family:monospace;\">&lt;form class=&quot;row&quot; action=&quot;&quot; method=&quot;post&quot;&gt;\n    &lt;div class=&quot;form-group col-lg-3&quot;&gt;\n        &lt;label for=&quot;category&quot;&gt;Marca&lt;\/label&gt;\n        &lt;select name=&quot;category&quot; id=&quot;category&quot; class=&quot;form-control&quot;&gt;\n            <span class=\"kw2\">&lt;?php<\/span>\n            <span class=\"re0\">$conexion<\/span> <span class=\"sy0\">=<\/span> <span class=\"kw2\">new<\/span> mysqli<span class=\"br0\">&#40;<\/span><span class=\"st_h\">'localhost'<\/span><span class=\"sy0\">,<\/span> DB_SERVER_USERNAME<span class=\"sy0\">,<\/span> DB_SERVER_PASSWORD<span class=\"sy0\">,<\/span> DB_DATABASE<span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span>\n            <span class=\"re0\">$result<\/span> <span class=\"sy0\">=<\/span> <span class=\"re0\">$conexion<\/span><span class=\"sy0\">-&gt;<\/span><span class=\"me1\">query<\/span><span class=\"br0\">&#40;<\/span>\n                <span class=\"st0\">&quot;SELECT c.id_category, name FROM category c\n                LEFT JOIN category_lang cl ON (cl.id_category = c.id_category AND cl.id_lang = 1)\n                WHERE id_parent = 2 ORDER BY name ASC&quot;<\/span>\n            <span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span>\n            <span class=\"kw1\">if<\/span> <span class=\"br0\">&#40;<\/span><span class=\"re0\">$result<\/span><span class=\"sy0\">-&gt;<\/span><span class=\"me1\">num_rows<\/span> <span class=\"sy0\">&gt;<\/span> 0<span class=\"br0\">&#41;<\/span> <span class=\"br0\">&#123;<\/span>\n                <span class=\"kw1\">while<\/span> <span class=\"br0\">&#40;<\/span><span class=\"re0\">$row<\/span> <span class=\"sy0\">=<\/span> <span class=\"re0\">$result<\/span><span class=\"sy0\">-&gt;<\/span><span class=\"me1\">fetch_assoc<\/span><span class=\"br0\">&#40;<\/span><span class=\"br0\">&#41;<\/span><span class=\"br0\">&#41;<\/span> <span class=\"br0\">&#123;<\/span>                \n                    <span class=\"kw1\">echo<\/span> <span class=\"st_h\">'&lt;option value=&quot;'<\/span><span class=\"sy0\">.<\/span><span class=\"re0\">$row<\/span><span class=\"br0\">[<\/span><span class=\"st_h\">'id_category'<\/span><span class=\"br0\">]<\/span><span class=\"sy0\">.<\/span><span class=\"st_h\">'&quot;&gt;'<\/span><span class=\"sy0\">.<\/span><span class=\"re0\">$row<\/span><span class=\"br0\">[<\/span><span class=\"st_h\">'name'<\/span><span class=\"br0\">]<\/span><span class=\"sy0\">.<\/span><span class=\"st_h\">'&lt;\/option&gt;'<\/span><span class=\"sy0\">;<\/span>\n                <span class=\"br0\">&#125;<\/span>\n            <span class=\"br0\">&#125;<\/span>\n            <span class=\"sy1\">?&gt;<\/span>\n        &lt;\/select&gt;\n    &lt;\/div&gt;\n    &lt;div class=&quot;form-group col-lg-3&quot;&gt;\n        &lt;label for=&quot;subcategory&quot;&gt;Modelo&lt;\/label&gt;\n        &lt;select name=&quot;subcategory&quot; id=&quot;subcategory&quot; class=&quot;form-control&quot;&gt;&lt;\/select&gt;\n    &lt;\/div&gt;\n&lt;\/form&gt;<\/pre><\/div><\/div>\n<p>Tan solo estamos creando el formulario con 2 selectores. En el primero mostraremos las categor\u00edas principales que en el caso del ejemplo son las marcas. Estamos conectando con la base de datos y realizando una consulta para obtener las categor\u00edas principales ordenadas por nombre en formato ascendente. En el caso de que haya resultados, recorremos el array resultante para imprimir las opciones del selector de marcas.<\/p>\n<p>Tambi\u00e9n tenemos el selector de modelos presente en la p\u00e1gina pero en este caso vac\u00edo para rellenarlo con la llamada Ajax seg\u00fan la categor\u00eda principal (marca) escogida.<\/p>\n<p>(*) Recuerda cambiar las par\u00e1metros de conexi\u00f3n con la base de datos para hacerlo funcionar en tu sitio.<\/p>\n<p>En la misma p\u00e1gina tenemos que incorporar dentro de la etiqueta &lt;head&gt; la librer\u00eda jQuery y el script necesario para capturar el evento:<\/p>\n<div id=\"wpshdo_2\" class=\"wp-synhighlighter-outer\"><div id=\"wpshdt_2\" class=\"wp-synhighlighter-expanded\"><table border=\"0\" width=\"100%\"><tr><td align=\"left\" width=\"80%\"><a name=\"#codesyntax_2\"><\/a><a id=\"wpshat_2\" class=\"wp-synhighlighter-title\" href=\"#codesyntax_2\"  onClick=\"javascript:wpsh_toggleBlock(2)\" title=\"Click to show\/hide code block\">Source code<\/a><\/td><td align=\"right\"><a href=\"#codesyntax_2\" onClick=\"javascript:wpsh_code(2)\" title=\"Show code only\"><img decoding=\"async\" border=\"0\" style=\"border: 0 none\" src=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/plugins\/wp-synhighlight\/themes\/default\/images\/code.png\" \/><\/a>&nbsp;<a href=\"#codesyntax_2\" onClick=\"javascript:wpsh_print(2)\" title=\"Print code\"><img decoding=\"async\" border=\"0\" style=\"border: 0 none\" src=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/plugins\/wp-synhighlight\/themes\/default\/images\/printer.png\" \/><\/a>&nbsp;<a href=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/plugins\/wp-synhighlight\/About.html\" target=\"_blank\" title=\"Show plugin information\"><img decoding=\"async\" border=\"0\" style=\"border: 0 none\" src=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/plugins\/wp-synhighlight\/themes\/default\/images\/info.gif\" \/><\/a>&nbsp;<\/td><\/tr><\/table><\/div><div id=\"wpshdi_2\" class=\"wp-synhighlighter-inner\" style=\"display: block;\"><pre class=\"javascript\" style=\"font-family:monospace;\">&lt;script src=&quot;https:\/\/code.jquery.com\/jquery-3.2.1.js&quot;&gt;&lt;\/script&gt;\n<span class=\"sy0\">&lt;<\/span>script language<span class=\"sy0\">=<\/span><span class=\"st0\">&quot;javascript&quot;<\/span><span class=\"sy0\">&gt;<\/span>\n$<span class=\"br0\">&#40;<\/span>document<span class=\"br0\">&#41;<\/span>.<span class=\"me1\">ready<\/span><span class=\"br0\">&#40;<\/span><span class=\"kw2\">function<\/span><span class=\"br0\">&#40;<\/span><span class=\"br0\">&#41;<\/span><span class=\"br0\">&#123;<\/span>\n    $<span class=\"br0\">&#40;<\/span><span class=\"st0\">&quot;#category&quot;<\/span><span class=\"br0\">&#41;<\/span>.<span class=\"me1\">on<\/span><span class=\"br0\">&#40;<\/span><span class=\"st0\">'change'<\/span><span class=\"sy0\">,<\/span> <span class=\"kw2\">function<\/span> <span class=\"br0\">&#40;<\/span><span class=\"br0\">&#41;<\/span> <span class=\"br0\">&#123;<\/span>\n        $<span class=\"br0\">&#40;<\/span><span class=\"st0\">&quot;#category option:selected&quot;<\/span><span class=\"br0\">&#41;<\/span>.<span class=\"me1\">each<\/span><span class=\"br0\">&#40;<\/span><span class=\"kw2\">function<\/span> <span class=\"br0\">&#40;<\/span><span class=\"br0\">&#41;<\/span> <span class=\"br0\">&#123;<\/span>\n            <span class=\"kw2\">var<\/span> id_category <span class=\"sy0\">=<\/span> $<span class=\"br0\">&#40;<\/span><span class=\"kw1\">this<\/span><span class=\"br0\">&#41;<\/span>.<span class=\"me1\">val<\/span><span class=\"br0\">&#40;<\/span><span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span>\n            $.<span class=\"me1\">post<\/span><span class=\"br0\">&#40;<\/span><span class=\"st0\">&quot;subcategories.php&quot;<\/span><span class=\"sy0\">,<\/span> <span class=\"br0\">&#123;<\/span> id_category<span class=\"sy0\">:<\/span> id_category <span class=\"br0\">&#125;<\/span><span class=\"sy0\">,<\/span> <span class=\"kw2\">function<\/span><span class=\"br0\">&#40;<\/span>data<span class=\"br0\">&#41;<\/span> <span class=\"br0\">&#123;<\/span>\n                $<span class=\"br0\">&#40;<\/span><span class=\"st0\">&quot;#subcategory&quot;<\/span><span class=\"br0\">&#41;<\/span>.<span class=\"me1\">html<\/span><span class=\"br0\">&#40;<\/span>data<span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span>\n            <span class=\"br0\">&#125;<\/span><span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span>\t\t\t\n        <span class=\"br0\">&#125;<\/span><span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span>\n   <span class=\"br0\">&#125;<\/span><span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span>\n<span class=\"br0\">&#125;<\/span><span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span>\n<span class=\"sy0\">&lt;\/<\/span>script<span class=\"sy0\">&gt;<\/span><\/pre><\/div><\/div>\n<p>En este caso, se est\u00e1 esperando a que se cambie un valor del selector de marcas para rellenar v\u00eda <strong>Ajax<\/strong> el segundo combo (modelos) condicionado con el valor elegido de la marca. El selector con identificador \u00absubcategory\u00bb se rellenar\u00e1 de las opciones que retorna el archivo\u00a0\u00absubcategories.php\u00bb.<\/p>\n<p>El archivo \u00absubcategories.php\u00bb retorna en formato html las opciones (modelos) de la marca seleccionada. Este archivo contiene:<\/p>\n<div id=\"wpshdo_3\" class=\"wp-synhighlighter-outer\"><div id=\"wpshdt_3\" class=\"wp-synhighlighter-expanded\"><table border=\"0\" width=\"100%\"><tr><td align=\"left\" width=\"80%\"><a name=\"#codesyntax_3\"><\/a><a id=\"wpshat_3\" class=\"wp-synhighlighter-title\" href=\"#codesyntax_3\"  onClick=\"javascript:wpsh_toggleBlock(3)\" title=\"Click to show\/hide code block\">Source code<\/a><\/td><td align=\"right\"><a href=\"#codesyntax_3\" onClick=\"javascript:wpsh_code(3)\" title=\"Show code only\"><img decoding=\"async\" border=\"0\" style=\"border: 0 none\" src=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/plugins\/wp-synhighlight\/themes\/default\/images\/code.png\" \/><\/a>&nbsp;<a href=\"#codesyntax_3\" onClick=\"javascript:wpsh_print(3)\" title=\"Print code\"><img decoding=\"async\" border=\"0\" style=\"border: 0 none\" src=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/plugins\/wp-synhighlight\/themes\/default\/images\/printer.png\" \/><\/a>&nbsp;<a href=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/plugins\/wp-synhighlight\/About.html\" target=\"_blank\" title=\"Show plugin information\"><img decoding=\"async\" border=\"0\" style=\"border: 0 none\" src=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/plugins\/wp-synhighlight\/themes\/default\/images\/info.gif\" \/><\/a>&nbsp;<\/td><\/tr><\/table><\/div><div id=\"wpshdi_3\" class=\"wp-synhighlighter-inner\" style=\"display: block;\"><pre class=\"php\" style=\"font-family:monospace;\"><span class=\"kw2\">&lt;?php<\/span>\n<span class=\"re0\">$html<\/span> <span class=\"sy0\">=<\/span> <span class=\"st_h\">''<\/span><span class=\"sy0\">;<\/span>\n<span class=\"re0\">$conexion<\/span> <span class=\"sy0\">=<\/span> <span class=\"kw2\">new<\/span> mysqli<span class=\"br0\">&#40;<\/span><span class=\"st_h\">'localhost'<\/span><span class=\"sy0\">,<\/span> DB_SERVER_USERNAME<span class=\"sy0\">,<\/span> DB_SERVER_PASSWORD<span class=\"sy0\">,<\/span> DB_DATABASE<span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span>\n&nbsp;\n<span class=\"re0\">$id_category<\/span> <span class=\"sy0\">=<\/span> <span class=\"re0\">$_POST<\/span><span class=\"br0\">[<\/span><span class=\"st_h\">'id_category'<\/span><span class=\"br0\">]<\/span><span class=\"sy0\">;<\/span>\n&nbsp;\n<span class=\"re0\">$result<\/span> <span class=\"sy0\">=<\/span> <span class=\"re0\">$conexion<\/span><span class=\"sy0\">-&gt;<\/span><span class=\"me1\">query<\/span><span class=\"br0\">&#40;<\/span>\n    <span class=\"st0\">&quot;SELECT c.id_category, name FROM category c\n    LEFT JOIN category_lang cl ON (cl.id_category = c.id_category AND cl.id_lang = 1)\n    WHERE id_parent = &quot;<\/span><span class=\"sy0\">.<\/span><span class=\"re0\">$id_category<\/span><span class=\"sy0\">.<\/span><span class=\"st0\">&quot; ORDER BY name ASC&quot;<\/span>\n<span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span>\n<span class=\"kw1\">if<\/span> <span class=\"br0\">&#40;<\/span><span class=\"re0\">$result<\/span><span class=\"sy0\">-&gt;<\/span><span class=\"me1\">num_rows<\/span> <span class=\"sy0\">&gt;<\/span> 0<span class=\"br0\">&#41;<\/span> <span class=\"br0\">&#123;<\/span>\n    <span class=\"kw1\">while<\/span> <span class=\"br0\">&#40;<\/span><span class=\"re0\">$row<\/span> <span class=\"sy0\">=<\/span> <span class=\"re0\">$result<\/span><span class=\"sy0\">-&gt;<\/span><span class=\"me1\">fetch_assoc<\/span><span class=\"br0\">&#40;<\/span><span class=\"br0\">&#41;<\/span><span class=\"br0\">&#41;<\/span> <span class=\"br0\">&#123;<\/span>                \n        <span class=\"re0\">$html<\/span> <span class=\"sy0\">.=<\/span> <span class=\"st_h\">'&lt;option value=&quot;'<\/span><span class=\"sy0\">.<\/span><span class=\"re0\">$row<\/span><span class=\"br0\">[<\/span><span class=\"st_h\">'id_category'<\/span><span class=\"br0\">]<\/span><span class=\"sy0\">.<\/span><span class=\"st_h\">'&quot;&gt;'<\/span><span class=\"sy0\">.<\/span><span class=\"re0\">$row<\/span><span class=\"br0\">[<\/span><span class=\"st_h\">'name'<\/span><span class=\"br0\">]<\/span><span class=\"sy0\">.<\/span><span class=\"st_h\">'&lt;\/option&gt;'<\/span><span class=\"sy0\">;<\/span>\n    <span class=\"br0\">&#125;<\/span>\n<span class=\"br0\">&#125;<\/span>\n<span class=\"kw1\">echo<\/span> <span class=\"re0\">$html<\/span><span class=\"sy0\">;<\/span>\n<span class=\"sy1\">?&gt;<\/span><\/pre><\/div><\/div>\n<p>Como puedes observar, conectamos de nuevo con la base de datos, capturamos el identificador de la categor\u00eda seleccionada, armamos la consulta que nos retorna un array de los hijos de la categor\u00eda seleccionada ordenadas por nombre en formato ascendente y retornamos las opciones del selector de modelos mediante un echo de la variable $html que hemos ido rellenando al recorrer el array de modelos.<\/p>\n<p class=\"text-center\" style=\"text-align: center;\"><a class=\"btn btn-secondary\" href=\"https:\/\/www.jose-aguilar.com\/scripts\/jquery\/combos-dependientes\/categories.php\" target=\"_blank\" rel=\"noopener noreferrer\"><i class=\"fa fa-eye\"><\/i> Ver demo<\/a> <a class=\"btn btn-primary\" href=\"https:\/\/www.jose-aguilar.com\/scripts\/jquery\/combos-dependientes\/combos-dependientes.zip\"><i class=\"fa fa-download\"><\/i> Descargar<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>En este art\u00edculo vamos a implementar unos combos dependientes o selectores utilizando jQuery, Ajax, PHP y MySQLi con el objetivo principal de interactuar con una base de datos. Este art\u00edculo va asociado a un art\u00edculo anterior en el que explic\u00e1bamos como realizar combos dependientes con jQuery, Ajax y PHP. En este caso queremos ampliarlo con [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":7312,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[31,5,3],"tags":[167,62],"class_list":["post-5983","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ajax","category-jquery","category-php","tag-eventos","tag-selects"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.6 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Combos dependientes con jQuery, Ajax y PHP con base de datos - Jose Aguilar Blog<\/title>\n<meta name=\"description\" content=\"C\u00f3digo de ejemplo que te permite a\u00f1adir combos dependientes (selects) utilizando jQuery, Ajax, PHP y MySQLi para interactuar con una base de datos.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Combos dependientes con jQuery, Ajax y PHP con base de datos - Jose Aguilar Blog\" \/>\n<meta property=\"og:description\" content=\"C\u00f3digo de ejemplo que te permite a\u00f1adir combos dependientes (selects) utilizando jQuery, Ajax, PHP y MySQLi para interactuar con una base de datos.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.jose-aguilar.com\/blog\/combos-dependientes-con-jquery-ajax-php-base-datos\/\" \/>\n<meta property=\"og:site_name\" content=\"Jose Aguilar Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/joseaguilarblog\" \/>\n<meta property=\"article:published_time\" content=\"2013-11-08T20:46:47+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2019-05-23T11:25:55+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2013\/11\/combos-dependientes-con-jquery-ajax-php-base-datos.png\" \/>\n\t<meta property=\"og:image:width\" content=\"250\" \/>\n\t<meta property=\"og:image:height\" content=\"250\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Jose Aguilar\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@JoseAguilarBlog\" \/>\n<meta name=\"twitter:site\" content=\"@JoseAguilarBlog\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Jose Aguilar\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/combos-dependientes-con-jquery-ajax-php-base-datos\/\",\"url\":\"https:\/\/www.jose-aguilar.com\/blog\/combos-dependientes-con-jquery-ajax-php-base-datos\/\",\"name\":\"Combos dependientes con jQuery, Ajax y PHP con base de datos - Jose Aguilar Blog\",\"isPartOf\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/combos-dependientes-con-jquery-ajax-php-base-datos\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/combos-dependientes-con-jquery-ajax-php-base-datos\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2013\/11\/combos-dependientes-con-jquery-ajax-php-base-datos.png\",\"datePublished\":\"2013-11-08T20:46:47+00:00\",\"dateModified\":\"2019-05-23T11:25:55+00:00\",\"author\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/e6d485db1e1140866e95971d17105d11\"},\"description\":\"C\u00f3digo de ejemplo que te permite a\u00f1adir combos dependientes (selects) utilizando jQuery, Ajax, PHP y MySQLi para interactuar con una base de datos.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/combos-dependientes-con-jquery-ajax-php-base-datos\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.jose-aguilar.com\/blog\/combos-dependientes-con-jquery-ajax-php-base-datos\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/combos-dependientes-con-jquery-ajax-php-base-datos\/#primaryimage\",\"url\":\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2013\/11\/combos-dependientes-con-jquery-ajax-php-base-datos.png\",\"contentUrl\":\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2013\/11\/combos-dependientes-con-jquery-ajax-php-base-datos.png\",\"width\":250,\"height\":250},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/combos-dependientes-con-jquery-ajax-php-base-datos\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\/\/www.jose-aguilar.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Combos dependientes con jQuery, Ajax y PHP con base de datos\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#website\",\"url\":\"https:\/\/www.jose-aguilar.com\/blog\/\",\"name\":\"Jose Aguilar Blog\",\"description\":\"Desarrollo Web con PrestaShop, WordPress, PHP, jQuery y Ajax\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.jose-aguilar.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/e6d485db1e1140866e95971d17105d11\",\"name\":\"Jose Aguilar\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/abbfef5f1d75260c549d0f2c2842bb697ba1aadff3b2836b39d2590c8a625415?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/abbfef5f1d75260c549d0f2c2842bb697ba1aadff3b2836b39d2590c8a625415?s=96&d=mm&r=g\",\"caption\":\"Jose Aguilar\"},\"description\":\"Director ejecutivo y tecnol\u00f3gico en JA Modules. Experto programador PrestaShop y Experto programador WordPress.\",\"sameAs\":[\"https:\/\/plus.google.com\/114357189801512615537\"],\"url\":\"https:\/\/www.jose-aguilar.com\/blog\/author\/josea902\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Combos dependientes con jQuery, Ajax y PHP con base de datos - Jose Aguilar Blog","description":"C\u00f3digo de ejemplo que te permite a\u00f1adir combos dependientes (selects) utilizando jQuery, Ajax, PHP y MySQLi para interactuar con una base de datos.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"og_locale":"es_ES","og_type":"article","og_title":"Combos dependientes con jQuery, Ajax y PHP con base de datos - Jose Aguilar Blog","og_description":"C\u00f3digo de ejemplo que te permite a\u00f1adir combos dependientes (selects) utilizando jQuery, Ajax, PHP y MySQLi para interactuar con una base de datos.","og_url":"https:\/\/www.jose-aguilar.com\/blog\/combos-dependientes-con-jquery-ajax-php-base-datos\/","og_site_name":"Jose Aguilar Blog","article_publisher":"https:\/\/www.facebook.com\/joseaguilarblog","article_published_time":"2013-11-08T20:46:47+00:00","article_modified_time":"2019-05-23T11:25:55+00:00","og_image":[{"width":250,"height":250,"url":"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2013\/11\/combos-dependientes-con-jquery-ajax-php-base-datos.png","type":"image\/png"}],"author":"Jose Aguilar","twitter_card":"summary_large_image","twitter_creator":"@JoseAguilarBlog","twitter_site":"@JoseAguilarBlog","twitter_misc":{"Escrito por":"Jose Aguilar","Tiempo de lectura":"4 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.jose-aguilar.com\/blog\/combos-dependientes-con-jquery-ajax-php-base-datos\/","url":"https:\/\/www.jose-aguilar.com\/blog\/combos-dependientes-con-jquery-ajax-php-base-datos\/","name":"Combos dependientes con jQuery, Ajax y PHP con base de datos - Jose Aguilar Blog","isPartOf":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/combos-dependientes-con-jquery-ajax-php-base-datos\/#primaryimage"},"image":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/combos-dependientes-con-jquery-ajax-php-base-datos\/#primaryimage"},"thumbnailUrl":"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2013\/11\/combos-dependientes-con-jquery-ajax-php-base-datos.png","datePublished":"2013-11-08T20:46:47+00:00","dateModified":"2019-05-23T11:25:55+00:00","author":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/e6d485db1e1140866e95971d17105d11"},"description":"C\u00f3digo de ejemplo que te permite a\u00f1adir combos dependientes (selects) utilizando jQuery, Ajax, PHP y MySQLi para interactuar con una base de datos.","breadcrumb":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/combos-dependientes-con-jquery-ajax-php-base-datos\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.jose-aguilar.com\/blog\/combos-dependientes-con-jquery-ajax-php-base-datos\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.jose-aguilar.com\/blog\/combos-dependientes-con-jquery-ajax-php-base-datos\/#primaryimage","url":"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2013\/11\/combos-dependientes-con-jquery-ajax-php-base-datos.png","contentUrl":"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2013\/11\/combos-dependientes-con-jquery-ajax-php-base-datos.png","width":250,"height":250},{"@type":"BreadcrumbList","@id":"https:\/\/www.jose-aguilar.com\/blog\/combos-dependientes-con-jquery-ajax-php-base-datos\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/www.jose-aguilar.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Combos dependientes con jQuery, Ajax y PHP con base de datos"}]},{"@type":"WebSite","@id":"https:\/\/www.jose-aguilar.com\/blog\/#website","url":"https:\/\/www.jose-aguilar.com\/blog\/","name":"Jose Aguilar Blog","description":"Desarrollo Web con PrestaShop, WordPress, PHP, jQuery y Ajax","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.jose-aguilar.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Person","@id":"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/e6d485db1e1140866e95971d17105d11","name":"Jose Aguilar","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/abbfef5f1d75260c549d0f2c2842bb697ba1aadff3b2836b39d2590c8a625415?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/abbfef5f1d75260c549d0f2c2842bb697ba1aadff3b2836b39d2590c8a625415?s=96&d=mm&r=g","caption":"Jose Aguilar"},"description":"Director ejecutivo y tecnol\u00f3gico en JA Modules. Experto programador PrestaShop y Experto programador WordPress.","sameAs":["https:\/\/plus.google.com\/114357189801512615537"],"url":"https:\/\/www.jose-aguilar.com\/blog\/author\/josea902\/"}]}},"_links":{"self":[{"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/posts\/5983","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/comments?post=5983"}],"version-history":[{"count":0,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/posts\/5983\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/media\/7312"}],"wp:attachment":[{"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/media?parent=5983"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/categories?post=5983"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/tags?post=5983"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}