{"id":261,"date":"2018-01-23T09:30:22","date_gmt":"2018-01-23T08:30:22","guid":{"rendered":"https:\/\/numa-bord.com\/miniblog\/?p=261"},"modified":"2018-01-23T09:30:22","modified_gmt":"2018-01-23T08:30:22","slug":"jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau","status":"publish","type":"post","link":"https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/","title":{"rendered":"jQuery : Acc\u00e9der \u00e0 des champs de formulaire ayant un nom dans un tableau"},"content":{"rendered":"

Avec jQuery on peux r\u00e9cup\u00e9rer la valeur d’un champ en le s\u00e9lectionnant gr\u00e2ce \u00e0 son nom (attribut name).
\nPar exemple pour connaitre la valeur s\u00e9lectionn\u00e9 des radio boutons suivants :<\/p>\n

<label<\/span><\/a> for<\/span>=<\/span>"radio1"<\/span>><input<\/span><\/a> name<\/span>=<\/span>"choix"<\/span> value<\/span>=<\/span>"1"<\/span> type<\/span>=<\/span>"radio"<\/span> id<\/span>=<\/span>"radio1"<\/span>><\/span> Choix 1<\/<\/span>label<\/span><\/a>><\/span>
\n<label<\/span><\/a> for<\/span>=<\/span>"radio2"<\/span>><input<\/span><\/a> name<\/span>=<\/span>"choix"<\/span> value<\/span>=<\/span>"2"<\/span> type<\/span>=<\/span>"radio"<\/span> id<\/span>=<\/span>"radio2"<\/span>><\/span> Choix 2<\/<\/span>label<\/span><\/a>><\/span>
\n<label<\/span><\/a> for<\/span>=<\/span>"radio3"<\/span>><input<\/span><\/a> name<\/span>=<\/span>"choix"<\/span> value<\/span>=<\/span>"3"<\/span> type<\/span>=<\/span>"radio"<\/span> id<\/span>=<\/span>"radio3"<\/span>><\/span> Choix 3<\/<\/span>label<\/span><\/a>><\/span><\/div><\/div>\n

Il suffit de faire :<\/p>\n

$(<\/span>"input[name='choix']:checked"<\/span>)<\/span>.val<\/span>(<\/span>)<\/span>;<\/span><\/div><\/div>\n

Par contre si le nom est compos\u00e9, comme dans l’exemple ci-dessous :<\/p>\n

<label<\/span><\/a> for<\/span>=<\/span>"radio1"<\/span>><input<\/span><\/a> name<\/span>=<\/span>"mon_formulaire[choix]"<\/span> value<\/span>=<\/span>"1"<\/span> type<\/span>=<\/span>"radio"<\/span> id<\/span>=<\/span>"radio1"<\/span>><\/span> Choix 1<\/<\/span>label<\/span><\/a>><\/span>
\n<label<\/span><\/a> for<\/span>=<\/span>"radio2"<\/span>><input<\/span><\/a> name<\/span>=<\/span>"mon_formulaire[choix]"<\/span> value<\/span>=<\/span>"2"<\/span> type<\/span>=<\/span>"radio"<\/span> id<\/span>=<\/span>"radio2"<\/span>><\/span> Choix 2<\/<\/span>label<\/span><\/a>><\/span>
\n<label<\/span><\/a> for<\/span>=<\/span>"radio3"<\/span>><input<\/span><\/a> name<\/span>=<\/span>"mon_formulaire[choix]"<\/span> value<\/span>=<\/span>"3"<\/span> type<\/span>=<\/span>"radio"<\/span> id<\/span>=<\/span>"radio3"<\/span>><\/span> Choix 3<\/<\/span>label<\/span><\/a>><\/span><\/div><\/div>\n

Il faut utiliser les carract\u00e8res d’\u00e9chappement \u00ab\u00a0\\\\\u00a0\u00bb pour que \u00e7a fonctionne. Comme ci-dessous.<\/p>\n

$(<\/span>"input[name='mon_formulaire\\\\<\/span>[choix\\\\<\/span>]']:checked"<\/span>)<\/span>.val<\/span>(<\/span>)<\/span><\/div><\/div>\n","protected":false},"excerpt":{"rendered":"

Avec jQuery on peux r\u00e9cup\u00e9rer la valeur d’un champ en le s\u00e9lectionnant gr\u00e2ce \u00e0 son nom (attribut name). Par exemple pour connaitre la valeur s\u00e9lectionn\u00e9 des radio boutons suivants : <label for="radio1"><input name="choix" value="1" type="radio" id="radio1"> Choix 1<\/label> <label for="radio2"><input name="choix" value="2" type="radio" id="radio2"> Choix 2<\/label> <label for="radio3"><input name="choix" value="3" type="radio" id="radio3"> Choix 3<\/label> Il […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[2,12],"tags":[],"class_list":["post-261","post","type-post","status-publish","format-standard","hentry","category-developpement","category-jquery"],"acf":[],"yoast_head":"\njQuery : Acc\u00e9der \u00e0 des champs de formulaire ayant un nom dans un tableau - Pense b\u00eate d'un d\u00e9veloppeur web<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"jQuery : Acc\u00e9der \u00e0 des champs de formulaire ayant un nom dans un tableau - Pense b\u00eate d'un d\u00e9veloppeur web\" \/>\n<meta property=\"og:description\" content=\"Avec jQuery on peux r\u00e9cup\u00e9rer la valeur d’un champ en le s\u00e9lectionnant gr\u00e2ce \u00e0 son nom (attribut name). Par exemple pour connaitre la valeur s\u00e9lectionn\u00e9 des radio boutons suivants : <label for="radio1"><input name="choix" value="1" type="radio" id="radio1"> Choix 1<\/label> <label for="radio2"><input name="choix" value="2" type="radio" id="radio2"> Choix 2<\/label> <label for="radio3"><input name="choix" value="3" type="radio" id="radio3"> Choix 3<\/label> Il […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/\" \/>\n<meta property=\"og:site_name\" content=\"Pense b\u00eate d'un d\u00e9veloppeur web\" \/>\n<meta property=\"article:published_time\" content=\"2018-01-23T08:30:22+00:00\" \/>\n<meta name=\"author\" content=\"Numa\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"Numa\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/\"},\"author\":{\"name\":\"Numa\",\"@id\":\"https:\/\/numa-bord.com\/miniblog\/#\/schema\/person\/f9d00acd1703f17e5a6895283eb46a7e\"},\"headline\":\"jQuery : Acc\u00e9der \u00e0 des champs de formulaire ayant un nom dans un tableau\",\"datePublished\":\"2018-01-23T08:30:22+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/\"},\"wordCount\":111,\"commentCount\":0,\"articleSection\":[\"D\u00e9veloppement\",\"jQuery\"],\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/\",\"url\":\"https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/\",\"name\":\"jQuery : Acc\u00e9der \u00e0 des champs de formulaire ayant un nom dans un tableau - Pense b\u00eate d'un d\u00e9veloppeur web\",\"isPartOf\":{\"@id\":\"https:\/\/numa-bord.com\/miniblog\/#website\"},\"datePublished\":\"2018-01-23T08:30:22+00:00\",\"author\":{\"@id\":\"https:\/\/numa-bord.com\/miniblog\/#\/schema\/person\/f9d00acd1703f17e5a6895283eb46a7e\"},\"breadcrumb\":{\"@id\":\"https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Accueil\",\"item\":\"https:\/\/numa-bord.com\/miniblog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"jQuery : Acc\u00e9der \u00e0 des champs de formulaire ayant un nom dans un tableau\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/numa-bord.com\/miniblog\/#website\",\"url\":\"https:\/\/numa-bord.com\/miniblog\/\",\"name\":\"Pense b\u00eate d'un d\u00e9veloppeur web\",\"description\":\"(php, javascript, Symfony, Wordpress....)\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/numa-bord.com\/miniblog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/numa-bord.com\/miniblog\/#\/schema\/person\/f9d00acd1703f17e5a6895283eb46a7e\",\"name\":\"Numa\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/secure.gravatar.com\/avatar\/f21d1af4658a7106211915940584534c1e0b3eef3f12eb67a697686cad70b64a?s=96&d=mm&r=g\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/f21d1af4658a7106211915940584534c1e0b3eef3f12eb67a697686cad70b64a?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/f21d1af4658a7106211915940584534c1e0b3eef3f12eb67a697686cad70b64a?s=96&d=mm&r=g\",\"caption\":\"Numa\"},\"url\":\"https:\/\/numa-bord.com\/miniblog\/author\/negonner\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"jQuery : Acc\u00e9der \u00e0 des champs de formulaire ayant un nom dans un tableau - Pense b\u00eate d'un d\u00e9veloppeur web","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:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/","og_locale":"fr_FR","og_type":"article","og_title":"jQuery : Acc\u00e9der \u00e0 des champs de formulaire ayant un nom dans un tableau - Pense b\u00eate d'un d\u00e9veloppeur web","og_description":"Avec jQuery on peux r\u00e9cup\u00e9rer la valeur d’un champ en le s\u00e9lectionnant gr\u00e2ce \u00e0 son nom (attribut name). Par exemple pour connaitre la valeur s\u00e9lectionn\u00e9 des radio boutons suivants : <label for="radio1"><input name="choix" value="1" type="radio" id="radio1"> Choix 1<\/label> <label for="radio2"><input name="choix" value="2" type="radio" id="radio2"> Choix 2<\/label> <label for="radio3"><input name="choix" value="3" type="radio" id="radio3"> Choix 3<\/label> Il […]","og_url":"https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/","og_site_name":"Pense b\u00eate d'un d\u00e9veloppeur web","article_published_time":"2018-01-23T08:30:22+00:00","author":"Numa","twitter_card":"summary_large_image","twitter_misc":{"\u00c9crit par":"Numa"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/#article","isPartOf":{"@id":"https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/"},"author":{"name":"Numa","@id":"https:\/\/numa-bord.com\/miniblog\/#\/schema\/person\/f9d00acd1703f17e5a6895283eb46a7e"},"headline":"jQuery : Acc\u00e9der \u00e0 des champs de formulaire ayant un nom dans un tableau","datePublished":"2018-01-23T08:30:22+00:00","mainEntityOfPage":{"@id":"https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/"},"wordCount":111,"commentCount":0,"articleSection":["D\u00e9veloppement","jQuery"],"inLanguage":"fr-FR","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/","url":"https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/","name":"jQuery : Acc\u00e9der \u00e0 des champs de formulaire ayant un nom dans un tableau - Pense b\u00eate d'un d\u00e9veloppeur web","isPartOf":{"@id":"https:\/\/numa-bord.com\/miniblog\/#website"},"datePublished":"2018-01-23T08:30:22+00:00","author":{"@id":"https:\/\/numa-bord.com\/miniblog\/#\/schema\/person\/f9d00acd1703f17e5a6895283eb46a7e"},"breadcrumb":{"@id":"https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/numa-bord.com\/miniblog\/jquery-acceder-a-champs-de-formulaire-ayant-nom-tableau\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Accueil","item":"https:\/\/numa-bord.com\/miniblog\/"},{"@type":"ListItem","position":2,"name":"jQuery : Acc\u00e9der \u00e0 des champs de formulaire ayant un nom dans un tableau"}]},{"@type":"WebSite","@id":"https:\/\/numa-bord.com\/miniblog\/#website","url":"https:\/\/numa-bord.com\/miniblog\/","name":"Pense b\u00eate d'un d\u00e9veloppeur web","description":"(php, javascript, Symfony, Wordpress....)","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/numa-bord.com\/miniblog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Person","@id":"https:\/\/numa-bord.com\/miniblog\/#\/schema\/person\/f9d00acd1703f17e5a6895283eb46a7e","name":"Numa","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/secure.gravatar.com\/avatar\/f21d1af4658a7106211915940584534c1e0b3eef3f12eb67a697686cad70b64a?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/f21d1af4658a7106211915940584534c1e0b3eef3f12eb67a697686cad70b64a?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/f21d1af4658a7106211915940584534c1e0b3eef3f12eb67a697686cad70b64a?s=96&d=mm&r=g","caption":"Numa"},"url":"https:\/\/numa-bord.com\/miniblog\/author\/negonner\/"}]}},"_links":{"self":[{"href":"https:\/\/numa-bord.com\/miniblog\/wp-json\/wp\/v2\/posts\/261","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/numa-bord.com\/miniblog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/numa-bord.com\/miniblog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/numa-bord.com\/miniblog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/numa-bord.com\/miniblog\/wp-json\/wp\/v2\/comments?post=261"}],"version-history":[{"count":4,"href":"https:\/\/numa-bord.com\/miniblog\/wp-json\/wp\/v2\/posts\/261\/revisions"}],"predecessor-version":[{"id":271,"href":"https:\/\/numa-bord.com\/miniblog\/wp-json\/wp\/v2\/posts\/261\/revisions\/271"}],"wp:attachment":[{"href":"https:\/\/numa-bord.com\/miniblog\/wp-json\/wp\/v2\/media?parent=261"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/numa-bord.com\/miniblog\/wp-json\/wp\/v2\/categories?post=261"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/numa-bord.com\/miniblog\/wp-json\/wp\/v2\/tags?post=261"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}