A kinda hacky way

Question

3

JQuery Searchable Dropdown box

rated 0 times [ 8] [ 5] / answers: 1 / hits: 70093 / 11 Years ago, sat, july 27, 2013, 12:00:00

I have a searchable list, created using JQuery Plugin from: http://plugins.jquery.com/searchit/

But i want some value to be selected by default when the list box shows up first time. Even though i have 'selected' mentioned in the option tag (Rockford in ex below). This part is not working.

Pls see here sample here:

http://jsfiddle.net/QuYJD/22/

$(select).searchit( { textFieldClass: 'searchbox' } );



    Type the search text:

    <br/>

    <select id=listBox1>

      <option>Robinhood</option>

      <option selected >Rockford</option>

      <option>Rome</option>

      <option>Ronda</option>

      <option>Rondon</option>

      <option>Rondonopolis</option>

      <option>Rongelap</option>

    </select>

Any idea? Or any other solution...

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

yisroels

Add To Favorites

Follow

Total Points: 256

Total Questions: 94

Total Answers: 102

Location: Chad

Member since Mon, Dec 5, 2022

2 Years ago

answered 11 Years ago lara · Accepted Answer

A kinda hacky way

Maybe you could do something like this after you init the plugin :

$(.searchbox).val($(#listBox1 :selected).val())

Because this plugin seems to be making you select into this:

<input type=textbox id=__searchit2 class=searchbox>

<div id=__searchitWrapper2 style=display: none; vertical-align: top; overflow: hidden; border: 1px solid rgb(128, 128, 128); position: absolute;>

 <select id=listBox2 style=padding: 5px; margin: -5px -20px -5px -5px;>

  <option>Robinhood</option>

  <option>Rockford</option>

  <option selected=>Rome</option>

  <option>Ronda</option>

  <option>Rondon</option>

  <option>Rondonopolis</option>

  <option>Rongelap</option>

 </select>

</div>

Plugin change

I added another option to the plugin called selected. If you set it to true, then the text box will show your selected option. Just add this extra option :

$(select).searchit({

      textFieldClass: 'searchbox',

      selected: true

 });

Demo : http://jsfiddle.net/hungerpain/QuYJD/23/