how put put dynamically populated number into input value field - html

I have dynamically populated value coming from an external js file. The value is working just fine when I call it in the HTML page but I'm stuck on how to have an input field display this value.
Here is my HTML:
<form action="../mail.php" method="POST" class="location-form">
<div class="device-details">
<h2>Device: iPhone5</h2>
<h2>Repair Cost: <span id="result">0</span></h2>
</div>
<input name="device" type="hidden" id="device" value="iPhone5" maxlength="20">
<input name="cost" type="hidden" id="cost" value="" maxlength="20">
<div class="submit-btn">
<input type="submit" value="Submit Request" />
</div>
</form>
<script>
document.getElementById("result").innerHTML = localStorage.getItem("sum");
</script>
at the top, in the div "device-details", the h2 "repair cost" is populating the value just fine, no issues. But I cannot seem to populate the last input with this value.
<input name="cost" type="hidden" id="cost" value="(need the value here)" maxlength="20">
I need the value of the input field to mimic the value of the repair cost at the top in order to send that value to an email address.
I've tried inserting the following into the value and it didn't work
value="<span id='result'>0</span>"
I've tried creating a variable in php and then putting the variable into the value field, and it did not work
<?php
$my_var = '<span id="result">0</span>';
?>
value="<?php echo '$my_var'); ?>"
I've also tried:
value="<?php echo htmlspecialchars($my_var); ?>"
these last two just returned the actual HTML code
<span id="result"></span>
instead of the populated value.

Try this one.
<!DOCTYPE html>
<html>
<body onload="abc()">
<form action="../mail.php" method="POST" class="location-form">
<div class="device-details">
<h2>Device: iPhone5</h2>
<h2>Repair Cost: <span id="result">0</span></h2>
</div>
<input name="device" type="hidden" id="device" value="iPhone5" maxlength="20">
<input name="cost" type="hidden" id="cost" value="" maxlength="20">
<div class="submit-btn">
<input type="submit" value="Submit Request" />
</div>
</form>
<script>
function abc(){
document.getElementById("result").innerHTML=localStorage.getItem("sum");
document.getElementById("cost").value = localStorage.getItem("sum");
}
</script>
</body>
</html>

Related

Extract form value from HTML and send it with HTML form POST

First, I am trying to extract the username that is stored in the page source when the different user loads the page that contains the below book now button. So username changes for each user. Second, when the book now is pressed I want to send that username as the corresponding value to name="user[name]".
I can successfully extract the username that is loaded in the page source but having trouble to send it as a variable username value through the html post method.
I know I am doing something or everything wrong :) so any help is much appreciated.
Best.
<!DOCTYPE html>
<html>
<head>
<title>
HTML DOM Input Text value Property
</title>
</head>
<body style="text-align:center;">
<h2>Extracted User</h2>
<input type="text" name="Username" id="Username" autocomplete="off" value="yardicafe+emaartest#gmail.com" style="display:none;">
<p id="username"></p>
<!-- Script to return the Input Text value Property-->
<script>
let txt = document.getElementById("Username").value;
document.getElementById("username").innerHTML = txt;
</script>
<form method="post" action="https://www.supersaas.com/api/users">
<input type="hidden" name="account" value="vavevu"/>
<input type="hidden" name="id" value="1234fk"/> <!-- The user has ID 1234 on your server's database -->
<input type="text" name="user[name]" value="??????"/>
<input type="hidden" name="user[full_name]" value=""/>
<input type="hidden" name="user[email]" value="yardicafe+emaartest#gmail.com"/>
<input type="hidden" name="user[phone]" value=""/>
<input type="hidden" name="user[address]" value=""/>
<!-- you can add and remove fields on the "Access Control" screen -->
<input type="hidden" name="checksum" value="d14c0e6398ef11a9a34cf513060e45a8"/>
<input type="hidden" name="after" value="Scuba_Dalis"/>
<input type="submit" value="Book now"/>
</form>
</body>
</html>

Using Multiple Form in One HTML page,and get object of both form in angularjs

