I have a project in which I must do something like this: when a user's page loads, he gets a personalized select box (with some options generated by PHP for him) and then, when he changes the option, I must change the rest of the content (on the same page). for example, let the select box for a kind of user be:
Now, my idea was to have a
<form action="processing.php"> <select name="choice" onChange="submit();">
etc. which should pass the user's choice to processing.php. The problem is, I want the first option to be automatically selected and the content for that option to appear when the page loads - somehow like the first option to be automatically submitted. Also, different kind of users should get different options, and I thought I can use a single page to process these requests. Is this achievable?
Can you please help me with an idea on how to submit that form automatically with the first generated option? Thank you.
You can use the onChange Event of the selection. In the handler you can then do the redirect
let sel = document.getElementById('yourselect');
let form = document.getElementById('yourform');
sel.onchange = function() {
form.submit()
}
You can easily bind the select change with Javascript. Here is the example with jQuery:
$('#mySelect').on('change', function(){
// Do your staff
$('#myForm').submit();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="myForm">
<select id="mySelect" method="post" action="processing.php" name="select_name">
<option value="">Select One</option>
<option value="http://google.com">Google</option>
</select>
</form>
</div>