CODEWITHSUNDEEP
jquery
user2221553
user2221553

Reputation: 15

How do I send data from a form select element?

How can I choose an option from a <select> element and then send that value to MySQL? After that, I want a "save" button to be clicked programmatically.

HTML :

<body>
<form>
<select name="ABCD">
<option value="A">A</option>
<option value="B">B</option>
<option value="D">C</option>
<option value="c">D</option>
</select>
<input type="submit" value="save" />
</form>
</body>

jQuery :

<script>
$.ajax({
  url: "ABC.php",
  data:{ABCD:'B'},
  datatype: "html",
  success: function(data){

   $(data).find("form").find("input[type=submit]").click();
  }
});
</script>

I tried this:

data:{ABCD:'B'} //json

It did press on the save button, but it did not send data to MySQL.

How can I both send the selected value and click on the save button?

Upvotes: 0

Views: 1547

Answers (1)

hodl
hodl

Reputation: 1420

I think you wanted to send data when you choose from the selection.

<body>
<form>
<select name="ABCD" onchange="yourFunction(this.value)">
<option value="A">A</option>
<option value="B">B</option>
<option value="D">C</option>
<option value="c">D</option>
</select>
</form>
</body>


<script>
function yourFunction(val){
    $.ajax({
      url: "ABC.php",
      data:{ABCD:val},
      datatype: "html",
      success: function(data){
        $(data).find("form input[type=submit]").trigger('click');
      }
    });
}
</script>

or

<form>
<select id="ABCD" name="ABCD">
<option value="A">A</option>
<option value="B">B</option>
<option value="D">C</option>
<option value="c">D</option>
</select>
</form>
</body>

<script>
$('#ABCD').change(function(){
    var val = $(this).val();
    $.ajax({
      url: "ABC.php",
      data:{ABCD:val},
      datatype: "html",
      success: function(data){
       $(data).find("form input[type=submit]").trigger('click');
      }
    });
});
</script>

Upvotes: 1

Related Questions