Develop Reference

Magento 2 - How can I change the quantity of a product (on product page) with php or js?

I am looking for a way to change the value of the quantity box from the code in stead of manually changing it on the product page.
$Uitkomst has to be in the input once the form is submitted.
I haven't been able to find the answer to my problem so any help at all would be much appreciated.
Thanks in advance.
the value which I need in the qty input comes from this form:
<form action="?" method="POST">
<table>
<tr>
<td>
<input name="breedte" type="text" maxlength="40" placeholder="Breedte (in millimeters)" required>
</td>
</tr>
<tr>
<td>
<input name="lengte" type="text" maxlength="40" placeholder="Lengte (in millimeters)" required>
</td>
</tr>
<tr>
<td>
<input type="submit" value="Toevoegen aan winkelwagen">
</td>
</tr>
</table>
</form>
<?php
if (isset($_POST["lengte"]))
{
$Lengte = $_POST["lengte"];
$Breedte = $_POST["breedte"];
$Uitkomst = $Lengte * $Breedte;
echo $Uitkomst;
}
?>
<div class="control">
<input
name="qty"
id="qty"
value="<?= block->getProductDefaultQty() *
1 ?>"
title="<?= $block->escapeHtmlAttr(__('Qty')) ?>"
class="input-text qty"
/>
</div>

Changed the answer also abit.
It does not refresh the page, is that what you need?
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form onsubmit="event.preventDefault();fillQty();" id="form_id">
<table>
<tr>
<td>
<input name="breedte" type="text" maxlength="40" placeholder="Breedte (in millimeters)" required>
</td>
</tr>
<tr>
<td>
<input name="lengte" type="text" maxlength="40" placeholder="Lengte (in millimeters)" required>
</td>
</tr>
<tr>
<td>
<input type="submit" value="Toevoegen aan winkelwagen">
</td>
</tr>
</table>
</form>
<div class="control">
<input
type="text"
name="qty"
id="qty"
value="<?= block->getProductDefaultQty() *
1 ?>"
title="<?= $block->escapeHtmlAttr(__('Qty')) ?>"
class="input-text qty"
/>
</div>
<script>
function fillQty() {
$('#qty').val($('input[name="breedte"]').val() * $('input[name="lengte"]').val());
return false;
};
</script>

