Search code examples
jqueryhrefhtml-select

Jquery - change href of link using the select tag which belongs to it


I have this code:

<li class="list-group-item ui-sortable-handle">
      <a href="#" class="display">Contact</a>

      <select id="select" "="" name="pages">
        <option value="" selected="">Vyberte stránku</option>
        <option value="1">Admin-Stranka1</option>
        <option value="2">Admin-Stranka2</option>
        <option value="3">Admin-Stranka3</option>
        <option value="4">Admin-Stranka4</option>
      </select>
    </li>

    <li class="list-group-item ui-sortable-handle">
      <a href="#" class="display">Home</a>

      <select id="select" "="" name="pages">
        <option value="" selected="">Vyberte stránku</option>
        <option value="1">Admin-Stranka1</option>
        <option value="2">Admin-Stranka2</option>
        <option value="3">Admin-Stranka3</option>
        <option value="4">Admin-Stranka4</option>
      </select>
    </li>
    <li class="list-group-item ui-sortable-handle">
      <a href="#" class="display">About</a>

      <select id="select" "="" name="pages">
        <option value="" selected="">Vyberte stránku</option>
        <option value="1">Admin-Stranka1</option>
        <option value="2">Admin-Stranka2</option>
        <option value="3">Admin-Stranka3</option>
        <option value="4">Admin-Stranka4</option>
      </select>
    </li>

I would like to change the href of the link by setting the value of the select, which is next to the link

How can I do this? Thank you


Solution

  • $("select").each(function() { 
        $(this).change(function() {
            $(this).prev('a').attr('href',$(this).val());
        })
    })