We Keep Coding

Form is auto submitting but the data is not getting passed/received

I have a problem in automating a form with hidden inputs in PHP. Basically I'm doing an input for a barcode scanner where the user will input the barcode and it will auto-submit, just like in a cash registry.
The conflict which I think is the cause of the problem is because of a conditional form. Here is a snippet:
<form method="post" id="form1">
<div class="products">
<input type="text" name="code" class="form-control" autofocus required onchange="submit()" />
</div>
</form>
<?php
$query = 'SELECT * FROM product WHERE PRODUCT_CODE='.$code.' GROUP BY PRODUCT_CODE ORDER by PRODUCT_CODE ASC';
$result = mysqli_query($db, $query);
if ($result):
if(mysqli_num_rows($result)>0):
while($product = mysqli_fetch_assoc($result)):
?>
<form id="form2" method="post" action="pos.php?action=add&id=<?php echo $product['PRODUCT_CODE']; ?>" >
<input type="hidden" name="quantity" class="form-control" value="1" />
<input type="hidden" name="name" value="<?php echo $product['NAME']; ?>" />
<input type="hidden" name="price" value="<?php echo $product['PRICE']; ?>" />
<input type="submit" name="addpos" style="margin-top:5px;width: 462px" class="btn btn-info" value="Add"/>
</form>
<?php
endwhile;
endif;
endif;
?>
<script>
function submit() {
document.getElementById("form1").submit();
}
document.getElementById("form2").submit();
</script>
The data from form1 has no trouble auto-submitting, then the form2 will auto-submit but nothing happens. I need help on how can I make form2 auto-submit correctly too. I have tried different event handling for form2 but nothing happens. I only know a little bit of javascript so that's just how my script turned out.
Thank you, Programming kings!

Because the second form is inside the while loop, if there are multiple results there will be multiple forms with the same id = "form2".
You need an increment variable $incrm = 2 inside the loop,
form id='form<?php echo $incrm;?>',
with $incrm++ before ending it. I also recommend to add ann onchange event to the last input 'price' ; onchange = submit(this).
function submit(inp) {
inp.parentElement.submit();
}

Multiple form dynamic field javascript validation

