Checkbox value not submitting - php

EDIT
The form, and checkbox submits completely fine in Internet Explorer 8. In IE 10, and Chrome 34.0 it doesn't get submitted
Ok, this one has me stumped. I have a form, each form contains one question for a quiz, its possible answers, and a checkbox to select which is the correct answer.
<form action="/department/update_quiz_question/1/1/5" method="post" class="form-horizontal form-bordered form-row-stripped" id="question_form_5">
<tr id="question_5">
<td class="col-md-4">
<textarea name="quiz_question" class="form-control" rows="4">What letter precedes B?</textarea>
</td>
<td class="col-md-5">
<div class="input-group ">
<input type="text" class="col-md-5 form-control" name="answer[]" value="A">
<span class="input-group-addon">
<input type="checkbox" checked="checked" name="correct_answer[]" value="A">
</span>
<span class="input-group-btn">
<button class="btn red btn-delete-answer" type="button" data-question-id="5" data-answer="A"><i class="fa fa-trash-o"></i></button>
</span>
</div>
</td>
<td class="col-md-3">
Add Answer
Update
Delete
</td>
</tr>
</form>
When I submit the form, it goes to a Codeigniter method which only contains:
print_r($_POST);
var_dump($this->input->post('correct_answer'));
As you can see, the checkbox is most certainly checked. It is also checked visually (IE there is a tick in the box).
When I submit the form, it goes through a jquery checking script. If all passes, jquery submits the form.
Just before I submit the form, I log the value of the checked checkbox, using the following:
console.log($(".input-group input[name^='correct_answer']:checked").val());
Which, as you would expect, outputs A, or whichever answer is ticked. So I know for certain the checkbox is ticked.
However, Codeigniter outputs the following:
Array ( [quiz_question] => What letter precedes A? [answer] => Array ( [0] => A ) )
bool(false)
The array is from the raw $_POST data. bool(false) is outputted from $this->input->post('correct_answer');.
As you can see, the checkbox value for correct_answer is not even displaying in raw $_POST data.
I can't understand what I've done wrong. I have an identical form when I create a new question, and that works perfectly fine.
Can anyone see any obvious mistakes? Or am I doing something wrong?
Many thanks
EDIT
This is what I've tried so far:
Removing all the span elements around the checkbox, leaving just the text input and the checkbox input - Still not checkbox value in the post data
removed the square brackets around the checkbox name - no post data
renamed the checkbox name, no post data
Submitted the form straight away instead of passing through a jquery check first, no post data
Changed it from a checkbox to a radio button - no post data
changed it from checkbox to text, - works, doesnt work when its a radio or checkbox

Your HTML code is invalid – you can not have a form element as child of table.
Either put the whole table into the form, or the whole form inside a td element – these are your only two options.¹
Different error correction algorithms for faulty HTML most likely explain why you see your current code working in a certain browser, but not in others.
¹ Well, if you want to stick to a table anyway – as you said in comments, moving away from using a table resolved that structural issue as well.

Related

PHP. How to get $_POST value after table disappears from HTML

I am sorry for the title. That was my best shot to explain the situation with the least words.
I am trying to make a php program that has a html part with select and option. I am not using ajax or mysql. Just using a JSON file and xampp for apache.
if you select one of the options,`
if(isset($_POST["choice"]))
this php code will work in the html, and show a series of input boxes where you can type in what ever you want. Each option has an array within a JSON file.
So, I have put it in
$file[$_POST["choice"]]
`
and iterated it with a key => value. and shoved it in the input box. The value of the input box would be initially the value of the JSON file I called. I wanted the user to erase that text and type in their own. There could be several input boxes depending on the choice the user makes.
The name of the input box would be the KEY.
Then if you hit the edit button which is a input type submit, the series of input boxes will disappear.
I wanted to get the return with a
$_POST[KEY]
But, whatever I choose, the $_POST[KEY] will just return me the very first option of the select option html.
IS there a way I can solve this?
I need to get the corresponding array of the selected choice.
My goal is to get the values of the input box and update a JSON file.
<select name = "muscle">
<option value = "chest">Chest</option>
<option value = "back">Back</option>
<option value = "leg">Leg</option>
</select>
<br>
<input type="submit" name="choice" value="choose">
<br><br>
<?php if(isset($_POST["choice"])) : ?>
<h3> Current Workout Program </h6>
<?php
foreach ($program[$_POST["muscle"]] as $key => $val):
?>
<p><?= $key. ":" . $val;?></p>
<input type="text" name="<?=$key?>" value="<?=$val?>">
<?php endforeach;?>
<br><br>
<input type="submit" name="edit" value="edit">
<br>
</form>
<?php endif;?>
The iteration of the Key value above works fine.
But if I do a
if (isset($_POST["edit"])){
print_r($program[$_POST["muscle"]]);
}
After submission, It will give me the array for "chest" only.
As I understood your code, if you submit the mentioned form the $_POST would be as the following box:
//$_POST is like the following
[
"muscle" => "chest",
"choice" => "choose"
]
So in the result page, if(isset($_POST["choice"])) condition check would be always true, And the progress will go right.
I think on the destination page (eg. edit page) you have to add a hidden input as the following to make sure you tell the system which muscle you are editing:
<input type="hidden" name="muscle" value="<?= $_POST['muscle'] ?>">
Please note that the input type is hidden and it's not shown to the person who is working with the form.
Check the solution out and let me know if there are any other issues with the response.

