I have following codes
<html>
<head>
<title>Javascript function </title>
<style type="text/css">
.box
{
width:400px;
background-color:#F0F8FF;
}
h4
{
color:#09F
}
</style>
<script type="text/javascript">
function hello(){
var xx=eval(form1.text1.value);
var yy=eval(form1.text2.value);
form1.text3.value=xx+yy
}
</script>
</head>
<body onLoad="form1.text1.focus()">
<center>
<div class="box">
<h1 style="color:#2c80d3 ">Javascript Function</h1>
<table border="0" cellspacing="1" cellpadding="1" width="25%">
<form name="form1" action="textboxes.php" method="Post">
<tr><td> First</d><td width="20px"><input type="text" name="text1" value=""></td></tr>
<tr><td> Second</d><td><input type="text" name="text2" value="" onBlur="hello()"></td></tr>
<tr><td> Result</d><td><input type="text" name="text3" value="" disabled=""></td></tr>
</form>
</table>
<h4>Enter any digit in text1 and text2 and see result in text3</h4>
<h4>Is it possible to do above with php without submitting FORM?</h4>
</div>
</center>
</body>
</html>
No problem, It works fine.
I used java script to sum two numbers.
Is it possible to add two numbers with php without using any submit button?
If yes then please guide me.
http://i41.tinypic.com/2rfev7m.jpg
If you want to do it without a submit button and in php, you can use an AJAX request in javascript to the server, which will compute to value and then return it to the client.
here is the working sample.
First of all we need to create a html file named add.html.
here is the code of the add.html file…
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Addition</title>
</head>
<body>
<form action="result.php" method="post">
Enter first Integer: <input type="text" name="first" size="5" /><br/>
Enter second Integer: <input type="text" name="sec" size="5" /><br/>
<input type="submit" name="submit" value="Add" />
</form>
</body>
</html>
place it in the pseudo server folder. If your pseudo server is WampServer, then the path of the file will be
C:/wamp/www/add.html
now open your favorite browser and to the address bar type
localhost/add.html
You can see the add.html page. add with number
You can see two text box where you can input the numbers and a submit button. You can input two numbers into the input boxes and press the submit button (The Add button). But nothing will happen. Because the php will do the adding job.
Lets create the php file. You can name it result.php. As I have already declared in the add.html form action is the result.php.
<form action="result.php" method="post">
if you give different name of the php file then please change the form action php name in add.html.
Here is the php code of result.php…
<?php //Starting of php
$first = $_POST['first']; //Getting Value of first integer from add.html
$sec = $_POST['sec']; //Getting Value of Second integer from add.html
$res = $first + $sec; //Adding the two values and placing the added result to 'res' variable
echo 'Added Result:';
echo $first." + ".$sec." = ".$res; //Showing the result to the screen
//Ending of php
?>
save this result.php file in the server path where you have already placed the add.html file.
Now it is the time to test. Open your favorite browser and in the address bar type…
localhost/add.html
enter two numbers and hit the Add button. you will see that the browser will direct you to the result.php page where you can see the added result.
hope this will help you.
Related
I have the code but it doesn't seem to work and I don't know why.
I don't know what the this.php is for.
here is the instruction:
Create a form with one input that accepts text.
Once the user submits the form, their original input should be shown in the input field and the number of words in their input should be shown below the form.
Display an error message if the user submits no input.
As a bonus, also display the number of characters in the input below the form.
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body class="container">
<h1>Word Counter</h1>
<form action="this.php" method="post" class="form">
<textarea name="input" class="form-control" style="width:50%">
<?php
if(!empty($_POST['input'])){
echo $_POST['input'];
}
?>
</textarea><br />
<input type="submit" class="btn btn-primary" value="Count!" />
</form>
<?php
if(!empty($_POST['input'])){
echo "<p><strong>Output:</strong><br>Number of Words: $words<br>Number of Characters: $chars</p>";
}
?>
</body>
</html>
I want to echo the textarea value with PHP, so I create a simple form with HTML, and inside it I include textarea element with name of b64_place and then input to submit the values.
I check if b64_place is set, and if it is I echo the value of the textarea. But my program doesn't even get into the condition block, I try debugging and it is just not doing nothing.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>
<body>
<form action="index.php" method="GET">
<textarea name="b64_place" form="encode">Enter text here:</textarea>
<input type="submit" value="Encode">
</form>
<?php
if (isset($_GET['b64_place'])) {
$base64e_text = htmlspecialchars($_GET['b64_place']);
echo $base64e_text;
}
?>
</body>
</html>
Your textarea contains an attribute form This attribute is used to define the id of the form this input is attached to. So, when you submit the form, the textarea isn't bound with that form and the datas aren't send
You can either add an id to the form :
<!-- check this ----------------------v---------v -->
<form action="index.php" method="GET" id="encode">
<textarea name="b64_place" form="encode">Enter text here:</textarea>
<input type="submit" value="Encode">
</form>
or simply remove the form="encode"
Edit based on suggestion from senior SO members,
The reason i recommend you to change the method to POST is because of the length limit of the GET method. At some point you may want to encode very large data and it may get trimmed of because of URL length limit. But with POST you don't have to worry about this restriction.
Steps to solve your issue.
If your Form and your PHP code is in the same file changethe action="index.php" to action="" and change the method="GET" to method="POST"
In text area use placeholder to tell the user what to input instead of writing it between the tags.
change $_GET to $_POST everywhere in your code.
You can copy the following code into the index.php and it will work fine.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>
<body>
<form action="" method="POST">
<textarea name="b64_place" placeholder="Enter text here:"></textarea>
<input type="submit" value="Encode">
</form>
<?php
if (isset($_POST['b64_place'])) {
$base64e_text = htmlspecialchars($_POST['b64_place']);
echo $base64e_text;
}
?>
</body>
</html>
I'm wondering if it would be possible to place two forms on the same page
and saving their cookie values respectively after clicking submit buttons.
With code below, when I click submit button on the first form, its cookie value is saved successfully but when I click on the second form, second value is saved but the first value is overwritten.
<?php
setcookie('username[user111]', $_POST['user111'], time()+60);
setcookie('username[user222]', $_POST['user222'], time()+60);
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<p>name：<?php echo $_POST['user111']; ?></p>
<form method="POST" action="">
<input type="hidden" name="user111" value="TOM">
<input type="submit" value="close">
</form>
<p>name：<?php echo $_POST['user222']; ?></p>
<form method="POST" action="">
<input type="hidden" name="user222" value="BOB">
<input type="submit" value="close">
</form>
</body>
</html>
I'd like to save both
Name:username[user111] Value:BOB
Name:username[user222] Value:TOM
If I could save the values respectively, it'd not necessary to use form submit
but if possible I'd like to use PHP instead of JavaScript.
Any advice would be appreciated.
Very simply, as a browser style UI, I'm trying to read two parameters (provided by user) in two textboxes, save them in a plain text file (specifically a csv but that's not important) on the server but not stopping there, to ensure that these has saved correctly, and as feedback to the user, I want to read the newly saved parameters back from the file into two other textboxes on the same page.
When the page loads, jquery successfully populates the "currently saved settings" textboxes with the values read in from the server csv file using php. When I enter new values and then click the [submit] button to save these values, the server file gets updated successfully.
And it is the next steps where the problem arises, I can use php to read the newly stored values back in from the server file and "alert" them to check that they are correct but the jquery lines to update the "currently saved settings" will not update. I have to refresh the webpage to get these textboxes to update. I should say that the "alerts" display the correct (newly saved) values so everything up to that point works fine it's just the following two jquery lines that work on page load don't seem to get executed at this point.
Hopefully there's something dead simple I'm missing here.
(The csv file itself is simply two parameters used by a complete separate and unrelated piece of software.)
Help much appreciated.
php file as follows:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>System Settings</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js" type="text/javascript"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js" type="text/javascript"></script>
<?php
$SystemSettings = explode(",",file_get_contents('Data/Settings.csv'));
?>
<script type="text/javascript">
$(document).ready(function () {
$("#txtStoredParam1").val("<?php echo $SystemSettings[0] ?>");
$("#txtStoredParam2").val("<?php echo $SystemSettings[1] ?>");
$("#btnSaveSettings").button();
});
</script>
</head>
<body>
<?php
if(isset($_POST['submit']))
{
$File = "Data/Settings.csv";
$Handle = fopen($File, 'w');
$Data = $_POST['Param1'] . "," . $_POST['Param2'];
fwrite($Handle, $Data);
fclose($Handle);
$SystemSettings = explode(",",file_get_contents('Data/Settings.csv'));
?>
<script>
// alert("<?php echo $SystemSettings[0] ?>");
// alert("<?php echo $SystemSettings[1] ?>");
$("#txtStoredParam1").val("<?php echo $SystemSettings[0] ?>");
$("#txtStoredParam2").val("<?php echo $SystemSettings[1] ?>");
</script>
<?php
}
?>
<form id="Form" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>" name="SettingsForm" target="iFormResponse">
<h2>Parameter 1:</h2>
<input id="txtParam1" type="text" name="Param1" />
<h2>Parameter 2:</h2>
<input id="txtParam2" type="text" name="Param2" />
<p> </p>
<p><input id="btnSaveSettings" type="submit" value="Save Settings" name="submit" /></p>
<p> </p>
<h3> Currently Saved Settings: </h3>
<p> <label id="lblParam1">Parameter 1: </label><input id="txtStoredParam1" type="text" name="StoredParam1" />
<label id="lblParam2">Parameter 2: </label><input id="txtStoredParam2" type="text" name="StoredParam2" /></p>
</form>
<iframe name="iFormResponse" width="300" height="200" Style="display:none;"></iframe>
</body>
</html>
Your first script block used $(document).ready() whereas the second does not. Therefore, the second block runs first and is overridden by the second.
Delete the second block and move the code for the first block to the end of the page so that you have only one script block that is reused in both cases.
But since you are using forms and PHP, why not just set the value of the input?
<input id="txtParam2" type="text" name="Param2" value="<?php echo $systemSettings[0];?>" />
In a form I have an <iframe> that contains a PHP file (editor.php). This PHP file contains an HTML form.
Well, when I do a "submit form", I call the same PHP file, for example main.php.
When I press the submit button, I have "onclick method" that it calls a Javascript function inside editor.php. This function executes the form.
My problem is that main form is executed correctly but the second form is not.
In the second loop of the form of editor.php receives nothing.
**Check this way it will work as you expected**
//main.php
<html>
<head>
<script type="text/javascript">
function validateMain()
{
alert('main');
}
function validateSub()
{
alert('sub');
}
</script>
</head>
<body>
<form id="main" onsubmit="return validateMain();">
<input type="text" name="first" id="first"/>
<input type="submit" value="Submit Main"/>
</form>
<iframe name="ifr-form" id="ifr-form" src="test.html"></iframe>
</body>
</html>
//test.html the second form included through iframe
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<div>
<form id="sub" onclick="return window.top.validateSub();">
<input type="text" name="first" id="second"/>
<input type="button" value="Submit Sub" />
</form>
</div>
</body>
</html>
you must check if php and iframe are compatible, as far as i Know I don't think that frames and php gives any output, hope this helps.