How to change URL value, with information retained in Select/Option

Asked

Viewed 1,368 times

2

I use this because I am developing an E-commercer system, the more the customer wants the products to be in Combobox with Select. So far everything is correct, my difficulty is in changing the URL, as the 'product' selected on <SELECT>/<OPTION>

I need the URL to be changed according to the items chosen in Select, this Select makes a query in the database that presents the products in

I am managing to get the information when I choose certain SELECT OPTION: My problem is changing the URL.

Follow the Code.

//I take the values of the OPTION and pass to a variable.

echo "<script language='javascript'>
     function PegarValores(){
    pd_nome = document.getElementById('produto_nome').options[document.getElementById('produto_nome').selectedIndex].text;
    pd_id = document.getElementById('produto_nome').value;
    alert(pd_id+' - '+pd_nome);
      }
   </script>";

Alert is correctly resuming the selected select values.

The problem comes now, how to make the URL automatically change as the selected value in select.

echo "<select id='produto_nome' name='produto_nome[]' value='' onchange='PegarValores()'>
<option value='-1'>
    Selecione
</option>";

while ($proteina = mysqli_fetch_assoc($query)){
    extract($proteina);
    echo '<option value="' . $produto_id . '">' . $produto_nome . '</option>';
}
echo "</select>";
echo "<a href='addtocart.php?id='$produto_id&name=$produto_nome' class='customButton'>";
echo "Adicionar";
echo "</a>"; 
  • Possible duplicate: http://answall.com/questions/14646/como-selectr-uma-opcao-em-um-select-e-carregar-relateddata

  • you just want to change the url by adding to the history or even want to redirect to the desired url?

  • I need these collected values, go to the URL, so that it can be added to the order list. I just don’t know how to pass these values that are from pd_id and pd_name to the url instead of 'id='$producto_id&name=$producto_name''

1 answer

2

See this example here using jQuery: http://jsfiddle.net/zTrhX/

HTML:

<select id='meu_select'>
  <option value='1'>Valor 1</option>
  <option value='2'>Valor 2</option>
</select>

Javascript:

// pega instância do select
var meu_select = $('#meu_select');
// adiciona evento quando o usuário selecionar outro valor
meu_select.change(function() {
  // pega valor do option selecionado
  var valor = meu_select.val()
  alert('Seu valor é: ' + valor);
  // muda url do navegador
  location.href = '#?param1=' + valor;
})

Browser other questions tagged

You are not signed in. Login or sign up in order to post.