How to get form data without submit button?

There is such code:
<select name="class" class="choose-class">
<option selected disabled>Category</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
</select>

How to get the class value into php without clicking the submit button and without refreshing the page?
March 23rd 20 at 19:16
3 answers
March 23rd 20 at 19:18
Solution
You need to perform an ajax request.
Approximately
var chooseСlass = $('.choose-class').val();
var url = '/'; // here specify the address of the PHP script
var formData = new FormData();
formData.append('class', chooseСlass);

$.ajax({ // send the request
 url: url,
 type: 'POST',
 cache: false,
 contentType: false,
 processData: false,
 data: formData
 });
Well and the address of the php script to specify the same? - donald.Roga commented on March 23rd 20 at 19:21
@donald.Roga, I don't know where your processor is.. - david66 commented on March 23rd 20 at 19:24
This code has appeared:
<div class="text-center">
 <form method="POST">
 <select name="class" class="choose-class" onchange="send()">
 <option selected disabled>Select category</option>
 <option value="5">5 class</option>
 <option value="6">6 class</option>
 <option value="7">7 class</option>
 <option value="8">8 class</option>
 <option value="9">grade 9</option>
</select>
<br / >
</form>
 <script type="text/javascript">
 function send() {
 var chooseСlass = $('.choose-class').val();
 var url = '<?php echo $_SERVER['
 DOCUMENT_ROOT ']."/index.php";?>';
 var formData = new FormData();
 formData.append('class', chooseСlass);
$.ajax({
 url: url,
 type: 'POST',
 cache: !1,
 contentType: !1,
 processData: !1,
 data: formData
})
}
</script>
<?php
 if (!empty($_POST)){
 echo $_POST['class'];
}
?>
</div>

Not working - donald.Roga commented on March 23rd 20 at 19:27
Track the change event for the select
$('.choose-class').on('change', function(){
 // now get the current value of the select and query
});



var url = '<?php echo $_SERVER['
 DOCUMENT_ROOT ']."/index.php";?>';



remove $_SERVER['DOCUMENT_ROOT '] - david66 commented on March 23rd 20 at 19:30
Still nothing works
Here is the code:
<form method="POST">
 <select name="class" class="choose-class">
 <option selected disabled>Select category</option>
 <option value="5">5 class</option>
 <option value="6">6 class</option>
 <option value="7">7 class</option>
 <option value="8">8 class</option>
 <option value="9">grade 9</option>
</select>
<br / >
</form>
 <script type = "text/javascript">
 $('.choose-class').on('change', function() {
 var chooseСlass = $('.choose-class').val();
 var url = '/1.php'; // here specify the address of the PHP script
 var formData = new FormData();
 formData.append('class', chooseСlass);

 $.ajax({ // send the request
 url: url,
 type: 'POST',
 cache: false,
 contentType: false,
 processData: false,
 data: formData
});
 }); </script>
- donald.Roga commented on March 23rd 20 at 19:33
You have jQuery running? - david66 commented on March 23rd 20 at 19:36
<script src="/js/jquery-3.3.1.js"></script>
<script type = "text/javascript">
 $('.choose-class').on('change', function() {
 var chooseСlass = $('.choose-class').val();
 var url = '/1.php'; // here specify the address of the PHP script
 var formData = new FormData();
 formData.append('class', chooseСlass);
 $.ajax({ // send the request
 url: url,
 type: 'POST',
 cache: false,
 contentType: false,
 processData: false,
 data: formData
});
 }); 
</script>
- donald.Roga commented on March 23rd 20 at 19:39
Still nothing works

And how you checked? What should happen? - david66 commented on March 23rd 20 at 19:42
@david66in the file 1.php
<?php
if (!empty($_POST)){
 echo $_POST['class'];
}
?>
- donald.Roga commented on March 23rd 20 at 19:45
Well, on the screen nothing will appear.
You wanted to send
without a page refresh

The request is performed asynchronously. The user will not see anything. - david66 commented on March 23rd 20 at 19:48
March 23rd 20 at 19:20
Track changes and pass AJAX'om
March 23rd 20 at 19:22
Ajax on change...

Find more questions by tags HTMLjQueryJavaScriptPHP