{"id":254,"date":"2011-06-21T21:18:54","date_gmt":"2011-06-21T21:18:54","guid":{"rendered":"https:\/\/www.jose-aguilar.com\/blog\/?p=254"},"modified":"2012-08-30T09:58:59","modified_gmt":"2012-08-30T09:58:59","slug":"seleccionar-grupo-chekboxs-jquery","status":"publish","type":"post","link":"https:\/\/www.jose-aguilar.com\/blog\/seleccionar-grupo-chekboxs-jquery\/","title":{"rendered":"Seleccionar un grupo de chekbox’s con jQuery"},"content":{"rendered":"

\"\"<\/a>A continuaci\u00f3n se expone un script para seleccionar\/deseleccionar un grupo de checkboxes con jQuery. En mi opini\u00f3n, quiz\u00e1 la forma m\u00e1s adecuada de acceder a los checkboxes mediante jQuery es asign\u00e1ndoles una clase. De esta forma podemos actuar sobre los checkboxes de una manera selectiva. Podremos tener m\u00e1s elementos de este tipo en nuestra p\u00e1gina web pero s\u00f3lo actuaremos sobre los que poseen determinada clase.<\/p>\n

Lo primero que debemos hacer es incluir la librer\u00eda jQuery dentro de la etiqueta <head>.<\/p>\n

Seguidamente tambi\u00e9n en el <head> debemos incluir la funci\u00f3n que se encargar\u00e1 de seleccionar o deseleccionar el grupo de checkboxes.<\/p>\n

<script language=\"javascript\">\r\n\t $(document).ready(function(){\r\n\t   $(\".check_todos\").click(function(event){\r\n\t     if($(this).is(\":checked\")) {\r\n\t\t \t$(\".ck:checkbox:not(:checked)\").attr(\"checked\", \"checked\");\r\n\t\t }else{\r\n\t\t\t $(\".ck:checkbox:checked\").removeAttr(\"checked\");\r\n\t\t }\r\n\t   });\r\n\t });\r\n\t<\/script><\/pre>\n
Finalmente, dentro del <body> necesitaremos insertar los checkboxes de la siguiente forma:<\/p>\n
<form>\r\n<p><input name=\"Todos\" type=\"checkbox\" value=\"1\" class=\"check_todos\"\/>Seleccionar todos<\/p>\r\n<p>\r\n  <input name=\"elemento1\" type=\"checkbox\" value=\"1\" class=\"ck\"\/>elemento 1<br \/>\r\n  <input name=\"elemento2\" type=\"checkbox\" value=\"2\" class=\"ck\"\/>elemento 2<br \/>\r\n  <input name=\"elemento3\" type=\"checkbox\" value=\"3\" class=\"ck\"\/>elemento 3<br \/>\r\n  <input name=\"elemento4\" type=\"checkbox\" value=\"4\" class=\"ck\"\/>elemento 4<br \/>\r\n  <input name=\"elemento5\" type=\"checkbox\" value=\"5\" class=\"ck\"\/>elemento 5<\/p>\r\n<\/form><\/pre>\n
Ver un ejemplo en funcionamiento<\/a><\/p>\n
Ver ejemplo en funcionamiento 2<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"
A continuaci\u00f3n se expone un script para seleccionar\/deseleccionar un grupo de checkboxes con jQuery. En mi opini\u00f3n, quiz\u00e1 la forma m\u00e1s adecuada de acceder a los checkboxes mediante jQuery es asign\u00e1ndoles una clase. De esta forma podemos actuar sobre los checkboxes de una manera selectiva. Podremos tener m\u00e1s elementos de este tipo en nuestra p\u00e1gina […]<\/p>\n","protected":false},"author":1,"featured_media":4427,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[12,5],"tags":[98,84],"class_list":["post-254","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-html","category-jquery","tag-checkboxes","tag-formularios"],"yoast_head":"\nSeleccionar un grupo de chekbox's con jQuery - Jose Aguilar Blog<\/title>\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=\"Seleccionar un grupo de chekbox's con jQuery - Jose Aguilar Blog\" \/>\n<meta property=\"og:description\" content=\"A continuaci\u00f3n se expone un script para seleccionar\/deseleccionar un grupo de checkboxes con jQuery. En mi opini\u00f3n, quiz\u00e1 la forma m\u00e1s adecuada de acceder a los checkboxes mediante jQuery es asign\u00e1ndoles una clase. De esta forma podemos actuar sobre los checkboxes de una manera selectiva. Podremos tener m\u00e1s elementos de este tipo en nuestra p\u00e1gina […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.jose-aguilar.com\/blog\/seleccionar-grupo-chekboxs-jquery\/\" \/>\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=\"2011-06-21T21:18:54+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2012-08-30T09:58:59+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2011\/06\/jquery1.png\" \/>\n\t<meta property=\"og:image:width\" content=\"256\" \/>\n\t<meta property=\"og:image:height\" content=\"256\" \/>\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=\"1 minuto\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/seleccionar-grupo-chekboxs-jquery\/\",\"url\":\"https:\/\/www.jose-aguilar.com\/blog\/seleccionar-grupo-chekboxs-jquery\/\",\"name\":\"Seleccionar un grupo de chekbox's con jQuery - Jose Aguilar Blog\",\"isPartOf\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/seleccionar-grupo-chekboxs-jquery\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/seleccionar-grupo-chekboxs-jquery\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2011\/06\/jquery1.png\",\"datePublished\":\"2011-06-21T21:18:54+00:00\",\"dateModified\":\"2012-08-30T09:58:59+00:00\",\"author\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/e6d485db1e1140866e95971d17105d11\"},\"breadcrumb\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/seleccionar-grupo-chekboxs-jquery\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.jose-aguilar.com\/blog\/seleccionar-grupo-chekboxs-jquery\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/seleccionar-grupo-chekboxs-jquery\/#primaryimage\",\"url\":\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2011\/06\/jquery1.png\",\"contentUrl\":\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2011\/06\/jquery1.png\",\"width\":256,\"height\":256},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/seleccionar-grupo-chekboxs-jquery\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\/\/www.jose-aguilar.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Seleccionar un grupo de chekbox’s con jQuery\"}]},{\"@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":"Seleccionar un grupo de chekbox's con jQuery - Jose Aguilar Blog","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":"Seleccionar un grupo de chekbox's con jQuery - Jose Aguilar Blog","og_description":"A continuaci\u00f3n se expone un script para seleccionar\/deseleccionar un grupo de checkboxes con jQuery. En mi opini\u00f3n, quiz\u00e1 la forma m\u00e1s adecuada de acceder a los checkboxes mediante jQuery es asign\u00e1ndoles una clase. De esta forma podemos actuar sobre los checkboxes de una manera selectiva. Podremos tener m\u00e1s elementos de este tipo en nuestra p\u00e1gina […]","og_url":"https:\/\/www.jose-aguilar.com\/blog\/seleccionar-grupo-chekboxs-jquery\/","og_site_name":"Jose Aguilar Blog","article_publisher":"https:\/\/www.facebook.com\/joseaguilarblog","article_published_time":"2011-06-21T21:18:54+00:00","article_modified_time":"2012-08-30T09:58:59+00:00","og_image":[{"width":256,"height":256,"url":"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2011\/06\/jquery1.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":"1 minuto"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.jose-aguilar.com\/blog\/seleccionar-grupo-chekboxs-jquery\/","url":"https:\/\/www.jose-aguilar.com\/blog\/seleccionar-grupo-chekboxs-jquery\/","name":"Seleccionar un grupo de chekbox's con jQuery - Jose Aguilar Blog","isPartOf":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/seleccionar-grupo-chekboxs-jquery\/#primaryimage"},"image":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/seleccionar-grupo-chekboxs-jquery\/#primaryimage"},"thumbnailUrl":"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2011\/06\/jquery1.png","datePublished":"2011-06-21T21:18:54+00:00","dateModified":"2012-08-30T09:58:59+00:00","author":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/e6d485db1e1140866e95971d17105d11"},"breadcrumb":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/seleccionar-grupo-chekboxs-jquery\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.jose-aguilar.com\/blog\/seleccionar-grupo-chekboxs-jquery\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.jose-aguilar.com\/blog\/seleccionar-grupo-chekboxs-jquery\/#primaryimage","url":"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2011\/06\/jquery1.png","contentUrl":"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2011\/06\/jquery1.png","width":256,"height":256},{"@type":"BreadcrumbList","@id":"https:\/\/www.jose-aguilar.com\/blog\/seleccionar-grupo-chekboxs-jquery\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/www.jose-aguilar.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Seleccionar un grupo de chekbox’s con jQuery"}]},{"@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\/254","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=254"}],"version-history":[{"count":0,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/posts\/254\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/media\/4427"}],"wp:attachment":[{"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/media?parent=254"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/categories?post=254"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/tags?post=254"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}