I have found the solution to my problem,
in a CustomForm.phtml file I put
<?php
/**
* Copyright © Magento, Inc. All rights reserved.
* See COPYING.txt for license details.
*/
/** #var $block \Magento\Catalog\Block\Product\View */
?>
<?php $_helper = $this->helper('Magento\Catalog\Helper\Output');?>
<?php $_product = $block->getProduct(); ?>
<div>
<div class="CalculatorForm">
<form onsubmit="event.preventDefault();fillQty();" id="form_id">
<table>
<tr>
<td>
<input name="breedte" type="number" maxlength="40" placeholder="Breedte (in millimeters)" required>
</td>
</tr>
<tr>
<td>
<input name="lengte" type="number" maxlength="40" placeholder="Lengte (in millimeters)" required>
</td>
</tr>
<tr>
<td>
<input type="submit" value="Bereken prijs">
</td>
</tr>
</table>
</form>
<div class="field qty">
<!--<?php #if ($block->shouldRenderQuantity()) :?>-->
<label class="label" for="qty"><span><?= $block->escapeHtml(__('Qty')) ?></span></label>
<div class="control">
<input type="number"
name="qty"
id="qty"
min="0"
value="<?= $block->getProductDefaultQty() * 1 ?>"
title="<?= $block->escapeHtmlAttr(__('Qty')) ?>"
class="input-text qty"
data-validate="<?= $block->escapeHtmlAttr(json_encode($block->getQuantityValidators())) ?>"
/>
</div>
<?php #endif; ?>
<script>
function fillQty(){
$('#qty').val($('input[name="breedte"]').val() * $('input[name="lengte"]').val());
return false;};
</script>
</div>
</div>
</div>
and in the original addtocart.phtml I put
<?php
/**
* Copyright © Magento, Inc. All rights reserved.
* See COPYING.txt for license details.
*/
/** #var $block \Magento\Catalog\Block\Product\View */
?>
<?php $_helper = $this->helper('Magento\Catalog\Helper\Output');?>
<?php $_product = $block->getProduct();?>
<?php $_product = $block->getProduct(); ?>
<?php $buttonTitle = __('Add to Cart'); ?>
<?php if ($_product->isSaleable()) :?>
<div class="box-tocart">
<div class="fieldset">
<div class="control">
<?php if ($block->shouldRenderQuantity()) :?>
<input type="number"
name="qty"
id="qty"
min="0"
value="<?= $block->getProductDefaultQty() * 1 ?>"
title="<?= $block->escapeHtmlAttr(__('Qty')) ?>"
class="input-text qty"
data-validate="<?= $block->escapeHtmlAttr(json_encode($block->getQuantityValidators())) ?>"
/>
<?php endif ?>
</div>
<div class="actions">
<button
type="submit"
title="<?= $block->escapeHtmlAttr($buttonTitle) ?>"
class="action primary tocart"
id="product-addtocart-button">
<span>
<?= $block->escapeHtml($buttonTitle) ?>
</span>
</button>
<?= $block->getChildHtml('', true) ?>
</div>
<?php endif; ?>
<script type="text/x-magento-init">
{
"#product_addtocart_form": {
"Magento_Catalog/js/validate-product": {}
}
</script>
</div>
</div>
I also put <script src="{{MEDIA_URL}}jQuery-3.3.1.js?v=1.x"></script> in the html head in the magento backend.
this solved my problem. thanks everyone.

Getting user inputs from HTML form

I want to be able to get the inputs that a user enters in my HTML form and be able to print them later on my website. I would love to be able to print all the user info with the selections they have made to there pizzas. I have been trying for the last few hours to do this and no luck :( Looking to get the date, first name, last name, address and phone.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Daves Pizza</title>
<link href="new.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="pizza.js"></script>
</head>
<body>
<div align="center">
<h5>Today is: <span id="dtfield"></span></h5>
</div>
<br>
<div align="center">
<h1>Dave's Pizza Place</h1>
</div>
<div align="center">
<div class="user">
<form id="contact_form" action="mailto: david.genge#edu.sait.ca" name="userInfo" method="POST" enctype="text">
<br>
<div>
<label for="datetime">Date:</label>
<input type="date" name="user_date" />
</div>
<div>
<label for="firstname">Firstname:</label>
<input type="text" pattern="[A-Za-z-']+" name="firstname" value="Firstname" maxlength="20"/>
</div>
<div>
<label for="lastname">Lastname:</label>
<input type="text" pattern="[A-Za-z-']+" name="lastname" placeholder="Lastname" maxlength="20"/>
</div>
<div>
<label for="mail">Address:</label>
<input type="text" name="user_mail" placeholder="Full Address"/>
</div>
<div>
<label for="tel">Phone#:</label>
<input type="tel" pattern="[0-9]+"" name="user_phone" placeholder="(403)123-1234"/>
</div>
</form>
</div>
</div>
<div align="center">
<div class="pizza">
<form name="costEstimation">
<table border="0">
<tr valign="middle">
<td>
<br>
<b>Choose Your Pizza Type<b><br>
<input type="radio" name="pizzasize" value="8" checked>Small $8<br>
<input type="radio" name="pizzasize" value="10">Medium $10<br>
<input type="radio" name="pizzasize" value="15">Large $15<br>
<input type="radio" name="pizzasize" value="18">Extra Large $18<br></td>
<td></td>
</tr>
<tr>
<td>
<b>Specialities<b><br>
<input type="radio" name="special" value="3">Super Cheesy $3<br>
<input type="radio" name="special" value="5">Extra Meaty $5<br>
<input type="radio" name="special" value="2">Really Veggie $2<br></td>
<td>
<b>Extra Toppings </b>
<br>
<input type="checkbox" name="cheese" value="1.5">Extra Cheese $1.50<br>
<input type="checkbox" name="pepperoni" value="1.5">Pepperoni $1.50<br>
<input type="checkbox" name="mushrooms" value="1.5">Mushrooms $1.50<br>
<input type="checkbox" name="bacon" value="1.5">Bacon $1.50<br>
<input type="checkbox" name="olives" value="1.5">Olives $1.50<br>
</td>
</tr>
</table>
</form>
<h2>Pizza Cost: </h2><h2><span id="result"></span></h2>
<input type=button value="Price Your Pizza" onClick="pizza(); return false;">
<button type="submit">Send your message</button>
<br><br><br>
<table>
<tr>
<td>
<figure>
<center>
<img src="cheese.jpg" alt="cheese" height="100" width="100">
</center>
</figure>
</td>
<td>
<figure>
<center>
<img src="veg.jpg" alt="veg" height="100" width="100">
</center>
</figure>
</td>
<td>
<figure>
<center>
<img src="meat.jpg" alt="meat" height="100" width="100">
</center>
</figure>
</td>
</tr>
</table>
</div>
<br>
<br>
<br>
</div>
</body>
</html>

You need to use form for saving the input values entered by user. you can do it by either GET or POST method. here is the sample demo with Validation:
<!DOCTYPE HTML>
<html>
<head>
<style>
.error {color: #FF0000;}
</style>
</head>
<body>
<?php
// define variables and set to empty values
$nameErr = $emailErr = $genderErr = $websiteErr = "";
$name = $email = $gender = $comment = $website = "";
if ($_SERVER["REQUEST_METHOD"] == "POST") {
if (empty($_POST["name"])) {
$nameErr = "Name is required";
} else {
$name = test_input($_POST["name"]);
// check if name only contains letters and whitespace
if (!preg_match("/^[a-zA-Z ]*$/",$name)) {
$nameErr = "Only letters and white space allowed";
}
}
if (empty($_POST["email"])) {
$emailErr = "Email is required";
} else {
$email = test_input($_POST["email"]);
// check if e-mail address is well-formed
if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
$emailErr = "Invalid email format";
}
}
if (empty($_POST["website"])) {
$website = "";
} else {
$website = test_input($_POST["website"]);
// check if URL address syntax is valid (this regular expression also allows dashes in the URL)
if (!preg_match("/\b(?:(?:https?|ftp):\/\/|www\.)[-a-z0-9+&##\/%?=~_|!:,.;]*[-a-z0-9+&##\/%=~_|]/i",$website)) {
$websiteErr = "Invalid URL";
}
}
if (empty($_POST["comment"])) {
$comment = "";
} else {
$comment = test_input($_POST["comment"]);
}
if (empty($_POST["gender"])) {
$genderErr = "Gender is required";
} else {
$gender = test_input($_POST["gender"]);
}
}
function test_input($data) {
$data = trim($data);
$data = stripslashes($data);
$data = htmlspecialchars($data);
return $data;
}
?>
<h2>PHP Form Validation Example</h2>
<p><span class="error">* required field.</span></p>
<form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">
Name: <input type="text" name="name" value="<?php echo $name;?>">
<span class="error">* <?php echo $nameErr;?></span>
<br><br>
E-mail: <input type="text" name="email" value="<?php echo $email;?>">
<span class="error">* <?php echo $emailErr;?></span>
<br><br>
Website: <input type="text" name="website" value="<?php echo $website;?>">
<span class="error"><?php echo $websiteErr;?></span>
<br><br>
Comment: <textarea name="comment" rows="5" cols="40"><?php echo $comment;?></textarea>
<br><br>
Gender:
<input type="radio" name="gender" <?php if (isset($gender) && $gender=="female") echo "checked";?> value="female">Female
<input type="radio" name="gender" <?php if (isset($gender) && $gender=="male") echo "checked";?> value="male">Male
<span class="error">* <?php echo $genderErr;?></span>
<br><br>
<input type="submit" name="submit" value="Submit">
</form>
<?php
echo "<h2>Your Input:</h2>";
echo $name;
echo "<br>";
echo $email;
echo "<br>";
echo $website;
echo "<br>";
echo $comment;
echo "<br>";
echo $gender;
?>

you need to use any server side language to get input from user.
Use this statement
<form method="GET or POST" action="file_location/file_name(on which you want to get input)">
Php is very simple language you can learn it easly
i am giving you an example:
index.html
<form method="GET" action="localhost://getdata.php">
<input type="text" name="UserName" />
<input type="button" value="Submit" />
</form>
Focus on name tag i used in input statement "UserName" your data will be send by binding user input in it and then you can display data using php with this name as showing below
getdata.php
<?php
echo "$_GET['UserName']";
?>

if you want to get the data using javascript then,
HTML:
<input type="text" name="name" id="uniqueID" value="value" />
<span id="output"></span>
JS:
var nameValue = document.getElementById("uniqueID").value;
document.getElementById("output").innerHTML=nameValue;
will work for you !

PHP - How can I get the name from input type hidden and $_POST to another php?

I wish can pass the value of getvenueurl to another php named map.php .
I use input type hidden to to echo in current page:
<input type="hidden" name="getvenueurl" value="<?php echo $show_venue['url']; ?>"/>
and I wish when i click the button <a href="map.php" target="_blank"><input type="button" class="button" value="MAP" style="width:100px;"> in map.php show the correct value of getvenueurl.
In current page:
<?php
$read_venue = mysql_query("select * from venue where theme_name = '$title'");
while($show_venue = mysql_fetch_array($read_venue))
{
?>
<form method="post" action="#tab5">
<center><table border="1" class="venuetb">
<tr>
<input type="hidden" name="getvenue" value="<?php echo $show_venue['venue']; ?>"/>
<input type="hidden" name="getvenueprice" value="<?php echo $show_venue['price']; ?>"/>
<input type="hidden" name="getvenueurl" value="<?php echo $show_venue['url']; ?>"/>
<td style="width:20%;"><center><div class="imgvenue"><img src="<?php echo 'venueimg/'.$show_venue['venueimg']; ?>" /></div></center></td>
<td ><center><div class="bine"><?php echo $show_venue['venue']; ?> - RM <?php echo $show_venue['price']; ?></div></center></br>
<div class="dv"><p> <b>Address : </b><?php echo $show_venue['address']; ?></p>
<p> <b>Detail : </b><?php echo $show_venue['detail']; ?></p>
<b> Contact No: </b><?php echo $show_venue['contact']; ?></div>
</td>
<td style="width:20%;">
<center><input type="button" class="button" value="MAP" style="width:100px;">
<input type="submit" class="button" style="width:100px;" value="CHOOSE" name="choose_venue"></center>
</td>
</tr>
</table></center><br>
</form>
<?php
$_SESSION['theurl'] = $show_venue['url'];
}
?>
<?php
if(isset($_POST['choose_venue']))
{
$getvenue = $_POST['getvenue'];
$getvenueprice = $_POST['getvenueprice'];
$savevenue = mysql_query("insert into selectvenue(user,title,venuename,venueprice) values('$username','$title','$getvenue','$getvenueprice')");
if($savevenue)
{
echo"<center>$getvenue save.</center>";
}
else
{
echo "Failed.";
}
}
?>
</div>
I have try to use session to pass the value of getvenueurl but seen it is failed, because it will only show the last column value for all output that in while loop.
In map.php:
<table class="mapping">
<tr>
<td>
<?php
$theurl = $_SESSION['theurl'];
echo $theurl;?>
</td>
</tr>
</table>
How can I get the correct value to my map.php ?

u can pass value through anchor tag this way..i hope this will help u.
<input type="button" class="button" value="MAP" style="width:100px;">

Instead of
<input type="button" class="button" value="MAP" style="width:100px;">
write this code
<input type="button" class="button" onclick="submit_to_map()" value="MAP" style="width:100px;">
Then place this javascript code on the page.
<script type="text/javascript">
function submit_to_map() {
var form = document.getElementById("form-id");
form.action = "map.php";
form.submit();
}
</script>
Then you can get the value of all elements with $_POST[] inside the form from map.php. Hope this will help you

Confirm you have <?php session_start(); ?> on beginning of each page !

div hide and show inside PHP from checkbox

I have button click event in html page where I am calling a PHP file. inside the php I have two div where I want to show hide according to the check box I have ...
now it shows two check box and the show div. but i want load the show div only if user checks the first check box how can i achieve this? pls help.here the PHP Code
<div id="dialog_title">
<input type="checkbox" name="First" value="First">
First List<br>
<input type="checkbox" name="Second" value="Second">Second
</div>
<div id="Show div">
<table>
<tr>
<th> Name </th>
<th> Address </th>
</tr>
<?php
foreach ( $deviceArr as $device) {
$id = $device['id'];
$name = $device ['name'];
$Address = $device['address'];
?>
<tr class="font1">
<td> <input type="text" class="g_input_text" name="name[]" value="<?php echo $name; ?>" /> </td>
<td>
<input type="text" class="g_input_text" name="address[]" value="<?php echo $Address; ?>" />
<input type="hidden" name="id[]" value="<?php echo $id; ?>" />
</td>
</tr>
<?php
}
?>
</table>
</div>

When the page is loaded hide the show div i named first_list_bx and give an id as first_chk_bx to first check box like:
<input type="checkbox" name="First" value="First" id="first_chk_bx">
<div id="first_list_bx" style="display:none;">
//code
</div>
Then use jquery for detecting checkin of checkbox and show the first_list_bx like:
$('#first_chk_bx').click(function() {
if($(this).is(":checked")){
$("#first_list_bx").show();
}
else{
$("#first_list_bx").hide();
}
});

This is what you expecting?
$(document).ready(function() {
$('#Show').hide();
$("input[name=First]").click(function () {
$('#Show').toggle();
});
});
It's done in JQuery. Find Demo
Note: Change <div id="Show div"> to <div id="Show">

as you tagged your question with javascript try this js function in your html like this
HTML
<div id="dialog_title">
<input type="checkbox" name="First" value="First" onclick="javascript:show_hide(this, 'Show_div')">
First List<br>
<input type="checkbox" name="Second" value="Second">Second
</div>
<div id="Show_div" style="display:none">
<table>
<tr>
<th> Name </th>
<th> Address </th>
</tr>
<?php
foreach ( $deviceArr as $device) {
$id = $device['id'];
$name = $device ['name'];
$Address = $device['address'];
?>
<tr class="font1">
<td> <input type="text" class="g_input_text" name="name[]" value="<?php echo $name; ?>" /> </td>
<td>
<input type="text" class="g_input_text" name="address[]" value="<?php echo $Address; ?>" />
<input type="hidden" name="id[]" value="<?php echo $id; ?>" />
</td>
</tr>
<?php
}
?>
</table>
</div>
JAVASCRIPT
<script>
function show_hide(my_obj, id)
{
var chk = my_obj.checked;
if(chk===true)
{
document.getElementById(id).style.display="block";
}
else
{
document.getElementById(id).style.display="none";
}
}
</script>

Javascript list.js to this php code

I love this script list.js from www.listjs.com. It seems to be the perfect fit for searching and filtering the output of a php file below, but I just can get it to work, I only need to add 7 or so lines of code but its not working. Can anyone tell me how come? Thanks
The code that I added is highlighted
<?php
defined('_JEXEC') or die();
?>
**<script type="text/javascript" src="list.js"></script>**
<form action="<?php echo CRoute::getURI(); ?>" method="post" id="jomsForm" name="jomsForm" class="community-form-validate">
<div class="jsProfileType" **id="jsProfileType"**>
**<input class="search" placeholder="Search" />
<button class="sort" data-sort="label">
Sort
</button>**
<ul class="unstyled">
<?php
foreach($profileTypes as $profile)
{
?>
<li class="space-12">
<label for="profile-<?php echo $profile->id;?>" class="radio">
<input id="profile-<?php echo $profile->id;?>" type="radio" value="<?php echo $profile->id;?>" name="profileType" <?php echo $default == $profile->id ? ' disabled CHECKED' :'';?> />
<strong class="bold"><?php echo $profile->name;?></strong>
</label>
<?php if( $profile->approvals ){?>
<span class="help-block"><?php echo JText::_('COM_COMMUNITY_REQUIRE_APPROVAL');?></span>
<?php } ?>
<span class="help-block">
<?php
$profile->description = JHTML::_('content.prepare',$profile->description);
echo $profile->description;?>
</span>
<?php if( $default == $profile->id ){?>
<em><?php echo JText::_('COM_COMMUNITY_ALREADY_USING_THIS_PROFILE_TYPE');?></em>
<?php } ?>
</li>
<?php
}
?>
</ul>
</div>
<?php if( (count($profileTypes) == 1 && $profileTypes[0]->id != $default) || count($profileTypes) > 1 ){?>
<div style="margin-top: 5px;">
<?php if( $showNotice ){ ?>
<span style="color: red;font-weight:700;"><?php echo JText::_('COM_COMMUNITY_NOTE');?>:</span>
<span><?php echo $message;?></span>
<?php } ?>
</div>
**<script>
var options = {
list: "space-12"
};
var userList = new List('jsProfileType', options);
</script>**
<table class="ccontentTable paramlist" cellspacing="1" cellpadding="0">
<tbody>
<tr>
<td class="paramlist_key" style="text-align:left">
<div id="cwin-wait" style="display:none;"></div>
<input class="btn btn-primary validateSubmit" type="submit" id="btnSubmit" value="<?php echo JText::_('COM_COMMUNITY_NEXT'); ?>" name="submit">
</td>
<td class="paramlist_value">
</td>
</tr>
</tbody>
</table>
<?php } ?>
<input type="hidden" name="id" value="0" />
<input type="hidden" name="gid" value="0" />
<input type="hidden" id="authenticate" name="authenticate" value="0" />
<input type="hidden" id="authkey" name="authkey" value="" />
</form>

I don't know PHP, but I have seen this error before when I used list.js in my own project. It turned out I didn't define things properly.
You did set up a div with a proper id, but you seem to be missing a 'list' class. Try changing
<ul class="unstyled">
to
<ul class="list">
Second, I don't think that 'list' is a supported keyword in options (at least not in the most recent list.js version). Try changing your options definition to
var options = {
valueNames: [ 'space-12' ]
};
Third, if you want search to work change
<button class="sort" data-sort="label">
to
<button class="sort" data-sort="space-12">