Ionic Select

From WikiOD

Ionic select[edit | edit source]

The select of ionic select is more beautiful than the native one. But the pop-up option style is the browser default.

The styles of the options available on each platform are different. On the PC browser, you will see the traditional drop-down interface, the radio button options will pop up on Android, and the iOS has a scroll wheel operation interface.

Instance[edit | edit source]
 <code><div class="list"></code>
 
   <code><div class="item item-input item-select"></code>
     <code><div class="input-label"></code>
       Lightsaber
     <code></div></code>
     <select>
       <option>Blue</option>
       <option selected="">Green</option>
       <option>Red</option>
     </select>
   <code></div></code>
 
   <code><div class="item item-input item-select"></code>
     <code><div class="input-label"></code>
       Fighter
     <code></div></code>
     <select>
       <option>ARC-170</option>
       <option>A-wing</option>
       <option>Delta-7</option>
       <option>Naboo N-1</option>
       <option>TIE</option>
       <option selected="">X-wing</option>
       <option>Y-wing</option>
     </select>
   <code></div></code>
 
   <code><div class="item item-input item-select"></code>
     <code><div class="input-label"></code>
       Droid
     <code></div></code>
     <select>
       <option>2-1B</option>
       <option>B1</option>
       <option>C-3PO</option>
       <option>IG-88</option>
       <option>IT-O</option>
       <option selected="">R2-D2</option>
     </select>
   <code></div></code>
 
   <code><div class="item item-input item-select"></code>
     <code><div class="input-label"></code>
       Planet
     <code></div></code>
     <select>
       <option>Alderaan</option>
       <option selected="">Dagobah</option>
       <option>Felucia</option>
       <option>Geonosis </option>
       <option>Hoth</option>
       <option>Kamino</option>
       <option>Mygeeto</option>
       <option>Naboo</option>
       <option>Tataouine</option>
       <option>Utapau</option>
       <option>Yavin</option>
     </select>
   <code></div></code>
 
 <code></div></code>