-6

I have created a drop-down list with this code:

  <select class="selectpicker" id="select_designatfirst" title="Select Designation">
  <?php foreach ($this->hierarchydisp as $val) { ?>
  <option value="<?php echo $val['hierarchy_id']; ?>" ><?php echo $val['hierarchy_name'] ?></option>
  <?php } ?>
  </select>

So far I am getting this output.

I am trying to change the search box placeholder text per the drop-down list.

The search box looks like this:

   <input type="text" class="form-control" id="empSearch"  placeholder="Search Employees">

The placeholder text in the search box should be: Search Company Admin when user selects Company Admin from the select box.

Useless Code
  • 12,123
  • 5
  • 35
  • 40
Amol Davkhar
  • 5
  • 5
  • You need to the code you're getting stuck with into the question as an [mcve]. Read [How to Ask a Good Question](/help/how-to-ask). What you have posted doesn't even qualify as a question so far. – Tibrogargan Aug 02 '16 at 06:13
  • By "label" do you mean the placeholder text? Or a label tag that is not shown in the code? It is not completely clear what you are asking. – Useless Code Aug 02 '16 at 07:03
  • @UselessCode the placeholder text of the textbox. – Amol Davkhar Aug 02 '16 at 09:01

2 Answers2

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 box is far removed from the drop down it probably isn'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.

Useless Code
  • 12,123
  • 5
  • 35
  • 40
0

If I understand your question correctly, you should add an event handler to the selectbox onchange event like so:

<select onchange="document.getElementById('empSearch').placeholder = this.value" class="selectpicker" id="select_designatfirst" title="Select Designation">
<?php foreach ($this->hierarchydisp as $val) { ?>
<option value="<?php echo $val['hierarchy_id']; ?>" ><?php echo   $val['hierarchy_name'] ?></option>
<?php } ?>
</select>

The above example will put the value of the dropdown (in your example the id) as teh placeholder of the textbox. If you want to use the text value you can for instance use the technique mentioned here:

Get selected text from a drop-down list (select box) using jQuery

Community
  • 1
  • 1
Robba
  • 7,684
  • 12
  • 48
  • 76