So I have a drop down box that posts to the page on a submit button.
I am trying to remove the submit button and make it so it posts when you change the drop down as its a much better way to work!
The value = "submit_button" and it gets picked up by:
// Check if form has been submited
if ($_POST['submit_button'])
{
// If form has been submited set $newCookieValue variable, set cookie and refresh webpage
$newCookieValue=$_POST['dbselector'];
The code I am trying to use is:
<form>
<select name="dbselector" onchange="this.form.submit()" style="margin-left:0.5em;">
<option value="option_1" selected="selected">option_1</option>
<option value="option_2">option_2</option>
</select>
<noscript><input type="submit" value="submit_button"/></noscript>
</form>
When I change the drop down from option 1 to option 2 it reloads the page but I don't think its posting the values as I can check the values by adding this into the top of the page:
<br> <?php var_dump($_POST['dbselector']) ?>
<br> <?php var_dump($_POST['submit_button'])?>
and they both return NULL?????
You need to state in your form that you are using POST via method in order to tell the form which HTTP method to use:
<form method="post">
...
</form>
Related
I have a dropdown value out of forms and a table wih many rows to submit data.
What I'd like to do is during submit of each row submit also the getting value from the drop down list.
My table it's look like My code for dropdrown list is
<div class="panel-heading">
<label for="cat">Select a Category</label>
<select class="form-control" id='category' name="category" data-live-search="true" style="max-width:40%;" >
<?=$html?>
</select>
</div>
And the part for table rows is
<form id="sync-cat" action="controllers/product-add.php" target="_blank">
<input type="hidden" name="product" value="<?=$product['id']?>">
<button type="submit" class="btn btn-info btn-md">Sync Products</button>
</form>
I've tried with javascript copying selected value in hidden input but that run only for the first row. Also I've tried a hidden input above the dropdown list copying the select option but I didn't find a way to get value when I use submit button "Sync Products"
They should share the same form in HTML so that when the form is posted all available information is present in the form. Regardless your dropdown should also be in it's own form (if you don't put them in the same form) to be valid.
If you wanted to continue as is ignoring the proper things to consider above you could do it with something like this. This solution will make things a bit more complicated. I would recommend taking the above advice.
var form = document.getElementById('sync-cat')
form.addEventListener('submit', function(e) {
var valueFromDropDown = document.getElementById('category').value;
// Post the rest of the form
});
Follow the rest of this guide to complete the JavaScript post
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:
Main content
Tools
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>
This is how the disabled attribute works. When a form control is disabled, the value will be ignored when the form is submitted and the key will not be present in $_POST (or $_GET).
If you want the value to be present in the submitted data, but you don't want the user to be able to change the value on the page (which I imagine is what you are trying to acheive) use readonly="readonly" instead of disabled="disabled".
EDIT
The <select> element does not have a readonly attribute. The above information still stands as it will work for <input>s and <textarea>s.
The solution to your problem here would be to disable the select and use a hidden input to send the value back to the server - e.g.
When the select is enabled:
<select class="txtbx1" name="country">
<!-- options here -->
</select>
...and when it is disabled:
<select class="txtbx1" name="country_disabled" disabled="disabled">
<!-- options here, with appropriate value having `selected="selected"` -->
</select>
<input type="hidden" name="country" value="value_of_field" />
But the main thing is that how to set these Hidden field when i change the Select field . and how to set at Submit form time . ?
Hope This might help you,
HTML form readonly SELECT tag/input
Further you should use jQuery in order toggle Disabling the select tag and assigning new values to hidden field.
Initially you should use PHP echo attribute to set your hidden field Value.
I am trying to set my HREF of my button to the text that was in the input field and the selected option from my select list, when the user clicks the Search button.
<div>
<div>
<input type="text" value="Keywords" style="width:206px" />
</div>
<div style="clear:both">
<select>
<option value="Test">Test</option>
</select>
</div>
<div>
<button>Search</button>
</div>
</div>
How do I set the href from the value of the input box and the selected value of the select list? I might need to create a form for this but I thought I could get away with something a little simpler. I just need to compile the search string and redirect the user to the appropriate page, since the search engine is already built.
Thanks!
Edit 1
Sorry guys I am using php to load the select list but I am not able to provide the code for how the select list gets populated since it has company sensitive information in it. I shouldn't have included that.
Using javascript, you can retrieve and value of a form field and handle it to what you need.
Suppose the select ID's select and the link ID's is link:
var value = document.getElementById('select').value;
document.getElementById('link').setAttribute('href', value);
With PHP only (no jQuery, no Javascript) you would use a submit-button in your form and work with $_POST:
1st your form (stripped down to basics):
<form method="post">
<input name="keywords" type="text" value="Keywords" style="width:206px" />
<select name="options">
<option value="Test">Test</option>
</select>
<input type="submit" name="ok" value="ok" />
</form>
2nd, on the beginning of your php-page that holds that form:
if (isset($_POST['ok'])) { // submit has been clicked...
if (isset($_POST[keywords])) { // there's input in keywords
$keywords = $_POST['keywords'];
// sanitize $keywords to prevent sql-injection
// go to the page you want to call...
// assuming there's no output before header ...
// and $keywords is in the right format ...
// and you retrieved $_POST['options'] to do sth with that, too
header('Location: http://www.url.com/page.php?key=$keywords');
} else exit('no keywords entered!');
}
i have the first select options
<form id="infform" method="post">
<select id="infmenu" name ="infmenu" size="1" class="select" >
<option value="0" >Please Select your article</option>
<option value="3" selected='selected' > value 1</option>
<option value="2" > value 2</option>
<option value="18" > value 3</option>
<option value="16" > value 4</option>
</select>
<input type="hidden" name="hiddenselect" value="3" />
</form>
and the second is
<form action="" method="POST" id="form0">
<input type="text" name="date0" class="tcal" value="" readonly="readonly" /><br />
<input type="image" src="../submit.png"/>
<input type="hidden" name="submit0" />
</form>
this my javascript
function displayv() {
var singleValues = $("select option:selected").text();
$("#hiddenselect").val(singleValues);
$("select > option:first").prop("disabled", "disabled")
}
$(document).ready(function(){
$("select").change(function() {
displayv();
});
displayv();
$("select#infmenu").change(function() {
$("#infform").submit();
});
});
now when i select the first option the page refresh and i get the value selected.
and when i submit the second submit the page refreshes and the first select option returns empty Please Select your article.
so how should this be fixed please .
EDIT :
this the php how i handle between them.
if (isset($_POST['infmenu'])){
$infmenu = $_POST['infmenu'];
// some sql of updating here
}
if (isset($_POST['submit0'])){
//some updating sql here
}
It's not really clear to me what your question really is.
If you're saying you're not seeing your select item value when you submit the second form, then that is normal and expected. You have two independent forms so when you submit the second form, the data from the first form will not be sent to the server.
The submit button /image only sends data for the inputs within it's own form, not data from any other forms within your html body tag.
Edited to add: you could:
have a single form tag instead of two
modify your jquery so that it puts the select value into the hidden field of the second form s well as the hidden field of the first. Then when second form is submitted, have your PHP script read the hidden field value and use that when rendering the HTML to decide which option has the selected attribute.
use cookies with some JavaScript to set the cookie when the value of select changesuse Ajax to do a partial submit - assuming server doesn't need to know value of select item when dealing with second form
There is no action="" assigned to the first button.
You have two forms.
When you click the submit in the second form, of course the data of the first form is not submitted.
Also, the submit button in the second form has no name, so you perhaps cannot evaluate in PHP if the button is clicked. But that's a different story
You should make the two forms one.
If they are too far apart on your page. You should save the value of the select box in the hidden field in the second form with php