Form / Submit Button in PHP - php

This .php file outputs items from an XML file onscreen and gives the user the chance to click on the add to cart submit button which is displayed after each item. The idea is that the ID, Name etc are further used in a shopping cart system, but I am still in the starting stages of the shopping cart. (This is for an assignment)
But the problem is that this method does not work since when all the iterations are done, irrespective to which button is clicked, the computer will always refer to the values stored in the variables in the last iteration of the for loop.
I want to write some code in order to be able to have a UNIQUE button for each ID, and when this button is pressed, the corresponding information to that item is put through thi: action="add.php"
Any help would deeply be appreciated because I am stuck, and I have no idea
<?php
$doc = new DOMDocument();
$doc->load('menu.xml' );
$Wraps = $doc->getElementsByTagName ("Wraps");
foreach ($Wraps as $w) {
$wrapsid = $w->getElementsByTagName("id")->item(0)->nodeValue;
$wrapsname = $w->getElementsByTagName("Type")->item(0)->nodeValue;
$wrapsprice = $w->getElementsByTagName("Price")->item(0)->nodeValue;
echo "Wraps ID: $wrapsid <br> Wraps Name: $wrapsname <br> Wraps Price: $wrapsprice";
?>
<form action="add.php" method="post">
<td class='view_td' width='10%'><center>
<INPUT TYPE=HIDDEN NAME='ID' value='{$wrapsid}'/>
<input type='submit' value='Add to cart' /></center></td><br>
</form>
<?php
}
?>

you can't put form tags around a TD it has to go around the whole table, either use divs and style it to replicate a table layout using CSS or use GET as you are only passing the ID back to the server eg. use an anchor instead of your input

To identify the submitted form, you can use:
•A hidden input field.
•The name or value of the submit button.
The name of the form is not sent to the server as part of the POST data.
more information

Related

advanced search without javascript