My html code is
<div>
<div>
<form name="form 1" ng-submit="submitForm1()">
<input type="text" required name="text1">
</form>
</div
<div>
<form name="form 2" ng-submit="submitForm2()">
<input type="text" required name="text2">
</form>
</div>
</div>
and in my controller i am accessing the form using scope.controller looks like
$scope.submitFrom1 = function(){
console.log(form1);
}
$scope.submitFrom2 = function(){
console.log(form2);
}
but in result first form will give object and second form is returning undefined
I am getting why this is happening.
You have to use ngModel for the fields inside each form to access data.
https://docs.angularjs.org/api/ng/directive/ngModel
<form name="firstForm" ng-submit="submitForm1()">
<input type="text" required name="text1" ng-model="firstForm.text1>
</form>
<form name="secondForm" ng-submit="submitForm2()">
<input type="text" required name="text1" ng-model="secondForm.text1>
</form>
In controller
$scope.firstForm.text1 to access the data from first form individually.
$scope.secondForm.text1 to access the data from second form individually.
To get full form object just use.
$scope.firstForm;
$scope.secondForm;
Remove the spaces from the form names.
<!-- remove spaces from form name
<form name="form 1" ng-submit="submitForm1()">
-->
<form name="form1" ng-submit="submitForm1()">
<input type="text" required name="text1" ng-model="a">
</form>
<!-- remove spaces from form name
<form name="form 2" ng-submit="submitForm2()">
-->
<form name="form2" ng-submit="submitForm2()">
<input type="text" required name="text2" ng-model="b">
</form>
It was causing $parse errors.
The DEMO on JSFiddle

add parameters to form url before submit

I need to add a path to a file to the form url before submitting. I created therefore a text field and want to add the text to the url without php.
can somebody help?
the existing code:
<form action="http://127.0.0.1:8080/WebService1/HTTPMethod_1?new_value=value" method="post">
<input type="text" value="" size="30" name="filename">
<input type="submit" name="submit" value="Submit" class="continue-button">
</form>
look into using hidden input fields. these allow you to send form data, but not necessarily show a form field.
for instance:
<script type="text/javascript">
function setFormAction() {
document.myForm.action = document.getElementById("url").value;
}
</script>
<form name="myForm" method="POST" action="default.php">
<input type="value" name="url" id="url" />
<input type="submit" name="submit" onclick="setFormAction();" />
</form>

Can't type in textarea [duplicate]

I need help. My form in my page looks like below however when I click on the text box the cursor won't appear and I can't type
<form name="input" action="postblog.php?name=<?PHP echo ($_GET['name']); ?>" method="post">
Post: <input type="text" name="text2">
<input type="submit" value="Submit">
</form>
There's probably an error that's not being displayed on your screen because it's appearing inside the HTML tags. Make sure to check if $_GET['name'] is set first:
<form name="input" action="postblog.php?name=<?php echo ($_GET && isset($_GET['name'])) ? $_GET['name'] : 'No_Name_Value_From_GET'; ?>" method="post">
Post: <input type="text" name="text2" />
<input type="submit" value="Submit" />
</form>
In this instance, if $_GET['name'] is not set, the value for ?name= will be No_Name_Value_From_GET (but you can change it to whatever you want).
HTH... :)

mysql 404 error

have the following code:
<?php
if (isset($_POST['submitted'])) {
$reqwidth = $_POST['reqwidth'];
$reqside = $_POST['reqside'];
$reqrad = $_POST['reqrad'];
$sqlinsert = "INSERT INTO tirelist (width, sidewall, radial) VALUES ('$reqwidth','$reqside', '$reqrad')";
if (!mysqli_query($dbcon, $sqlinsert)) {
die('error inserting new record');
}
$newrecord = "1 record added to database";
}
?>
<html>
<head>
<title>Request Tire Size</title>
</head>
<body>
<h1>Request Tire Size</h1>
<form method="post" action="insert-data.php">
<input type="hidden" name="submitted" value="true" />
<fieldset>
<legend>Request Tire</legend>
<label>Tire Width: <input type="text" name="reqwidth" /></label>
<label>Tire Sidewall: <input type="text" name="reqside" /></label>
<label>Tire Radial: <input type="text" name="reqrad" /></label>
</fieldset>
<br />
<input type="submit" value="Send Order Request" />
</form>
when i click send order request, I get a 404 error.
i noticed the page is called ~http://localhost/index.php?p=test2~, but when i click it redirects me to ~http://localhost/insert-data.php~
been trying for hours, wondering what i could do to fix it
Change
<form method="post" action="insert-data.php">
to have index.php?p=test2 instead.
In your form, you reference insert-data.php. Does that exist?
If you're trying to submit the form to the same file, you can try to use this:
<form method="post" action="<?php echo $_SERVER['PHP_SELF'] ?>">
Try this instead. form method="post" action="/insert-data.php"