{"id":1621,"date":"2017-11-17T01:58:20","date_gmt":"2017-11-17T00:58:20","guid":{"rendered":"https:\/\/www.kumbiaphp.com\/blog\/?p=1621"},"modified":"2017-12-22T11:36:14","modified_gmt":"2017-12-22T10:36:14","slug":"select-anidado-o-select-dependientes","status":"publish","type":"post","link":"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/","title":{"rendered":"Select anidado o select dependientes"},"content":{"rendered":"<p>Con este tutorial vamos a aprender como implementar select anidado o select dependientes usando <strong>KumbiaPHP<\/strong> y jquery. Es una <a href=\"http:\/\/es.wikipedia.org\/wiki\/Lista_(inform%C3%A1tica)#Listas_simples_enlazadas\">lista simple enlazada<\/a> con tres niveles: Regiones, comunas y ciudades.<\/p>\n<h2>Implementando el select anidado<\/h2>\n<p>Primero que todo cargamos la librer\u00eda jquery a\u00f1adiendo en nuestro template activo la siguiente l\u00ednea:<\/p>\n<pre><code class=\"language-php\" data-line=\"\">\n&lt;?= Tag::js(&#039;jquery\/jquery.min&#039;); ?&gt;\n<\/code><\/pre>\n<h2>La base de datos<\/h2>\n<pre><code class=\"language-sql\" data-line=\"\">\nCREATE TABLE `ciudad` (\n  `id` int(4) NOT NULL AUTO_INCREMENT,\n  `comuna_id` int(4) NOT NULL,\n  `nombre` varchar(100) NOT NULL,\n  PRIMARY KEY (`id`),\n  KEY `FK_ciudad__comuna` (`comuna_id`),\n  CONSTRAINT `FK_ciudad__comuna` FOREIGN KEY (`comuna_id`) REFERENCES `comuna` (`id`)\n) ENGINE=InnoDB AUTO_INCREMENT=1 DEFAULT CHARSET=utf8;\n\nINSERT INTO `ciudad` VALUES (1,1,&#039;Primera Ciudad&#039;),(2,2,&#039;Primera Ciudad&#039;),(3,2,&#039;Segunda Ciudad&#039;),(4,3,&#039;Primera Ciudad&#039;),(5,3,&#039;Segunda Ciudad&#039;),(6,3,&#039;Tercera Ciudad&#039;);\n\nCREATE TABLE `comuna` (\n  `id` int(4) NOT NULL AUTO_INCREMENT,\n  `region_id` int(4) NOT NULL,\n  `nombre` varchar(100) NOT NULL,\n  PRIMARY KEY (`id`),\n  KEY `FK_comuna__region` (`region_id`),\n  CONSTRAINT `FK_comuna__region` FOREIGN KEY (`region_id`) REFERENCES `region` (`id`)\n) ENGINE=InnoDB AUTO_INCREMENT=1 DEFAULT CHARSET=utf8;\n\nINSERT INTO `comuna` VALUES (1,1,&#039;Primera Comuna&#039;),(2,1,&#039;Segunda Comuna&#039;),(3,2,&#039;Primera Comuna&#039;),(4,3,&#039;Primera Comuna&#039;);\n\nCREATE TABLE `region` (\n  `id` int(4) NOT NULL AUTO_INCREMENT,\n  `nombre` varchar(100) NOT NULL,\n  PRIMARY KEY (`id`)\n) ENGINE=InnoDB AUTO_INCREMENT=1 DEFAULT CHARSET=utf8;\n\nINSERT INTO `region` VALUES (1,&#039;Primera Region&#039;),(2,&#039;Segunda Region&#039;),(3,&#039;Tercera Region&#039;);\n<\/code><\/pre>\n<p><!--more--><\/p>\n<h2>Los modelos<\/h2>\n<p>Vamos a tener tres modelos que se encargaran de la consulta de los datos, heredando como no de la clase ActiveRecord:<\/p>\n<p>Archivo: <em>app\/models\/region.php<\/em><\/p>\n<pre><code class=\"language-php\" data-line=\"\">\n&lt;?php\nclass Region extends ActiveRecord\n{\n    \/**\n     * Lista todas las regiones\n     * @return array\n     *\/\n    public function all()\n    {\n        return $this-&gt;find(&#039;order: nombre&#039;);\n    }\n}\n<\/code><\/pre>\n<p>Archivo: <em>app\/models\/comuna.php<\/em><\/p>\n<pre><code class=\"language-php\" data-line=\"\">\n&lt;?php\nclass Comuna extends ActiveRecord\n{\n\n    \/**\n     * Lista todas las comunas de una regi\u00f3n\n     * \n     * @param int $region_id\n     * @return array\n     *\/\n    public function allByRegion(int $region_id)\/\/validaci\u00f3n int de PHP7\n    {\n        return $this-&gt;find(&quot;region_id = $region_id&quot;, &#039;order: nombre&#039;);\n    }\n}\n<\/code><\/pre>\n<p>Archivo: <em>app\/models\/ciudad.php<\/em><\/p>\n<pre><code class=\"language-php\" data-line=\"\">\n&lt;?php\nclass Ciudad extends ActiveRecord\n{\n\n    \/**\n     * Lista todas las ciudades de una comuna\n     * \n     * @param int $region_id\n     * @return array\n     *\/\n    public function allByComuna(int $comuna_id)\/\/validaci\u00f3n int de PHP7\n    {\n        return $this-&gt;find(&quot;comuna_id = $comuna_id&quot;, &#039;order: nombre&#039;);\n    }\n}\n<\/code><\/pre>\n<h2>El controlador<\/h2>\n<p>Usaremos de ejemplo el controlador <em>UserController<\/em> aunque no implementaremos la funcionalidad de creaci\u00f3n de un usuario para enforcarnos en el select anidado. Tendr\u00e1 dos funciones auxiliares que nos cargar\u00e1n los respectivos selects sin template, <em>getComunas()<\/em> y <em>getCiudades()<\/em>.<\/p>\n<p>Archivo: <em>app\/controllers\/user_controller.php<\/em><\/p>\n<pre><code class=\"language-php\" data-line=\"\">\n&lt;?php\n\/**\n * Controlador para las acciones y vistas con el usuario\n *\/\nclass UserController extends AppController\n{\n\n    public function index()\n    {\n        \n    }\n\n    public function create()\n    {\n        \/\/se verifica si se ha enviado via POST los datos\n        if (Input::hasPost(&#039;user&#039;)) {\n            \/\/\n        }\n    }\n\n    public function getComunas()\n    {\n        \/\/No es necesario el template\n        View::template(null);\n        \/\/Carga la variable $region_id en la vista\n        $this-&gt;region_id = Input::post(&#039;region_id&#039;);\n    }\n\n    public function getCiudades()\n    {\n        \/\/No es necesario el template\n        View::template(null);\n        \/\/Carga la variable $comuna_id en la vista\n        $this-&gt;comuna_id = Input::post(&#039;comuna_id&#039;);\n    }\n}\n<\/code><\/pre>\n<h2>Las vistas<\/h2>\n<p>La primera vista es la de crear un usuario, la cual contendr\u00e1 los tres selects, aunque en principio solo mostrar\u00e1 el primero y unas capas vacias, ya que los siguientes dependen de qu\u00e9 se seleccione y ser\u00e1n cargados mediante ajax:<\/p>\n<p>Archivo: <em>app\/views\/user\/create.phtml<\/em><\/p>\n<pre><code class=\"language-php\" data-line=\"\">&lt;h1&gt;Crear usuario&lt;\/h1&gt;\n&lt;?= Html::linkAction(&#039;&#039;, &#039;Listar usuarios&#039;, &#039;class=&quot;button&quot;&#039;) ?&gt;\n&lt;?php View::content() ?&gt;\n&lt;?= Form::open() ?&gt;\n  &lt;div class=&quot;row&quot;&gt;\n    &lt;div class=&quot;six columns&quot;&gt;\n      &lt;label for=&quot;user_region_id&quot;&gt;Regi\u00f3n&lt;\/label&gt;\n      &lt;?= Form::dbSelect(&#039;user.region_id&#039;, &#039;nombre&#039;, array(&#039;region&#039;, &#039;all&#039;), &#039;- Seleccione -&#039;); ?&gt;\n    &lt;\/div&gt;\n  &lt;\/div&gt;\n  &lt;div class=&quot;row&quot;&gt;\n    &lt;div class=&quot;six columns&quot;&gt;\n      &lt;label for=&quot;user_comuna_id&quot;&gt;Comuna&lt;\/label&gt;\n      &lt;div id=&#039;div_comunas&#039;&gt;&lt;\/div&gt;\n    &lt;\/div&gt;\n  &lt;\/div&gt;\n  &lt;div class=&quot;row&quot;&gt;\n    &lt;div class=&quot;six columns&quot;&gt;\n      &lt;label for=&quot;user_ciudad_id&quot;&gt;Ciudad&lt;\/label&gt;\n      &lt;div id=&#039;div_ciudades&#039;&gt;&lt;\/div&gt;\n    &lt;\/div&gt;\n  &lt;\/div&gt;\n&lt;input class=&quot;button-primary&quot; value=&quot;Enviar&quot; type=&quot;submit&quot;&gt;\n&lt;?= Form::close() ?&gt;\n\n&lt;script type=&#039;text\/javascript&#039;&gt;\n  $(document).on(&#039;change&#039;, &quot;#user_region_id&quot;, function () {\n    var region_id = $(&#039;#user_region_id&#039;).val();\n     $.ajax({\n       type: &quot;POST&quot;,\n       url: &quot;&lt;?php echo PUBLIC_PATH . &#039;user\/getComunas\/&#039;; ?&gt;&quot;,\n       data: &quot;region_id=&quot; + region_id,\n       success: function (html) {\n         $(&quot;#div_comunas&quot;).html(html);\n       }\n    });\n  });\n&lt;\/script&gt;<\/code><\/pre>\n<p>La vista anterior con javascript a\u00f1ade un listener para que cuando el valor del select que contiene las regiones cambie, haga un llamado mediante ajax para obtener el listado de comunas por regi\u00f3n y este resultado lo carga en la capa <em>div_comunas<\/em>.<\/p>\n<p>La siguiente vista cargar\u00e1 el select usando el helper <em>Form::dbSelect()<\/em> usando el m\u00e9todo <em>allByRegion()<\/em> del modelo <em>Comuna<\/em> y pas\u00e1ndole como par\u00e1metro <em>$region_id<\/em>.<br \/>\n Archivo: <em>app\/views\/user\/getComunas.phtml<\/em><\/p>\n<pre><code class=\"language-php\" data-line=\"\">\n&lt;?= Form::dbSelect(&quot;user.comuna_id&quot;, &#039;nombre&#039;, array(&#039;comuna&#039;, &#039;allByRegion&#039;, $region_id), &#039;- Seleccione -&#039;); ?&gt;\n\n&lt;script type=&#039;text\/javascript&#039;&gt;\n  $(document).on(&#039;change&#039;, &quot;#user_comuna_id&quot;, function () {\n    var comuna_id = $(&#039;#user_comuna_id&#039;).val();\n      $.ajax({\n        type: &quot;POST&quot;,\n        url: &quot;&lt;?php echo PUBLIC_PATH . &#039;user\/getCiudades\/&#039;; ?&gt;&quot;,\n        data: &quot;comuna_id=&quot; + comuna_id,\n          success: function (html) {\n            $(&quot;#div_ciudades&quot;).html(html);\n          }\n       });\n });\n&lt;\/script&gt;<\/code><\/pre>\n<p>La vista anterior con javascript a\u00f1ade un listener para que cuando el valor del select que contiene las comunas cambie, haga un llamado mediante ajax para obtener el listado de ciudades por comuna y este resultado lo carga en la capa <em>div_ciudades<\/em>.<\/p>\n<p>La siguiente vista es similar a <em>getComunas.phtml,<\/em> lo que hace es cargar todas las ciudades que pertenezcan a una comunidad usando el helper <em>Form::dbSelect()<\/em> pasandole como par\u00e1metros el nombre del modelo <em>ciudad, <\/em>el m\u00e9todo <em>allByComuna()<\/em> y el par\u00e1metro de consulta <em>$comuna_id.<\/em><\/p>\n<p>Archivo: <em>app\/views\/user\/getCiudades.phtml<\/em><\/p>\n<pre><code class=\"language-php\" data-line=\"\">&lt;?= Form::dbSelect(&quot;user.ciudad_id&quot;, &#039;nombre&#039;, array(&#039;ciudad&#039;, &#039;allByComuna&#039;, $comuna_id), &#039;- Seleccione -&#039;); ?&gt; <\/code><\/pre>\n<h2>Ejecutando el ejemplo<\/h2>\n<p>Cuando cargamos la url <em>\/user\/create <\/em>veremos algo como lo siguiente, en primera instacia solo va mostrar las regiones:<\/p>\n<figure><a href=\"https:\/\/www.kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-10.png\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-1632 size-full\" src=\"https:\/\/www.kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-10-e1510503449909.png\" alt=\"Muestra el primer select anidado\" width=\"996\" height=\"503\" srcset=\"https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-10-e1510503449909.png 996w, https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-10-e1510503449909-300x152.png 300w, https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-10-e1510503449909-768x388.png 768w, https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-10-e1510503449909-940x475.png 940w\" sizes=\"auto, (max-width: 996px) 100vw, 996px\" \/><\/a><figcaption>Muestra el primer select anidado<\/figcaption><\/figure>\n<p>Lo siguientes dos select se mostraran comforme se vaya seleccionando una regi\u00f3n y posteriormente una comuna.<\/p>\n<figure><a href=\"https:\/\/www.kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-27.png\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-1630 size-full\" src=\"https:\/\/www.kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-27-e1510503503511.png\" alt=\"Select anidado\" width=\"996\" height=\"568\" srcset=\"https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-27-e1510503503511.png 996w, https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-27-e1510503503511-300x171.png 300w, https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-27-e1510503503511-768x438.png 768w, https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-27-e1510503503511-940x536.png 940w\" sizes=\"auto, (max-width: 996px) 100vw, 996px\" \/><\/a><figcaption>Lista enlazada simple de tres niveles<\/figcaption><\/figure>\n<h2>Descargar c\u00f3digo completo<\/h2>\n<p>Como siempre, el c\u00f3digo completo est\u00e1 disponible para todos en el siguiente repositorio en Github listo para usar con Docker: <a href=\"https:\/\/github.com\/henrystivens\/dependent-select\">https:\/\/github.com\/henrystivens\/dependent-select<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Con este tutorial vamos a aprender como implementar select anidado o select dependientes usando KumbiaPHP y jquery. Es una&hellip;<\/p>\n","protected":false},"author":11,"featured_media":1630,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_crdt_document":"","inline_featured_image":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[1,9],"tags":[122,36,123],"class_list":["post-1621","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-php","category-tutoriales-y-screencast","tag-ajax","tag-ejemplos","tag-select"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.2 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Select anidados o select dependientes con php y jquery<\/title>\n<meta name=\"description\" content=\"Tutorial para aprender como implementar select anidado o select dependientes usando KumbiaPHP y jquery. Tres niveles: Regiones, comunas y ciudades\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Select anidados o select dependientes con php y jquery\" \/>\n<meta property=\"og:description\" content=\"Tutorial para aprender como implementar select anidado o select dependientes usando KumbiaPHP y jquery. Tres niveles: Regiones, comunas y ciudades\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/\" \/>\n<meta property=\"og:site_name\" content=\"KumbiaPHP Framework PHP en espa\u00f1ol\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/kumbia.fw\" \/>\n<meta property=\"article:published_time\" content=\"2017-11-17T00:58:20+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2017-12-22T10:36:14+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-27-e1510503503511.png\" \/>\n\t<meta property=\"og:image:width\" content=\"996\" \/>\n\t<meta property=\"og:image:height\" content=\"568\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"HenryStivens\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@henrystivens\" \/>\n<meta name=\"twitter:site\" content=\"@kumbiaphp\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"HenryStivens\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/\"},\"author\":{\"name\":\"HenryStivens\",\"@id\":\"https:\/\/kumbiaphp.com\/blog\/#\/schema\/person\/b6f7cc13b1eaec9ae9e243b4385fc321\"},\"headline\":\"Select anidado o select dependientes\",\"datePublished\":\"2017-11-17T00:58:20+00:00\",\"dateModified\":\"2017-12-22T10:36:14+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/\"},\"wordCount\":449,\"commentCount\":3,\"publisher\":{\"@id\":\"https:\/\/kumbiaphp.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-27-e1510503503511.png\",\"keywords\":[\"ajax\",\"ejemplos\",\"select\"],\"articleSection\":[\"PHP\",\"Tutoriales y screencast\"],\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/\",\"url\":\"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/\",\"name\":\"Select anidados o select dependientes con php y jquery\",\"isPartOf\":{\"@id\":\"https:\/\/kumbiaphp.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-27-e1510503503511.png\",\"datePublished\":\"2017-11-17T00:58:20+00:00\",\"dateModified\":\"2017-12-22T10:36:14+00:00\",\"description\":\"Tutorial para aprender como implementar select anidado o select dependientes usando KumbiaPHP y jquery. Tres niveles: Regiones, comunas y ciudades\",\"breadcrumb\":{\"@id\":\"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/#primaryimage\",\"url\":\"https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-27-e1510503503511.png\",\"contentUrl\":\"https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-27-e1510503503511.png\",\"width\":996,\"height\":568,\"caption\":\"Select anidados\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\/\/kumbiaphp.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Select anidado o select dependientes\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/kumbiaphp.com\/blog\/#website\",\"url\":\"https:\/\/kumbiaphp.com\/blog\/\",\"name\":\"KumbiaPHP Framework PHP en espa\u00f1ol\",\"description\":\"Web &amp; app MVC PHP framework\",\"publisher\":{\"@id\":\"https:\/\/kumbiaphp.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/kumbiaphp.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/kumbiaphp.com\/blog\/#organization\",\"name\":\"KumbiaPHP Framework PHP en espa\u00f1ol\",\"url\":\"https:\/\/kumbiaphp.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/kumbiaphp.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2015\/02\/logo.png\",\"contentUrl\":\"https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2015\/02\/logo.png\",\"width\":432,\"height\":50,\"caption\":\"KumbiaPHP Framework PHP en espa\u00f1ol\"},\"image\":{\"@id\":\"https:\/\/kumbiaphp.com\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/kumbia.fw\",\"https:\/\/x.com\/kumbiaphp\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/kumbiaphp.com\/blog\/#\/schema\/person\/b6f7cc13b1eaec9ae9e243b4385fc321\",\"name\":\"HenryStivens\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/secure.gravatar.com\/avatar\/b72eb6560d7b6068354db3428a9585f4c18759e8a799af6f27a508078457e256?s=96&d=mm&r=g\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/b72eb6560d7b6068354db3428a9585f4c18759e8a799af6f27a508078457e256?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/b72eb6560d7b6068354db3428a9585f4c18759e8a799af6f27a508078457e256?s=96&d=mm&r=g\",\"caption\":\"HenryStivens\"},\"description\":\"Dedicated to building robust, user-centered software solutions with clean, maintainable code. Passionate about innovative technology, gaming, and gourmet coffee.\",\"sameAs\":[\"https:\/\/x.com\/henrystivens\"],\"url\":\"https:\/\/kumbiaphp.com\/blog\/author\/henrystivens\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Select anidados o select dependientes con php y jquery","description":"Tutorial para aprender como implementar select anidado o select dependientes usando KumbiaPHP y jquery. Tres niveles: Regiones, comunas y ciudades","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/","og_locale":"es_ES","og_type":"article","og_title":"Select anidados o select dependientes con php y jquery","og_description":"Tutorial para aprender como implementar select anidado o select dependientes usando KumbiaPHP y jquery. Tres niveles: Regiones, comunas y ciudades","og_url":"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/","og_site_name":"KumbiaPHP Framework PHP en espa\u00f1ol","article_publisher":"https:\/\/www.facebook.com\/kumbia.fw","article_published_time":"2017-11-17T00:58:20+00:00","article_modified_time":"2017-12-22T10:36:14+00:00","og_image":[{"width":996,"height":568,"url":"https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-27-e1510503503511.png","type":"image\/png"}],"author":"HenryStivens","twitter_card":"summary_large_image","twitter_creator":"@henrystivens","twitter_site":"@kumbiaphp","twitter_misc":{"Escrito por":"HenryStivens","Tiempo de lectura":"5 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/#article","isPartOf":{"@id":"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/"},"author":{"name":"HenryStivens","@id":"https:\/\/kumbiaphp.com\/blog\/#\/schema\/person\/b6f7cc13b1eaec9ae9e243b4385fc321"},"headline":"Select anidado o select dependientes","datePublished":"2017-11-17T00:58:20+00:00","dateModified":"2017-12-22T10:36:14+00:00","mainEntityOfPage":{"@id":"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/"},"wordCount":449,"commentCount":3,"publisher":{"@id":"https:\/\/kumbiaphp.com\/blog\/#organization"},"image":{"@id":"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/#primaryimage"},"thumbnailUrl":"https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-27-e1510503503511.png","keywords":["ajax","ejemplos","select"],"articleSection":["PHP","Tutoriales y screencast"],"inLanguage":"es","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/","url":"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/","name":"Select anidados o select dependientes con php y jquery","isPartOf":{"@id":"https:\/\/kumbiaphp.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/#primaryimage"},"image":{"@id":"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/#primaryimage"},"thumbnailUrl":"https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-27-e1510503503511.png","datePublished":"2017-11-17T00:58:20+00:00","dateModified":"2017-12-22T10:36:14+00:00","description":"Tutorial para aprender como implementar select anidado o select dependientes usando KumbiaPHP y jquery. Tres niveles: Regiones, comunas y ciudades","breadcrumb":{"@id":"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/#primaryimage","url":"https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-27-e1510503503511.png","contentUrl":"https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-27-e1510503503511.png","width":996,"height":568,"caption":"Select anidados"},{"@type":"BreadcrumbList","@id":"https:\/\/kumbiaphp.com\/blog\/2017\/11\/17\/select-anidado-o-select-dependientes\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/kumbiaphp.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Select anidado o select dependientes"}]},{"@type":"WebSite","@id":"https:\/\/kumbiaphp.com\/blog\/#website","url":"https:\/\/kumbiaphp.com\/blog\/","name":"KumbiaPHP Framework PHP en espa\u00f1ol","description":"Web &amp; app MVC PHP framework","publisher":{"@id":"https:\/\/kumbiaphp.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/kumbiaphp.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Organization","@id":"https:\/\/kumbiaphp.com\/blog\/#organization","name":"KumbiaPHP Framework PHP en espa\u00f1ol","url":"https:\/\/kumbiaphp.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/kumbiaphp.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2015\/02\/logo.png","contentUrl":"https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2015\/02\/logo.png","width":432,"height":50,"caption":"KumbiaPHP Framework PHP en espa\u00f1ol"},"image":{"@id":"https:\/\/kumbiaphp.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/kumbia.fw","https:\/\/x.com\/kumbiaphp"]},{"@type":"Person","@id":"https:\/\/kumbiaphp.com\/blog\/#\/schema\/person\/b6f7cc13b1eaec9ae9e243b4385fc321","name":"HenryStivens","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/secure.gravatar.com\/avatar\/b72eb6560d7b6068354db3428a9585f4c18759e8a799af6f27a508078457e256?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/b72eb6560d7b6068354db3428a9585f4c18759e8a799af6f27a508078457e256?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/b72eb6560d7b6068354db3428a9585f4c18759e8a799af6f27a508078457e256?s=96&d=mm&r=g","caption":"HenryStivens"},"description":"Dedicated to building robust, user-centered software solutions with clean, maintainable code. Passionate about innovative technology, gaming, and gourmet coffee.","sameAs":["https:\/\/x.com\/henrystivens"],"url":"https:\/\/kumbiaphp.com\/blog\/author\/henrystivens\/"}]}},"jetpack_featured_media_url":"https:\/\/kumbiaphp.com\/blog\/wp-content\/uploads\/2017\/11\/Screenshot-from-2017-11-06-16-08-27-e1510503503511.png","jetpack_sharing_enabled":true,"jetpack-related-posts":[],"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/kumbiaphp.com\/blog\/wp-json\/wp\/v2\/posts\/1621","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kumbiaphp.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kumbiaphp.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kumbiaphp.com\/blog\/wp-json\/wp\/v2\/users\/11"}],"replies":[{"embeddable":true,"href":"https:\/\/kumbiaphp.com\/blog\/wp-json\/wp\/v2\/comments?post=1621"}],"version-history":[{"count":11,"href":"https:\/\/kumbiaphp.com\/blog\/wp-json\/wp\/v2\/posts\/1621\/revisions"}],"predecessor-version":[{"id":1693,"href":"https:\/\/kumbiaphp.com\/blog\/wp-json\/wp\/v2\/posts\/1621\/revisions\/1693"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kumbiaphp.com\/blog\/wp-json\/wp\/v2\/media\/1630"}],"wp:attachment":[{"href":"https:\/\/kumbiaphp.com\/blog\/wp-json\/wp\/v2\/media?parent=1621"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kumbiaphp.com\/blog\/wp-json\/wp\/v2\/categories?post=1621"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kumbiaphp.com\/blog\/wp-json\/wp\/v2\/tags?post=1621"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}