I'm building an advanced search with a-tags to filter for first letter abcdefghijklmnopqrstuvwxyz0-9 and also an input field, options fields for other criteria, radio buttons and a submit button. When I click on a letter-filter, it sends it as $_GET variable. But when I then use the input fields it forgets it of course. How can I grab this variable with the submit button before sending it along with all the other variables from the form? Do I have to use JS and AJAX for that? Do you recommend that?
EDIT
so let me rephrase that.
I have different variables to send to the server, coming from input fields, radio buttons, option fields but I also want a link for each letter of the alphabet (so it would then list all entries that start with that letter).
When I click the submit button it sends all the variables from the input fields but not from the a-tags (cause they are not recognized as form-fields I guess). When I click on the a-tags (a letter) it sends just that very variable to the server which is fine as well. My question is, how can I get the submit button to send everything?
<input type='search' id='search-query' name='q' class='uk-input uk-form-width-medium' placeholder='Suche'>
<p>
<?php
foreach ($alphabet as $abc){
if ($abc == $letter) {
$class = 'current';
}
else $class = '';
echo '<a class="'.$class.'" href="'.$page->url.'?letter='.$abc.'">'.$abc.'</a> ';
}
?>
</p>
<select class="uk-select uk-width-medium" name="what">
<option>Titel</option>
<option>Autor</option>
<option>Erscheinungsdatum</option>
</select>
<label><input class="uk-radio" type="radio" name="how" value="aufsteigend" checked> aufsteigend</label>
<label><input class="uk-radio" type="radio" name="how" value="absteigend"> absteigend</label>
<button class="uk-button uk-button-primary" type="submit">Suche starten</button>
</form>```
I assume you want to have dynamic Google-like search where you type in "a" and it gives you a drop-down list of options like "airplane, applle, artery" etc.
If that is the case, then yes, you do need JS + AJAX.
Instead of clicking on a letter filter, you can have AJAX dynamically display you the options available right in the input field.
Given the vague description of your question and the absence of images of your UI that is all that can be said.
I didn't really get the question and the whole situation from the explanation, but sounds like following:
You want to render the hints based on the value of the input field search-query when user clicks on the specific button: letter-filter. If this is right, then you will have to anyways send a get request to the back end so that it would give back the page with all hints.
FE:
<html>
<body>
<form action="app.com/myurl" method="GET" >
<input id="letter" value="a" name="letter" />
<input id="letter2" value="b" name="other_param" />
<input id="letter3" value="c" name="another_param" />
<!-- All three inputs will be visible in the $_GET variable when you send the request -->
<!-- Other input fields here: <input type="whatever" id="whatever".../> -->
<button type="submit">letter filter</button>
</form>
</body>
</html>
You can even track the request in borwser's network tab, if the params are not appended as query params like app.com/myurl?letter=a&other_param=b&another_param=c, if you dont see the query params but see the url itself, then I can suggest you forgot to set the method of the form.
But I am still not sure, can you rephrase your question, as it doesn't clearly explain the case, sorry your english is a little confusing.
EDIT AFTER Rephrase:
I understood your aim now and you are right, submit button sends only form fields and <a> tag is not a form field.
If you want to append all form fields to <a> tag click then you have few options.
Append all parameters on server side manually on render:
You have
foreach ($alphabet as $abc){
if ($abc == $letter) {
$class = 'current';
}
else $class = '';
echo '<a class="'.$class.'" href="'.$page->url.'?letter='.$abc.'">'.$abc.'</a> ';
}
And you need to additionally add form fields as well, I assume on first time click when none of the tags are rendered (no <a> tag on the screen) then you just send the form data, in tha moment you catch form data from $_GET and append to anchor
foreach ($alphabet as $abc){
if ($abc == $letter) {
$class = 'current';
}
else $class = '';
echo '<a class="'.$class.'" href="'.$page->url.'?letter='.$abc.'otherParamName='.$_GET['otherParam']].'">'.$abc.'</a> ';
}
You can use js, to collect form data, I guess you use jQuery, and append to the href on click of the anchor
jQuery('a.someClassIdentifier').click(fuction(e) {
// Please read documentation of jquery how to handle click events, I dont remember it out of my head right now.
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
But as an ultimate answer I would say rethink your approach. If you have already a form, and it sends GET request to the endpoint and it returns the same page where tags are visible then you can use form fields instead of anchor tags, that would already handle the data sending for you. But if you have different endpoints for tags receiving then best will be to send ajax request to receive only json data and render them without refreshing the page.
Hope it helps.

Appending and substracting divs filled with data from one simple form to a form that contains all the divs grouped and ready to POST

So this is the deal:
I have an order page and I use two forms.
The first form contains input data for ONE order item and when I press OK I will pass the form's input data to javascript through onsubmit=send_item_data(this) and at the end i will return false; in send_item_data function so it doesn't get posted.
In the second one I want to append/substract the former data in div groups (so I can add more or delete them easily) but I can't think (or find) of a solution that puts in group the data from the first form in one div and appends that child div to the second form.
In the end, by the push of a button, the second form will post all the divs' data and I will handle it with PHP backend code.
Code body:
<form action="" id="first_form" method="post" onsubmit="return send_item_data(this)">
<div id="Select_list">
<select blah blah>
---bunch of options---
</select>
</div>
<div id="extras">
---Some extras that you can choose by a checkbox input (I generate it via PHP)---
example:
<input name="checkbox[<?php echo $row['column_data_from_query']?>]" type="checkbox" value="checked">
</div>
--->Possibly two more input fields here<---
<input type="button" value="clear" onclick="clear_form()">
<input type="submit" value="OK">
</form>
<form action="" id="finalize_order_form" method="post">
--->This is the second form<---
--->In here I want to put the data from the first form so i can handle them by group<---
if I click OK three times in the first form there should be three groups here that contain each form's data
<input type="submit" class="button" value="Finallize order"/>
</form>
I mainly use PHP Mysql and Javascript (including AJAX, not jQuery).
So you want to have the order items listed in the second form like a pre-checkout shopping cart. If you use divs for that, they will not be submitted with the POST data to the server - they will be display-only. So you need to follow Robert's advice and save the 1st form's data to the DB each time an item is added/removed (in addition to his other reasons like not losing a customer's session info). That way the DB will already be up-to-date when they click Confirm Order. Or else you need to hook the Confirm Order button to a JS function that converts the divs back to JSON and posts that to the server to be stored in the DB.
As far as creating the display-only div from the 1st form's data, your send_item_data function needs to loop over all the form's inputs, get their values, and add them to the div however you want them to be displayed. Then you can just insert the div into the second form. Since you are passing "this" to the function, which is the form object itself, you can get the inputs via something like:
var inputs = this.getElementsByTagName("input");
for(var i = 0; i < inputs.length; i++) {
if(inputs[i].type == 'submit') continue; //ignore the Submit button
var name = inputs[i].name, value = inputs[i].value;
---use the name and value of this input to construct a span or something to insert inside your div---
}
---now you can insert the div into the 2nd form---

use php session to list multiple form input

I am new to php. How can I use session to remember my multiple form input like this:
In the first webpage, I can input for example a product name, when I click submit, the second page can tell me the product name I typed in. AND, if I go back to the first page again, and input another product name, and click submit, the second page can display the first product and the new product. If I input more product names continuously in this way, I can see all products listed in the second page.
How can I use session to do this?
First page (order.html):
<html><body>
<h4>Order Form</h4>
<form action="showorder.php" method="post">
Product name: <input name="prodname" type="text" />
<input type="submit" />
</form>
</body></html>
Second page (showorder.php):
<html><body>
<?php
$Pname = $_POST['prodname'];
echo "You ordered ". $Pname . ".<br />";
?>
</body></html>
You can use the $_SESSION array in the following fashion:
$_SESSION['products'][] = $_POST['prodname'];
That means that $_SESSION['products'] will be an array containing all the purchased products.
Don't forget to call session_start() in the beginning of all relevant pages, and filter your code against SQL injections and such.
session_start();
$_SESSION['everthing'] = $_POST['username'];
Then you can echo out the session, or just assign a variable to it. Sessions will stay there until the browser is closed

Catching button presses from many rows (Shopping Cart) with JQuery

I'm coding a shopping cart type functionality where I am querying a database for a number of items (SKU, qty, name) in an $(.ajax) call. I'd like to display a table with all the items that match what the user is looking for, with the option where the user can specify a quantity desired. They can then click an 'Add' to add their selection to a "cart".
Here's a simplified example:
<table>
<tr><td>Item A</td><td>SKU: 001</td><td>Qty: <input name="qty-sku001"> <input type="button" value="Add"></td></tr>
<tr><td>Item B</td><td>SKU: 002</td><td>Qty: <input name="qty-sku002"> <input type="button" value="Add"></td></tr>
<tr><td>Item C</td><td>SKU: 003</td><td>Qty: <input name="qty-sku003"> <input type="button" value="Add"></td></tr>
</table>
What is the ideal way to get information from just one row, when it's button is clicked?
I was thinking of adding an onclick="AddToCart(x);" to each button, but that'd just pass in an HTML Form Element object. Do I need to make each row it's own form, or can I get the button's parent TR and then grab the values from that row's input and other elements?
The data will end up being appended to a "Cart" div's table, so I'll need the three pieces of data I loaded in from my ajax call. I suppose I can add hidden elements to each row, but there must be a more efficient and graceful solution.
Thanks!
assuming that you use jQuery, you can use this:
$("input[type=button]").click(function(evn){
var rowName = $(this).prev().attr('name'); // this will give you the name attribute of element that is before the button in the DOM
// do here whatever you need with rowName
});
edit
you can add a class to buttons to prevent running this code for all buttons on your page like this:
<input class="row-button" type="button" value="Add">
and use this javascript:
$(".row-button").click(function(evn){
// the code from above
}
$("input:button").click(function(){var $tr = $(this).closest('tr');});
$tr is the jquery row object that a button has been clicked

HTML form insert in SQL DB and also pass posted vars to page

I have come across a situation I am not sure how to hndle. I am new to this, but I do understand the server side realm of php vs user side of the browser.. I just dont know how to accomplish what I want to do..
I have a form on a page where a user can enroll in a school course. They select the course type, location, date, and payment type.
On submit it goes to an outsourced shopping cart for payment, which uses PHP vars to populate the item description, price, ect.. along with our store id and other pertinent information.
I ALSO need to insert some of the PHP vars into the user database.
I tried having the form action go to another PHP page which process the DB entry then redirects to the cart, but when I get to the cart an error is generated saying the info was not submitted properly.. but the DB entry was successful.
I also tried using an include(dbentry.php) in the form action with the cart link.. this generates a server side error on loading the page.
At one point I successfully had it create a db entry (although it was blank) AND successfully redirect to the cart with all of the vars there, but a blank DB entry does me no good. I am assuming entry happened before the $POST vars were created... I also have changed so much I dont remember how I did it and cannot reproduce that..
My main question is:
How can I have a user fill out an HTML form, and when submitted perform the DB entry with the $POST vars while also directly passing the $POST vars to the cart page? Normally I would run the dbentry.php on the next page, but I have no access to scripting on the outsourced cart page...
You can try to use hidden textboxes to hold the values of the form! And this value can be accessed from different php pages
You will need to pass your variables from page1.php to page2.php to outsourced cart. I would do something like the following:
What the below code is doing:
Send original form data using POST to page2.php
Page2.php will then read the POST data (you can now do what you want with this data, whether it be store it into a database, etc.). A Javascript snippet will then submit the form to your checkout cart page (page3.php) with the necessary POST variables which are being stored as hidden fields within the form.
Page1.php
<form action="page2.php">
<input type="text" name="myfield1"/>
<input type="text" name="myfield2"/>
<input type="text" name="myfield3"/>
<input type="hidden" name="myfield4"/>
<input type="hidden" name="myfield5"/>
<input type="hidden" name="myfield6"/>
<input type="hidden" name="myfield7"/>
<input type="hidden" name="myfield8"/>
</form>
page2.php
<?php
if(isset($_POST['myfield1']))
{
$myfield1 = $_POST['myfield1'];
}
// do the above for all of the fields, use the data to query database with.
// Perform database operations here
?>
<form action='Page3.php' method='post' name='frm'>
<?php
foreach ($_POST as $a => $b) {
echo "<input type='hidden' name='".$a."' value='".$b."'>";
}
?>
</form>
<!-- Script to submit button -->
<script language="JavaScript">
document.frm.submit();
</script>

Categories