CODEWITHSUNDEEP
javascripthtml
John
John

Reputation: 285

How to get values from select list?

I am trying to get a value from a select list that will determine what my form method is, either get or post. I am having trouble doing this though. Any suggestions?

<select name ="optionlist" form ="form" id="test">
  <option value="get">GET</option>
  <option value="post">POST</option>
</select>

<form name="input" action="" method="" id="form">
    <input type="text" name="search">
    <input name="buttonExecute" type="submit" value="Submit"/>
</form>

JS

function myFunction(input){
    alert("You typed in : " + input);
}

function load(){
    alert("Page Loaded! This is the current text in the textbox : "+ document.getElementsByName('search')[0].value);
}

func

window.onload = load;

Any help will be greatly appreciated! Thanks!

Upvotes: 0

Views: 81

Answers (2)

Sebastien Daniel
Sebastien Daniel

Reputation: 4778

First you add an event listener to your select element, to trigger a function when it's value changes:

document.getElementById('test').addEventListener('change', setFormMethod, true);

Second you make sure your triggered function changes the form's method attribute:

function setFormMethod(e) {
  document.getElementById('form').setAttribute('method', e.target.value);
}

EDIT

<html>
 <head>
 </head>
 <body>
  <!-- your HTML here -->
 <script>
  // my code here
 </script>
</body>

Upvotes: 1

Cyril Duchon-Doris
Cyril Duchon-Doris

Reputation: 14039

I believe this would work

$("#yourDropdownId").change(function() {
    value = $( "#yourDropdownId option:selected").val()
    if (value === 'post')
        $("#yourFormId").attr("method", 'POST')
    else
        $("#yourFormId").attr("method", 'GET') 
});

Upvotes: 0

Related Questions