XF 2.2 Anyone can help me edit this HTML code to add links

Tamasita

Member
How I can edit this "prefix" HTML code, to create in its style a link dropdown menu?

I can not make the texts into clickable links.

Anyone can help me edit this HTML code?

HTML:
<select class=" input" title="Prefixes" name="prefix_id">
<option selected="selected" value="0">(Any)</option>
<optgroup label="Link Selector">
<option value="155" data-prefix-class="label label--lightGreen">Cliclable Link 1</option>
<option value="156" data-prefix-class="label label--lightGreen">Cliclable Link 2</option>
<option value="157" data-prefix-class="label label--lightGreen">Cliclable Link 3</option>
<option value="158" data-prefix-class="label label--lightGreen">Cliclable Link 4</option>
<option value="153" data-prefix-class="label label--lightGreen">Cliclable Link 5</option>
</optgroup>
</select>


299796459_515896937005194_1070255179763017566_n.webp
300766823_481068936729765_8568764489135798794_n.webp
 
Solution
Thank you, but unfortunately not working. It's no interaction when I click it. I found a code online, and now I try to mix it with that. I think I missing defining the action like in this code:

HTML:
<form action="/action_page.php">
  <label for="cars">Choose a car:</label>
  <select name="cars" id="cars">
    <optgroup label="Swedish Cars">
      <option value="volvo">Volvo</option>
      <option value="saab">Saab</option>
    </optgroup>
    <optgroup label="German Cars">
      <option value="mercedes">Mercedes</option>
      <option value="audi">Audi</option>
    </optgroup>
  </select>
  <br><br>
  <input type="submit" value="Submit">
</form>
Sorry, try this:
Code:
<form>
<select name="list" id="list" accesskey="target">...
You could try this:
Code:
<select class=" input" title="Prefixes" name="prefix_id">
<option selected="selected" value="0">(Any)</option>
<optgroup label="Link Selector">
<option value="155" data-prefix-class="label label--lightGreen"><a href="#">Cliclable Link 1</a></option>
<option value="156" data-prefix-class="label label--lightGreen"><a href="#">Cliclable Link 2</a></option>
<option value="157" data-prefix-class="label label--lightGreen"><a href="#">Cliclable Link 3</a></option>
<option value="158" data-prefix-class="label label--lightGreen"><a href="#">Cliclable Link 4</a></option>
<option value="153" data-prefix-class="label label--lightGreen"><a href="#">Cliclable Link 5</a></option>
</optgroup>
</select>


Where # is, is where you'd put the actual URL/anchor to where you want the link to go.
 
You could try this:
Code:
<select class=" input" title="Prefixes" name="prefix_id">
<option selected="selected" value="0">(Any)</option>
<optgroup label="Link Selector">
<option value="155" data-prefix-class="label label--lightGreen"><a href="#">Cliclable Link 1</a></option>
<option value="156" data-prefix-class="label label--lightGreen"><a href="#">Cliclable Link 2</a></option>
<option value="157" data-prefix-class="label label--lightGreen"><a href="#">Cliclable Link 3</a></option>
<option value="158" data-prefix-class="label label--lightGreen"><a href="#">Cliclable Link 4</a></option>
<option value="153" data-prefix-class="label label--lightGreen"><a href="#">Cliclable Link 5</a></option>
</optgroup>
</select>


Where # is, is where you'd put the actual URL/anchor to where you want the link to go.

Thank you, but unfortunately not working. It's no interaction when I click it. I found a code online, and now I try to mix it with that. I think I missing defining the action like in this code:

HTML:
<form action="/action_page.php">
  <label for="cars">Choose a car:</label>
  <select name="cars" id="cars">
    <optgroup label="Swedish Cars">
      <option value="volvo">Volvo</option>
      <option value="saab">Saab</option>
    </optgroup>
    <optgroup label="German Cars">
      <option value="mercedes">Mercedes</option>
      <option value="audi">Audi</option>
    </optgroup>
  </select>
  <br><br>
  <input type="submit" value="Submit">
</form>
 
Thank you, but unfortunately not working. It's no interaction when I click it. I found a code online, and now I try to mix it with that. I think I missing defining the action like in this code:

HTML:
<form action="/action_page.php">
  <label for="cars">Choose a car:</label>
  <select name="cars" id="cars">
    <optgroup label="Swedish Cars">
      <option value="volvo">Volvo</option>
      <option value="saab">Saab</option>
    </optgroup>
    <optgroup label="German Cars">
      <option value="mercedes">Mercedes</option>
      <option value="audi">Audi</option>
    </optgroup>
  </select>
  <br><br>
  <input type="submit" value="Submit">
</form>
Sorry, try this:
Code:
<form>
<select name="list" id="list" accesskey="target">
    <option value='none' selected>Choose a theme</option>
    <option value="index.html">Theme 1</option>
    <option value="theme2.html">Theme 2</option>
    <option value="theme3.html">Theme 3</option>
</select>
<input type=button value="Go" onclick="goToNewPage()" />
</form>


Put this into your header's <head></head> tags:
Code:
<script type="text/javascript">
    function goToNewPage()
    {
var url = document.getElementById('list').value;
if(url != 'none') {
window.location = url;
        }
    }
</script>
 
Solution
Top Bottom