{"id":16321,"date":"2022-10-15T05:06:49","date_gmt":"2022-10-14T23:36:49","guid":{"rendered":"https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/"},"modified":"2022-10-15T05:06:49","modified_gmt":"2022-10-14T23:36:49","slug":"solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list","status":"publish","type":"post","link":"https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/","title":{"rendered":"[Solved] Search box placehoder text should change when an option is selected from a drop down list"},"content":{"rendered":"<p> [ad_1]<br \/>\n<\/p>\n<div id=\"answer-38716829\" class=\"answer js-answer accepted-answer js-accepted-answer\" data-answerid=\"38716829\" data-parentid=\"38712913\" data-score=\"1\" data-position-on-page=\"1\" data-highest-scored=\"1\" data-question-has-accepted-highest-score=\"1\" itemprop=\"acceptedAnswer\" itemscope itemtype=\"https:\/\/schema.org\/Answer\">\n<div class=\"post-layout\">\n<div class=\"votecell post-layout--left\"><\/div>\n<div class=\"answercell post-layout--right\">\n<div class=\"s-prose js-post-body\" itemprop=\"text\">\n<p>You need to attach a <code>change<\/code> event to the select box. In it you <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/learn.jquery.com\/using-jquery-core\/faq\/how-do-i-get-the-text-value-of-a-selected-option\/\">grab the text from the selected option<\/a> and set the <code>placeholder<\/code> attribute on the search box.<\/p>\n<pre><code>var select_designatfirst = $('#select_designatfirst'),\n  empSearch = $('#empSearch');\n\nselect_designatfirst.on('change', function () {\n  empSearch.attr('placeholder', 'Search ' + select_designatfirst.find(':selected').text());\n});\n<\/code><\/pre>\n<p><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/jsfiddle.net\/UselessCode\/hb5xqwf3\/\">jsFiddle example<\/a><\/p>\n<p>That said, unless the search box is far removed from the drop down it probably isn&#8217;t necessary to do this. As long as the drop down is appropriately labeled so its function is clear, it should be obvious that it is limiting your search results to only a certain employee type.<\/p>\n<\/p><\/div>\n<div class=\"mt24\"><\/div>\n<\/div>\n<p>            <span class=\"d-none\" itemprop=\"commentCount\"><\/span> <\/p><\/div>\n<\/div>\n<p>[ad_2]<\/p>\n<p>solved Search box placehoder text should change when an option is selected from a drop down list <\/p>\n","protected":false},"excerpt":{"rendered":"<p>[ad_1] You need to attach a change event to the select box. In it you grab the text from the selected option and set the placeholder attribute on the search box. var select_designatfirst = $(&#8216;#select_designatfirst&#8217;), empSearch = $(&#8216;#empSearch&#8217;); select_designatfirst.on(&#8216;change&#8217;, function () { empSearch.attr(&#8216;placeholder&#8217;, &#8216;Search &#8216; + select_designatfirst.find(&#8216;:selected&#8217;).text()); }); jsFiddle example That said, unless the search &#8230; <a title=\"[Solved] Search box placehoder text should change when an option is selected from a drop down list\" class=\"read-more\" href=\"https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/\" aria-label=\"More on [Solved] Search box placehoder text should change when an option is selected from a drop down list\">Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[320],"tags":[333,388],"class_list":["post-16321","post","type-post","status-publish","format-standard","hentry","category-solved","tag-javascript","tag-jquery"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>[Solved] Search box placehoder text should change when an option is selected from a drop down list - JassWeb<\/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:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"[Solved] Search box placehoder text should change when an option is selected from a drop down list - JassWeb\" \/>\n<meta property=\"og:description\" content=\"[ad_1] You need to attach a change event to the select box. In it you grab the text from the selected option and set the placeholder attribute on the search box. var select_designatfirst = $(&#039;#select_designatfirst&#039;), empSearch = $(&#039;#empSearch&#039;); select_designatfirst.on(&#039;change&#039;, function () { empSearch.attr(&#039;placeholder&#039;, &#039;Search &#039; + select_designatfirst.find(&#039;:selected&#039;).text()); }); jsFiddle example That said, unless the search ... Read more\" \/>\n<meta property=\"og:url\" content=\"https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/\" \/>\n<meta property=\"og:site_name\" content=\"JassWeb\" \/>\n<meta property=\"article:published_time\" content=\"2022-10-14T23:36:49+00:00\" \/>\n<meta name=\"author\" content=\"Kirat\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Kirat\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/\"},\"author\":{\"name\":\"Kirat\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31\"},\"headline\":\"[Solved] Search box placehoder text should change when an option is selected from a drop down list\",\"datePublished\":\"2022-10-14T23:36:49+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/\"},\"wordCount\":118,\"publisher\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#organization\"},\"keywords\":[\"javascript\",\"jquery\"],\"articleSection\":[\"Solved\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/\",\"url\":\"https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/\",\"name\":\"[Solved] Search box placehoder text should change when an option is selected from a drop down list - JassWeb\",\"isPartOf\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#website\"},\"datePublished\":\"2022-10-14T23:36:49+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/jassweb.com\/solved\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"[Solved] Search box placehoder text should change when an option is selected from a drop down list\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/jassweb.com\/solved\/#website\",\"url\":\"https:\/\/jassweb.com\/solved\/\",\"name\":\"JassWeb\",\"description\":\"Build High-quality Websites\",\"publisher\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/jassweb.com\/solved\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/jassweb.com\/solved\/#organization\",\"name\":\"Jass Web\",\"url\":\"https:\/\/jassweb.com\/solved\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png\",\"contentUrl\":\"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png\",\"width\":693,\"height\":132,\"caption\":\"Jass Web\"},\"image\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31\",\"name\":\"Kirat\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1775798750\",\"contentUrl\":\"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1775798750\",\"caption\":\"Kirat\"},\"sameAs\":[\"http:\/\/jassweb.com\"],\"url\":\"https:\/\/jassweb.com\/solved\/author\/jaspritsinghghumangmail-com\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"[Solved] Search box placehoder text should change when an option is selected from a drop down list - JassWeb","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:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/","og_locale":"en_US","og_type":"article","og_title":"[Solved] Search box placehoder text should change when an option is selected from a drop down list - JassWeb","og_description":"[ad_1] You need to attach a change event to the select box. In it you grab the text from the selected option and set the placeholder attribute on the search box. var select_designatfirst = $('#select_designatfirst'), empSearch = $('#empSearch'); select_designatfirst.on('change', function () { empSearch.attr('placeholder', 'Search ' + select_designatfirst.find(':selected').text()); }); jsFiddle example That said, unless the search ... Read more","og_url":"https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/","og_site_name":"JassWeb","article_published_time":"2022-10-14T23:36:49+00:00","author":"Kirat","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Kirat","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/#article","isPartOf":{"@id":"https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/"},"author":{"name":"Kirat","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31"},"headline":"[Solved] Search box placehoder text should change when an option is selected from a drop down list","datePublished":"2022-10-14T23:36:49+00:00","mainEntityOfPage":{"@id":"https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/"},"wordCount":118,"publisher":{"@id":"https:\/\/jassweb.com\/solved\/#organization"},"keywords":["javascript","jquery"],"articleSection":["Solved"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/","url":"https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/","name":"[Solved] Search box placehoder text should change when an option is selected from a drop down list - JassWeb","isPartOf":{"@id":"https:\/\/jassweb.com\/solved\/#website"},"datePublished":"2022-10-14T23:36:49+00:00","breadcrumb":{"@id":"https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/jassweb.com\/solved\/solved-search-box-placehoder-text-should-change-when-an-option-is-selected-from-a-drop-down-list\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/jassweb.com\/solved\/"},{"@type":"ListItem","position":2,"name":"[Solved] Search box placehoder text should change when an option is selected from a drop down list"}]},{"@type":"WebSite","@id":"https:\/\/jassweb.com\/solved\/#website","url":"https:\/\/jassweb.com\/solved\/","name":"JassWeb","description":"Build High-quality Websites","publisher":{"@id":"https:\/\/jassweb.com\/solved\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/jassweb.com\/solved\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/jassweb.com\/solved\/#organization","name":"Jass Web","url":"https:\/\/jassweb.com\/solved\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/","url":"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png","contentUrl":"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png","width":693,"height":132,"caption":"Jass Web"},"image":{"@id":"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31","name":"Kirat","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/person\/image\/","url":"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1775798750","contentUrl":"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1775798750","caption":"Kirat"},"sameAs":["http:\/\/jassweb.com"],"url":"https:\/\/jassweb.com\/solved\/author\/jaspritsinghghumangmail-com\/"}]}},"_links":{"self":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/posts\/16321","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/comments?post=16321"}],"version-history":[{"count":0,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/posts\/16321\/revisions"}],"wp:attachment":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/media?parent=16321"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/categories?post=16321"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/tags?post=16321"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}