I have multiple form like this:
<?php for ($i = 0; $i > $n; $i++) { ?> // n is no. of value (no limit)
<form>
<input name="<?php echo $i; ?>venue" type="text">
<input name="roster" type="text">
<input type="submit" name="btn_venue">
</form>
<?php } ?>
<form>
<input name="hospitality" type="text">
<input name="template" type="text">
<input type="submit" name="btn_hospitality">
</form>
...
...
<form>
<input name="element" type="text">
<input name="alignment" type="text">
<input type="submit" name="btn_xyz">
</form>
I want validate(field should not be blank) in all form so, how can I use validation ?
I tried jQuery validation:
<script>
$('document').ready(function () {
$('form').each(function (key, form) {
$(form).validate({
rules: {
hospitality: {
required: true
},
//...
//...
alignment: {
required: true
}
});
});
});
</script>
I have manage static name field validation but I don't idea about dynamic venue name validation.Can anyone help me ?
if only one form the easily maintain but dynamically multiple form submit validate how to validate.
at a time only one form submit but particular form field validate how it is possible?

Try this. It goes through each form and for each of them through each input (of type text) and builds a required rule for each of them. Then feeds the dynamically built rules to the validate function.
$('document').ready(function () {
$('form').each(function (key, form) {
// build the rules object dynamically
var rules = {};
// loop through each input in the form
$(form).find('input[type="text"]').each(function(idx, obj) {
// make a rule for this input
rules[obj.name] = {"required": true};
});
$(form).validate({
"rules": rules
});
});
});

Okey this is not for sure the cleanest way to do this but its the first that cross my mind.
First, edit your html, so form has id="form$i", input has id="input$i", and submit has id="$i". Also add class to submit class="validate"
<?php for ($i = 0; $i > $n; $i++) { ?> // n is no. of value (no limit)
<form id="form<?php echo $i; ?>">//so id="form2" for example
<input id="input<?php echo $i; ?>" name="<?php echo i; ?>venue" type="text">// id="input2"
<input name="roster" type="text">
<input id="<?php echo $i; ?>" class="validate" type="submit" name="btn_venue">//id="2"
</form>
<?php } ?>
JQuery which should work, I'll explain each line in code
<script>
$(function () {
$(".validate").click(function () { //this is call for each click button with class validate
var id = $(this).attr('id');//getting id of the clicked element which is $i
var formid = 'form' + id;//creating new var formid which will target formid (for example: in first loop $i=1, so id=1, and formid=form1)
var input = 'input' + id;//creating input which value will be input$i
$('#' + formid).on('submit', function (e) {//on form submit validate function
if ($(#input).value == '') {
return false;
} else {
return true;
}
});
});
});
</script>
hope you understand logic, it might be I made mistake somewhere so take a close look..

Submitting with Javascript and getting form data with php

I have a search bar that uses a javascript function to submit the form when the user hits Enter (which is working) because it doesn't have a submit button, but I need to use php to handle the data in the textbox on post. The form is submitting, but on post it's not able to grab what was in the search textbox.
Here's the code:
<form id="siteWideSearch" name="siteSearch" action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>" method="post">
<input id="homeSearch" type="text" maxlength="100" onkeypress="startSiteSearch(event);" />
</form>
Javascript:
if (event.keyCode == 13) {
document.getElementById("siteWideSearch").submit();
}
PHP:
if($_SERVER["REQUEST_METHOD"] == "POST") {
echo "<script type=\"text/javascript\">window.alert(\"Post reached. Yay!!\");</script>";
echo "<script type=\"text/javascript\">window.alert(\"Search Criteria: ".trim($_POST['homeSearch'])."\");</script>";
}
I get the popup saying that post was reached, but the second popup just outputs "Search Criteria: " and nothing else.

You're missing the name attribute on your form input. Without it that value is not submitted.
<input id="homeSearch" type="text" maxlength="100" onkeypress="startSiteSearch(event);" />
should be:
<input name="homeSearch" id="homeSearch" type="text" maxlength="100" onkeypress="startSiteSearch(event);" />

Multiple forms onclick event only working for first form

I'm sure this has been asked befor but I can't seem to find it in a search
I have multiple forms on a page generated by php all with onCick event
The problem is it only picks up the first event after that any other clicks produce same result from first click
Here is javascript
function CompareScores(form)
{
var scoreA = document.getElementById("score_A").value;
var scoreB = document.getElementById("score_B").value;
if(scoreA > scoreB){
alert('Score A is Larger ' + scoreA)
}else{
alert('Score B is Larger ' + scoreB)
}
}
And the php generating forms
<?php
while($i<=$numPrelimTeams) {
if($i!=$e) {
?>
<form action="processScores.php" method="post"><p><u><?php echo $prelimTeam[$i]; ?> --> SCORE : <input type="text" class="small" id="score_A" name="score_A" size="1"></u></p>
<input type="hidden" name="team_A" value="<?php echo $prelimTeam[$i]; ?>">
<input type="hidden" name="game" value="<?php echo $game_num; ?>">
<p class="right">Game # <?php echo $game_num; ?> ) <input type="button" value="Enter Scores" onClick="CompareScores(this.form)"></p>
<?php
}else{
?>
<p><u><?php echo $prelimTeam[$i]; ?> --> SCORE : <input type="text" class="small" id="score_B" name="score_B" size="1"></u></p>
<input type="hidden" name="team_B" value="<?php echo $prelimTeam[$i]; ?>">
</form><br><br><br>
<?php
$game_num++;
$e=$e+2;
}
$i++;
}
?>

Without knowing the inputs or seeing the result, it's hard to tell for sure, but it looks like you might be generating multiple instances of this form on the same page, giving you multiple page elements named "score_A" and "score_B". document.getElementById will then become a bit ambiguous.
Since you're already sending the form object, use that instead:
var scoreA = form.score_A.value;
...

There is essentially a single problem with your code. You have multiple instances of the same ID.
To fix it, try something like this.
<input type="text" class="small score_A" name="score_A" size="1" />
Similarly
<input type="text" class="small score_B" name="score_B" size="1" />
Now, you can write a querySelector in your JS
function CompareScores(form) {
var a = form.querySelector('.score_A').value;
var b = form.querySelector('.score_B').value;
//do something
}

javascript does not execute (codeigniter) php script after window.print()

i have this javascript that checks if payment is equal or greater than total,
a window.print executes likewise a redirect page occurs, but it only print
but does not redirect.
view page:
<script>
function printpage()
{
var
total = parseFloat($(':input[name="total"]').val(),10),
cash = parseFloat($(':input[name="cash"]').val(),10),
charge = parseFloat($(':input[name="charge"]').val(),10),
payment = (cash + charge);
if(payment>= total){
window.print();
}else{
return false;
}
}
</script>
im not good at javascript.
here is some more details:
<form action="bills/settle" method="post">
<input type="text" name="cash">
<input type="text" name="charge">
<input type="text" name="total" value="<?php echo $total">
<input type="submit" onclick="printpage()"
</form>
controller page:
function settle(){
$payment = $this->input->post('cash')+ $this->input->post('charge');
$total = $this->input->post('total');
$data = ('cash'=>$this->input->post('cash'), so on.....)
if($payment >=$total)
{
$this->load->model('process');
$this->process->close_bill($data);
} else {
redirect('msg','refresh');
}
}
*other notes,
if payment is OK:
it prints, inserts data's to database but does not redirect.
the redirect script is in my model after a successful db insert.
if payment is not OK:(no problem on this side)
it redirects to msg page,

This has nothing to do with the javascript; it was an honest mistake on your part:
<input type="text" name="total" value="<?php echo $total">
should instead be:
<input type="text" name="total" value="<?php echo $total; ?>">
Also, it would help if you had display_errors set to on and error_reporting set to E_ALL while you are doing development, so you can see when errors occur.