HTML submit only submitting itself

first things first, english isn't my native language, so feel free to ask if I am being unclear.
I am currently trying to get a small webpage to work for a college task (and no, I'm not asking you to do my homework, but I currently am stuck and no amount of search has turned up valuable results so far) and it seems like my submit buttons only submit their own values and nothing else.
For example:
I have a form called "list" that has a select element, two buttons and one submit element.
Code:
<form id="list" action="process.php" method="post" onsubmit="return order()">
<select name="cart[]" id="myCart" size="6" multiple>
[contents of select element]
</select>
<p>
<input type="button" value="Delete All" class="custombuttonsmall" onclick="deleteElements()">
<input type="button" value="Delete Selected" class="custombuttonsmall" onclick="deleteElement()">
<input type="submit" value="Order" class="custombuttonsmall" name="order">
</p>
</form>
Note: the "order()" function checks if there are options in the select element. If there isn't, the process won't come through.
process.php currently only has two lines,
$q = $_POST;
var_dump($q);
to test if submitting works.
Result of var_dump:
array(1) { ["order"]=> string(5) "Order" }
Every other value I'm trying to call (e.g. $q = $_POST['cart']) returns NULL. Basically, my submit button seems to only submit its own value instead of the whole form. And I can't seem to figure out why. It happens for every form I'm trying t submit.
Sorry if this has been asked before or is too specific, but again, I haven't been able to get any progress on this so far.
Thanks in advance,
//EDIT:
Browsers used are Chromium 34.0.x and Firefox 30.0, same results on both.
Only selected options in a select element will be submitted.
Based on your bytton values, it seems likely that you are dynamically adding and removing options (without actually selecting them) instead of using the browser's native multiple selection UI.

How to display results from either searchbox OR from Checkbox

We have a searchbox shown below where users can enter a value, say 1234 ABC street, click Search and the results get displayed.
<!--form1 -->
<div id="inputBG">
<form id="searchForm" class="search_field" method="get" action="">
<input name="searchBox" id="searchBox" value="3440 Mark Drive" />
<button type="button" onclick="searchMap()"><img src="Viewer/images/search.png" alt="Search" /></button>
</form>
</div>
This works great.
If, however, users wish to display more than one type of results, the user clicks on an icon called Advanced Search. When this happens, a form with only checkbox shown below opens up in a new window.
<!--Form2 --->
<div id="featuresDiv">
<form id="featuresForm">
<br/>
<input type="checkbox" name="srcoptions" onClick="checkAll(this.form,this)" checked>Check/Uncheck All<br>
<label><input type="checkbox" name="featType" checked value="Addresses">Addresses</label><br/>
<label><input type="checkbox" name="featType" checked value="Voter Precincts">Voter Precincts</label><br/>
<label><input type="checkbox" name="featType" checked value="Voter Precincts (Pending)">Voter Precincts (Pending)</label><br/>
<label><input type="checkbox" name="featType" checked value="Voting Polls">Voting Polls</label><br/>
<label><input type="checkbox" name="featType" checked value="Voting Polls (Pending)">Voting Polls (Pending)</label><br/>
<label><input type="checkbox" name="featType" checked value="Zip Codes">Zip Codes</label><br/>
<label><input type="checkbox" name="featType" checked value="Zoning Petitions">Zoning Petitions</label><br/>
<button type="button" onclick="searchMap()"><img src="MapViewer/images/magnifying_glass.png" alt="Search" /></button>
</form>
</div>
Users have the option of checking all boxes or just a couple of boxes.
When the user clicks on Search, the results of those checked boxes are supposed to be displayed.
In situations where checkbox option is used, and more than one boxes are checked, the searchbox becomes irrelevant in the search.
I have tried several things and nothing seems to work so far.
When I use the checkboxes option and check more than one options, I get custom message that "Your search returned no results"
Here is the Javascript we have attempted which is supposed to show when the search is from searchbox (form1) or checkbox (form2).
Then we have php that is supposed to grab all search values (searchbox or checkbox) in to comma-separated values.
This has been driving us nuts for over 3 days now.
It is noteworthy to point out that the searchbox has a default value of 3440 Mark Street.
I am really stumped.
Any help is greatly appreciated.
// Construct query
**$features = $_GET["featType"];**
$tsql = "SELECT * FROM globes AS TBL
WHERE KEY_TBL.RANK > 0
ORDER BY ListOrder, Name, TBL.RANK DESC";
Some more information about what happens in doGlobalSearch and how the data is processed in PHP would be helpful. Offhand I'd guess there's some discrepancy in how the data sent to PHP is formatted and how it is expected to be formatted. Taking a total stab in the dark, have you tried just doing featureList = features.join()? Are you sure the individual values need to be quoted?
Just a suggestion, but here's how I would do it:
Combine the two forms into one.
Default all checkboxes to unchecked (or disable them) while the advanced search div is hidden.
Check (or enable) them when the advanced search div is shown.
Add [] to the end of each checkbox name so that the (checked) values are passed to PHP as an array when the form is submitted.
This way PHP would directly receive the searchData and featTypes (if any) together and you wouldn't have to parse the featTypes back out from a string in PHP. Then all you would need to do with javascript is submit the form and process the response. Again, this is without knowing what's going on in the backend or what control you have over it.

Blank input field gives previous default value in $_POST

I am new here so hope I am respecting the protocol ;-)
Here's a simple issue that for some reason I cannot solve.
I have a form with post action calling a php file, and several text input fields with default values set. Example:
<form class="form-horizontal" method="post" action="profile.php">
<input type="text" class="input-xlarge" id="q-2-Address" name="q-2-Address" value="Park Avenue">
<button type="submit" class="btn btn-primary">Save changes</button>
</form>
If I submit the form leaving the default value unchanged, $_POST['q-2-Address'] contains the default "Park Avenue" as expected.
If I try to change the value in the input text field (ex: to "Madison Avenue") I can see the result in $_POST['q-2-Address'] which gets set to "Madison Avenue", as expected.
But if I try to clear the value by removing all text, the $_POST['q-2-Address'] is NOT blank and in fact goes back to containing the default value set initially "Park Avenue".
So if I want to update a form by replacing previously filled fields with blanks, this seems to be impossible, nor is it possible to detect that the field has been cleared. I tried testing using empty() but of course it gives a false result, $_POST contains the default value so is not empty even though the text field is empty.
Short of my entering something like a single space, I see no way of actually clearing a field.
It is a trivial thing but maybe somebody knows more about this.
TIA
Mike
Instead of using a default value in your form, you could use a placeholder...
<form class="form-horizontal" method="post" action="profile.php">
<input type="text" class="input-xlarge" id="q-2-Address" name="q-2-Address" placeholder="e.g. Park Avenue">
<button type="submit" class="btn btn-primary">Save changes</button>
</form>
That way, you can give an example of what you want to have in that particular input box, without the use of default text that will get picked up by the php code.
here's a jsfiddle of what the placeholder looks like.
http://jsfiddle.net/bfwst/

Jquery autocomplete submission form

I am converting an old double dropdown box search form. With the old method, the form was submitted on each user selection using this:
<form name="navTwo">
<select name="item" id="item" onChange="document.location.href=document.navTwo.game.options[document.navTwo.game.selectedIndex].value">
The problem with the old method is that users were forced to look thru the second dropdown that contained an ever growing number of options.
I opted to make a new search using one auto submit drop down and a new jquery type ahead search field (thanks to Jamie McConnell, jamie#blue44.com). Everything works great with the type ahead. However, I cannot figure out how to submit the new form once the user picks the type ahead item. Ideally I would like to force the user to click submit once they've selected that second item.
I've tried carrying the id of the second search item and placing it in a hidden input but I cannot get the variable set to the id. Here is what I've tried so far, unsuccessfully;
//The page name is dash3.php
//If list = 1 it will add the record
//The jquery stuff works fine, it adds the value to the input field, I need it to grab the id of that record, not just the title. The $vid is empty, not sure how to set it.
//The code below is missing the submit button, I tried adding a link so that I could see the variables.
<form name="nav">
<div>
Start typing the name of the item, select the correct title when it appears:<br />
<input type="text" size="30" value="" id="inputString" onkeyup="lookup(this.value);" onblur="fill();" />
<input type="hidden" value="?list=1&ptfm_ctrl=1&vid=<?=$vid?>" />
</div>
<div class="suggestionsBox" id="suggestions" style="display: none;">
<img src="upArrow.png" style="position: relative; top: -12px; left: 30px;" alt="upArrow" />
<div class="suggestionList" id="autoSuggestionsList">
</div>
</div>
<strong>+</strong>
</form>
So, to make my question more clear;
How can I grab the id of the type ahead record that is being placed in the input field by a jquery autocomplete script and make a self referencing form carrying this id to the same page?
Thanks much!
Maybe this example in the autocomplete documentation will help: http://jqueryui.com/demos/autocomplete/#custom-data
The idea is that you populate your autocomplete boxes with enough data for the user to select the right choice and then provide the id and hook into the success event.
select: function( event, ui ) { ... }
This might help get you started: http://jsfiddle.net/shanabus/HGF59/
Instead of the alert that fires upon the second dropdown selection, do something like update your form action:
$("#myForm").attr("action", $("#myForm").attr("action") + "/" + ui.item.id);
and then submit if needed. Hope this helps!

Categories