Dropdown list displays url in different frame html-php - php

I can use only html and php.
i have a page with 2 frames. 1 left and 1 main.
On the left i have a dropdown list and a submit button.I want when i press submit button to display the url of the option of dropdown list in the main.php.
The page that creates 2 frames.
<!DOCTYPE html>
<html>
<frameset cols="25%,*" >
<frame src="left5.php" name="leftFrame" id="leftFrame" title="leftFrame" />
<frame src="main5.php" name="mainFrame" id="mainFrame" title="mainFrame" />
</frameset>
</frameset>
<body>
</body>
</html>
LEFT frame
<!DOCTYPE html>
<html>
<body>
<form name="links" action="main5.php" method="post">
<select name="NAME" id="ex_name">
<option value="../url1.html">URL1</option>
<option value="../url2.php">URL2</option>
<option value="../url3.php">URL3</option>
</select><input type="submit" value="GO!" name="submit"/>
</form>
</body>
</html>
Main frame
<!DOCTYPE html>
<html>
<body>
<?php
$ep = $_POST['links'];
echo "$ep"
?>
</body>
</html>
I cant use javascript.I know my fault is in $_POST

For your PHP, you're going to have to use something like switch and $_get functions to call the page.
Below is how I would do it.
It does not include how to work it out with frames, but it will show you how to call a local page in PHP.
index.php
body {
margin: 0;
background-color: red;
}
.mymenu {
position: absolute;
width: 300px;
top: 0;
left: 0;
background-color: blue;
}
.mymenu a {
color: #FFF;
}
.main{
margin-left: 300px; /* because of .mymenu's width */
}
<div class="mymenu">
Link1<br />
Link2<br />
Link3
</div>
<div class="main">
<?php
include("things.php"); /* open things.php */
?>
</div>
things.php
/* get p from URL */
if (isset($_GET["p"])) { $p = $_GET["p"]; } else { $p = ""; }
function anotherThing(){
echo "anotherThing page";
}
function thatThing(){
echo "thatThing page";
}
function thisThing(){
echo "thisThing page";
}
/* called from e.g. http://yourwebsite.com/index.php?p=whatever2 */
switch($p) {
case "whatever3":
anotherThing();
break;
case "whatever2":
thatThing();
break;
case "whatever1":
default:
thisThing();
break;
}

Related

I got a problem with select option and value

I try to keep the value from selected options after the button is clicked.
For now, I have done this with my inputs(range,text) and it's working but I can't figure how to do this with my select option.
ADDITIONAL THINGS(you have to create them to run it)
c13ustawienia.php
<?php
$serwer='localhost';
$uzytk='root';
$haslo='';
$baza='komis';
?>
c13dane.txt
1993|Volkswagen|Passat|19000
1973|Opel|Blitz|12000
1997|Volkswagen|Passat|17000
2010|Mercedes|M5|29000
2001|Volkswagen|Passat|29000
1990|Volkswagen|Passat|23000
2018|Tesla|Super|129000
2018|sla|Super|9000
1992|Volkswagen|Passat|10000
2006|Audi|B9|74000
2009|Volkswagen|Passat|89000
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Baza</title>
<style>
table {border-collapse: collapse;}
td,th {border: 1px blue solid;}
th {background-color: azure;}
.id {width: 20px; text-align: center;}
.mar {width: 90px;}
.mod {width: 70px;}
.rok {width: 40px; text-align: right;}
.cena {width: 50px; text-align: right;}
.zolty {background-color: yellow;}
.pomar {background-color:orange;}
[type=text] {width:60px;}
header {height: 60px; background-color:greenyellow;}
header>img {height: 75%; text-align: center;}
nav {height: 400px; width: 30%; background-color:khaki;
float: left;}
main {height: 400px; width: 70%; background-color:moccasin;
float: left;}
footer {height: 40px; background-color: powderblue;
clear: both; text-align: center; color:blue;}
</style>
<script>
function wartosc() {
min=document.getElementById('cmin');
max=document.getElementById('cmax');
wmin=document.getElementById('wmin');
wmax=document.getElementById('wmax');
minint=parseInt(min.value);
maxint=parseInt(max.value);
if(maxint<minint)
maxint=minint+1;
wmin.value=minint;
min.value=minint;
wmax.value=maxint;
max.value=maxint;
}
</script>
</head>
<body>
<?php
function tworz_baze() {
require('c13ustawienia.php');
$link=mysqli_connect($serwer, $uzytk, $haslo);
mysqli_query($link, "DROP DATABASE $baza");
mysqli_query($link, "CREATE DATABASE $baza");
mysqli_query($link, "USE $baza");
mysqli_query($link, "CREATE TABLE auta (
ID int(8) NOT NULL AUTO_INCREMENT PRIMARY KEY,
marka varchar(20),
model varchar(25),
rok int(4),
cena double)");
return $link;
} // tworz_baze()
function czytajdane($plik) {
$f=fopen($plik, 'r');
while(!feof($f)) {
$linia=rtrim(fgets($f));
if(strlen($linia)>5)
$tab[]=explode('|', $linia);
}
return $tab;
} // czytajdane($plik)
function dobazy($link, $tablica) {
foreach ($tablica as $sam) {
list($rok, $mar, $mod, $cena)=$sam;
mysqli_query($link, "INSERT INTO auta VALUES
(NULL, '$mar', '$mod', $rok, $cena)");
}
} // dobazy($link, $tablica)
function pisz($li, $marka, $cenamin, $cenamax) {
echo "<h3>Wybrano:<br>marka: $marka<br>
zakres cen: $cenamin - $cenamax zł</h3>";
echo "<table>
<tr><th>id</th><th>marka</th><th>model</th>
<th>rok</th><th>cena</th></tr>";
$wyn=mysqli_query($li, "SELECT * FROM auta WHERE
marka='$marka' AND cena>=$cenamin AND cena<=$cenamax");
$licznik=FALSE;
while($wiersz=mysqli_fetch_array($wyn)) {
list($id, $mar, $mod, $rok, $cena)=$wiersz;
$kolor = $licznik ? 'zolty' : 'pomar';
echo "<tr class=\"$kolor\"><th class=\"id\">$id</td>
<td class=\"mar\">$mar</td>
<td class=\"mod\">$mod</td>
<td class=\"rok\">$rok</td>
<td class=\"cena\">$cena</td></tr>";
$licznik=!$licznik;
}
echo '</table>';
mysqli_close($li);
} // pisz($li, $model, $cenamax)
function filtry() {
if(isset($_GET['cmin']))
$tab['cmin']=$_GET['cmin'];
else
$tab['cmin']=0;
if(isset($_GET['cmax']))
$tab['cmax']=$_GET['cmax'];
else
$tab['cmax']=CENAMAKS;
if(isset($_GET['marka']))
$tab['marka']=$_GET['marka'];
else
$tab['marka']='Volkswagen';
return $tab;
} // filtry()
function lista($link) {
$w=mysqli_query($link, "SELECT DISTINCT marka
from auta ORDER BY marka");
while($m=mysqli_fetch_array($w))
echo '<option value="'.$m['marka'].'">'
.$m['marka'].'</option>';
// $x=$m['marka'];
// "<option value=\"$x\">....
} // lista($link)
?>
<header>
<img src="auto.png" alt="auto">
<span>Komis samochodowy</span>
</header>
<nav>
<h3>Filtry:</h3>
<form action="c41.php" method="GET">
Cena:<br>
od: <input type="range" name="cmin" id="cmin"
min="0" max="<?php echo CENAMAKS ?>" value="<?php echo $tf['cenamin'];?>"
onchange="wartosc()">
<br>
do :<input type="range" name="cmax" id="cmax"
min="0" max="<?php echo CENAMAKS ?>"
value="<?php echo $tf['cenamin'];?>"
onchange="wartosc()">
<br>
<input type="text" name="wmin" id="wmin" disabled
value="<?php echo $tf['cenamin'];?>"
> -
<input type="text" name="wmax" id="wmax" disabled
value="<?php echo $tf['cenamax'];?>"
><br>
<select name="marka" id="marka">
<?php lista($li); ?>
</select>
<input type="submit" value="Filtruj">
<input type="reset" value="Czyść">
</form>
</nav>
<main>
<?php pisz($li, $tf['marka'], $tf['cmin'], $tf['cmax']); ?>
</main>
<footer>
Adam Kowal ©
</footer>
</body>
</html>
To make inputs work I have giving them variable of function and pointed right key of database to have what I want, but i have no clue how to make it work with select option
frame of code that gives me what i want in inputs: value="<?php echo $tf['cenamin'];?>"
Change your code with the following:
First add a new parameter to the "lista" function to be able to mark the selected value, e.g.
function lista($link, $selected = "default") {
// function code here
}
Secondly, modify the function to respect the passed value and match it to the value gotten from the database:
while($m=mysqli_fetch_array($w)) {
$status = "";
if ($selected == $m['marka']) $status = "selected";
echo '<option '.$selected.' value="'.$m['marka'].'">' .$m['marka'].'</option>';
}
Thirdly, pass the selected value to the function in your code, e.g.:
<?php lista($li, $_GET['marka']); ?>
NB! You should NOT use your current code in any production environments: it includes several SQL injections and isn't built up by best practises (e.g. separating html from the program code etc).

Convert eBay Link Generator results into bitly.com link

I managed a small PHP script that takes the eBay product searched and converts it into promote eBay link.
It goes like this:
user searches for example: ocz vertex
clicks on "Submit" and gets the results in following format
http://rover.ebay.com/rover/1/711-53200-19255-0/1?icep_ff3=10&pub=5575165347&toolid=10001&campid=5337851510&customid=&icep_uq=ocz
vertex&icep_sellerId=&icep_ex_kw=&icep_sortBy=15&icep_catId=&icep_minPrice=&icep_maxPrice=&ipn=psmain&icep_vectorid=229466&kwid=902099&mtid=824&kw=lg
(Can't fix that space in the link generated between ocz and vertex words)
Now, the result is nice, but I want to shorten it via bitly.com account using their API.
Basicly I want it to generate and convert the full eBay link results into small bitly.com link (http://ebay.to/2scU91k for example) and to see that link on my bitly account.
The process would go like this:
User search for term like ocz vertex
click on "Submit"
get the ebay.to short link (while the real process is in background,
converts to rover.ebay.com address and then to ebay.to using my
bitly.com credentials)
I found that and that and especially that, but didn't understand how do I implement the results as a new bitly convert.
Here's the PHP code:
<!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>
<link rel="stylesheet" type="text/css" href="css/screen.css">
<style type="text/css">
body{
margin:0px;
font-size:0.7em;
font-family:trebuchet ms;
color:#222;
}
#mainContainer{
width:840px;
margin:5px;
}
table,tr,td{
vertical-align:top;
}
.textInput{
width:300px;
}
html{
margin:0px;
}
.formButton{
width:75px;
}
textarea,input,select{
font-family:helvetica;
}
i{
font-size:0.9em;
}
</style>
<script language="Javascript">
<!--
var copytoclip=1
function HighlightAll(theField) {
var tempval=eval("document."+theField)
tempval.focus()
tempval.select()
if (document.all&&copytoclip==1){
therange=tempval.createTextRange()
therange.execCommand("Copy")
window.status="Contents highlighted and copied to clipboard!"
setTimeout("window.status=''",1800)
}
}
//-->
</script>
</head>
<table width="80%" height="100px" align="center" style="margin:0 auto"><tr><td align="center">
<h2>Link Generator Online</h2>
</td><tr></table>
<table width="80%" align="center" style="margin:0 auto"><tr><td align="center">
</div>
</td><td valign="top">
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">
<br>
URL<br>
<input type=text style="font-size: 13px; font-family: tahoma,arial; font-weight: bold; color: #000000; BORDER: #555 1px solid ; BACKGROUND-COLOR: #FFF" input name="url" size="20">
<br>
<br>
<input type="SUBMIT" name="submit" VALUE="Submit">
</form>
</td></tr></table>
<?php
if(isset($_POST['submit'])){
$url = $_POST['url'];
$name=array($url);
foreach ($name as $name)
{
if (ereg("^\.",$url)) {
echo "<br><center><font color=\"red\">Invalid Characters.</center>";
Die();
}
if (ereg("\<", $url)) {
echo "<br><center><font color=\"red\">Invalid Characters.</center>";
Die();
}
if (ereg("\[", $url)) {
echo "<br><center><font color=\"red\">Invalid Characters.</center>";
Die();
}
if (ereg("\'", $url)) {
echo "<br><center><font color=\"red\">Invalid Characters.</center>";
Die();
}
if (ereg("\#", $url)) {
echo "<br><center><font color=\"red\">Invalid Characters.</center>";
Die();
}
if (ereg("\`", $url)) {
echo "<br><center><font color=\"red\">Invalid Characters.</center>";
Die();
}
if (!strlen($url)) {
echo "<br><center><font color=\"red\">Empty Field.</center>";
Die();
}
if (strlen($url) > 100) {
echo "<br><center><font color=\"red\">The field cannot contain more than 150 characters.</center>";
Die();
}
}
?>
<br>
<center>
<form name="vini">
<a class="highlighttext" href="javascript:HighlightAll('vini.select1')">Select All</a><br>
<textarea name="select1" rows=3 cols=75 style="font-family:tahoma;color:#555;border:1px dashed #ccc">
http://rover.ebay.com/rover/1/711-53200-19255-0/1?icep_ff3=10&pub=5575165347&toolid=10001&campid=5337851510&customid=&icep_uq=<?php echo $url ?>&icep_sellerId=&icep_ex_kw=&icep_sortBy=15&icep_catId=&icep_minPrice=&icep_maxPrice=&ipn=psmain&icep_vectorid=229466&kwid=902099&mtid=824&kw=lg
</textarea>
<br>
</form>
<?php
}
?>
</body>
</html>
See on live: Ebay link Generator
I built a small solution that works without external libraries. It essentially boils down to this:
Acquire an API key from the "Register an application" dashboard or an oauth token from the oauth API
Make the request to the /v3/shorten API endpoint with your token and URL
First step: Get the token
You only need to do this once. Bitly's documentation lists a few examples how you can do it using curl, I think that is the easiest way. You could also do it with PHP. Simply make this POST request (taken from here):
curl -u "username:password" -X POST "https://api-ssl.bitly.com/oauth/access_token"
The result is something like this:
e663e30818201d28dd07803e57333bed4f15803a
That is your token.
Second step: Make the request
Insert the token and url-encoded URL into the HTTP request to the /v3/shorten endpoint:
<?php
$ebay_url = "http://rover.ebay.com/rover/1/711-53200-19255-0/1?icep_ff3=10&pub=5575165347&toolid=10001&campid=5337851510&customid=&icep_uq=ocz%20vertex&icep_sellerId=&icep_ex_kw=&icep_sortBy=15&icep_catId=&icep_minPrice=&icep_maxPrice=&ipn=psmain&icep_vectorid=229466&kwid=902099&mtid=824&kw=lg"
$token = "e663e30818201d28dd07803e57333bed4f15803a"; // change this
$endpoint = "https://api-ssl.bitly.com/v3/shorten?access_token=".$token."&longUrl=".urlencode($ebay_url)."";
$result = file_get_contents($endpoint);
$json = json_decode($result, true);
$short_url = $json["data"]["url"];
echo $short_url;
?>
The result of the API call is JSON and needs to be decoded. An example is in the documentation. This code example does not take into consideration API timeouts or other errors that might occur (such as token expiry, which is currently not an issue).
The complete code:
<!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>
<link rel="stylesheet" type="text/css" href="css/screen.css">
<style type="text/css">
body{
margin:0px;
font-size:0.7em;
font-family:trebuchet ms;
color:#222;
}
#mainContainer{
width:840px;
margin:5px;
}
table,tr,td{
vertical-align:top;
}
.textInput{
width:300px;
}
html{
margin:0px;
}
.formButton{
width:75px;
}
textarea,input,select{
font-family:helvetica;
}
i{
font-size:0.9em;
}
</style>
<script language="Javascript">
<!--
var copytoclip=1
function HighlightAll(theField) {
var tempval=eval("document."+theField)
tempval.focus()
tempval.select()
if (document.all&&copytoclip==1){
therange=tempval.createTextRange()
therange.execCommand("Copy")
window.status="Contents highlighted and copied to clipboard!"
setTimeout("window.status=''",1800)
}
}
//-->
</script>
</head>
<table width="80%" height="100px" align="center" style="margin:0 auto"><tr><td align="center">
<h2>Link Generator Online</h2>
</td><tr></table>
<table width="80%" align="center" style="margin:0 auto"><tr><td align="center">
</div>
</td><td valign="top">
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">
<br>
Insert keywords:<br>
<input type=text style="font-size: 13px; font-family: tahoma,arial; font-weight: bold; color: #000000; BORDER: #555 1px solid ; BACKGROUND-COLOR: #FFF" input name="url" size="20">
<br>
<br>
<input type="SUBMIT" name="submit" VALUE="Submit">
</form>
</td></tr></table>
<?php
if(isset($_POST['submit'])){
$url = $_POST['url'];
$name = array($url);
foreach ($name as $name) {
if (preg_match("/^[\.\<\[#`]/",$url)) {
echo "<br><center><font color=\"red\">Invalid Characters.</center>";
Die();
}
if (!strlen($url)) {
echo "<br><center><font color=\"red\">Empty Field.</center>";
Die();
}
if (strlen($url) > 100) {
echo "<br><center><font color=\"red\">The field cannot contain more than 150 characters.</center>";
Die();
}
}
$ebay_url = "http://rover.ebay.com/rover/1/711-53200-19255-0/1?icep_ff3=10&pub=5575165347&toolid=10001&campid=5337851510&customid=&icep_uq=".urlencode($url)."&icep_sellerId=&icep_ex_kw=&icep_sortBy=15&icep_catId=&icep_minPrice=&icep_maxPrice=&ipn=psmain&icep_vectorid=229466&kwid=902099&mtid=824&kw=lg";
$token = "e663e30818201d28dd07803e57333bed4f15803a";
$endpoint = "https://api-ssl.bitly.com/v3/shorten?access_token=".$token."&longUrl=".urlencode($ebay_url);
$result = file_get_contents($endpoint);
$json = json_decode($result, true);
$short_url = $json["data"]["url"];
?>
<br>
<center>
<form name="vini">
<a class="highlighttext" href="javascript:HighlightAll('vini.select1')">Select All</a><br>
<textarea name="select1" rows=3 cols=75 style="font-family:tahoma;color:#555;border:1px dashed #ccc">
<?php echo $short_url; ?>
</textarea>
<br>
</form>
<?php
}
?>
</body>
</html>
Note: I changed your ereg calls to preg_match for compatibility with PHP7 and shortened the ifs with a regular expression. I also used urlencode($url) so that spaces won't break the link.

javascript effect only works on the first element but not on others?

I am echoing records from the database which are wrapped with html tags and was trying to put some effect on the echoed data. When I click the edit link, the textfield should shake. It works on the first element but when I click the edit link of the next element, the first textfield still shakes and not the other one.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Wallpost</title>
<style>
.wallpost input[type="text"]{
width: 500px;
height: 20px;
}
.wallpost input[type="submit"]{
height: 26px;
}
.user{
font-weight: bold;
font-size: 20px;
}
.post{
font-family: Arial;
}
a{
text-decoration: none;
}
</style>
</head>
<body>
<?php
require_once 'dbconfig.php';
$user = $_SESSION['user'];;
echo '<form action="post.php" method="post" class="wallpost"><input
type="text" name="post" size="50"><input type="submit" name="wallpost"
value="Post"></form>';
$query = $con->query("SELECT * FROM statuspost ORDER BY id DESC");
while($i = $query->fetch_object()){
//echo $i->post.' '.$i->id.' <a href="wallpost.php?type=post&
id='.$i->id.'" >Remove</a>'.'<br/>';
echo '<span class="user">'.$i->user.'</span>'.'<br>'.'<span
class="post">'.$i->post.'</span>'.' <form action="editpost.php?type=post&
id='.$i->id.'" method="post"><span id="edit"><input type="text"
name="edit">
<br/><input type="submit" value="Edit"></span><a href="#"
onclick="showEdit();">Edit </a><a href="remove.php?type=post&
id='.$i->id.'" >Remove</a></form> '.'<br/><br/>';
//echo '<div id="post">'.$i->post.' '.$i->id.'<a href="#"
id="anchor" class="',$i->id,'" onclick="del();">Remove</a></div>
<br/>';
}
?>
<script src="https://ajax.googleapis.com/ajax/libs/prototype/1.7.2.0
/prototype.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/scriptaculous/1.9.0
/scriptaculous.js"></script>
<script>
function showEdit(){
Effect.Shake('edit');
}
</script>
</body>
</html>
Replace <span id="edit"> by something like <span id="edit'.$i->id.'"> to have different ids on each elements. Then of course, showEdit() must know which id it has to shake, so it has to take a parameter. Or even simpler: replace onclick="showEdit();" by onclick="Effect.Shake(\'edit'.$i->id.'\');"
Scriptaculous effects take either an ID or a JavaScript reference to a DOM element as their first argument, so if you add a classname to your multiple elements, you can shake all of them at once like this:
<span class="shake-me">...</span>
<span class="shake-me">...</span>
<span class="shake-me">...</span>
Inside an enumerator:
$$('.shake-me').each(function(elm){
Effect.Shake(elm);
});

Basic PHP input output [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I'm new to php so i'm stuck with this basic problem. Here I created one textbox and one submit button. What I wanted is that when I type for instances the word "red" in the textbox it's background will automatically change into red but unfortunately the problem is that it's not taking any effect. Any help out there are greatly appreciated. Thank you.
<html>
<head>
<title>
practice
</title>
<style type="text/css">
.red
{
background-color: red;
}
.blue
{
background-color: blue;
}
.yellow
{
background-color: yellow;
}
</style>
</head>
<body>
<?php
$fval = $_POST["val"];
if( isset( $_POST["colorme"] ) ) {
if($fval == "red")
{
echo S_POST['val'] = "red";
}
elseif($fval == "blue")
{
echo S_POST['val'] = "blue";
}
elseif($fval == "yellow")
{
echo S_POST['val'] = "yellow";
}
}
?>
<form method="post">
<input type="text" name="val" class="<?php echo $_POST['val'] ?>">
<input type="submit" name="colorme">
</form>
</body>
</html>
Your Example
<html>
<head>
<title>practice</title>
<style type="text/css">
.red{background-color: red;}
.blue{background-color: blue;}
.yellow{background-color: yellow;}
</style>
</head>
<body>
<?php
$fval = isset($_POST["val"])?trim($_POST["val"]):'';
?>
<form method="post">
<input type="text" name="val" class="<?php echo $fval ?>">
<input type="submit" name="colormoko">
</form>
</body>
</html>
try this for me its working
<html>
<head>
<title>
practice
</title>
<style type="text/css">
.red
{
background-color: red;
}
.blue
{
background-color: blue;
}
.yellow
{
background-color: yellow;
}
</style>
</head>
<body>
<?php
$fval = "";
if( isset( $_POST["colormoko"] ) ) {
$fval = $_POST['val'];
if($fval == "red")
{
echo "<red>";
}
elseif($fval == "blue")
{
echo"<blue>";
}
elseif($fval == "yellow")
{
echo"<yellow>";
}
}
?>
<form method="post">
<input type="text" name="val" class="<?php echo $fval ?>">
<input type="submit" name="colormoko">
</form>
</body>
</html>
function changeColor() {
var textBox = document.getElementById("textbox_coloring");
var color = textBox.value;
textBox.style.backgroundColor = color;
}
<!DOCTYPE html>
<html>
<head>
<title> coloring textbox </title>
<meta charset = 'utf-8' />
</head>
<body>
<form>
<input type = 'text' id = 'textbox_coloring' onkeyup='changeColor();'/>
</form>
</body>
</html>
This snippet change the color of the textBox by altering the style of the textBox by inserting the text value.
It use the "onkeyup" javascript property which permit to access the textBox after a key is pressed.

How to process submission without refreshing the page

Hi I am facing some problems in submitting form without refreshing, I know that it has something to do with "return false " but i just dont know where and how to use it. I tried refreshing the page by placing it in (if there are errors) but it just doesnt seem to work. Can you guys help me out??
<?php
$message = '';
$errors = array();
$noErrors = true;
$haveErrors = !$noErrors;
require_once('validations/tradeformresult.php');
if ($noErrors && $userArriveBySubmittingAForm) {
require_once('price.php');// INSERTION
echo "<script type='text/javascript'>\n";
echo "</script>";
echo "<script type='text/javascript'>\n";
echo "alert('Trade is successfully executed!');\n";
echo "</script>";
///////////MESSAGE/////////////////
}
elseif ($haveErrors && $userArriveBySubmittingAForm) {
echo "<script type='text/javascript'>\n";
echo "alert('Please re-enter your parameters.');\n";
echo "return false";
echo "</script>";
}
else if ($userArriveByClickingOrDirectlyTypeURL) { // we put the original form inside the $message variable
$newTitle = 'The link is broken';
$h1Title = '';
$message = '';
}
?>
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
</script><head><meta charset="UTF-8"></head>
<style type="text/css">
div#overlay {
display: none;
z-index: 2;
background: #000;
position: fixed;
width: 100%;
height: 100%;
top: 0px;
left: 0px;
text-align: center;
}
div#specialBox {
display: none;
position: relative;
z-index: 3;
p.padding;
padding-top:25px;
padding-bottom:25px;
padding-right:50px;
padding-left:50px;
margin: 150px auto 0px auto;
border: 3px solid blue;
outline: 3px solid darkblue;
width: 500px;
height: 500px;
overflow:auto;
background: #FFF;
color: #000;
}
div#wrapper {
position:absolute;
top: 0px;
left: 0px;
padding-left:24px;
}
</style>
<script type="text/javascript">
function toggleOverlay(){
var overlay = document.getElementById('overlay');
var specialBox = document.getElementById('specialBox');
overlay.style.opacity = .8;
if(overlay.style.display == "block"){
overlay.style.display = "none";
specialBox.style.display = "none";
} else {
overlay.style.display = "block";
specialBox.style.display = "block";
}
}
</script>
</head>
<body>
<!-- Start Overlay -->
<div id="overlay"></div>
<!-- End Overlay -->
<!-- Start Special Centered Box -->
<div id="specialBox" style="display:none">
<script>
</script>
<p>Create Order
<p><?php
$timestamp=time(); require_once 'start.php';
?>
<form method="post" name="formSubmitted" **return false;"**>
<input type="hidden" name="formSubmitted" value="true" runat="server">
<?php echo $message; ?>
<?php ?>
<?php if ($haveErrors || $userArriveByClickingOrDirectlyTypeURL) : ?>
<fieldset>
<p>Symbol : <select name = "selection" id="selection">
<option disabled = "disabled" selected = "selected"> Choose one </option>
<option value="eur/usd"<?php If($selection=='eur/usd'){Echo 'selected';}?>>EUR/USD</option>
<option value="usd/jpy"<?php If($selection=='usd/jpy'){Echo 'selected';}?>>USD/JPY</option>
<option value="usd/cad"<?php If($selection=='usd/cad'){Echo 'selected';}?>>USD/CAD</option>
<option value="eur/jpy"<?php If($selection=='eur/jpy'){Echo 'selected';}?>>EUR/JPY</option>
<option value="eur/chf"<?php If($selection=='eur/chf'){Echo 'selected';}?>>EUR/CHF</option>
<option value="gbp/usd"<?php If($selection=='gbp/usd'){Echo 'selected';}?>>GBP/USD</option>
<option value="aud/usd"<?php If($selection=='aud/usd'){Echo 'selected';}?>>AUD/USD</option>
<option value="usd/chf"<?php If($selection=='usd/chf'){Echo 'selected';}?>>USD/CHF</option>
</select><font color="red"><?php echo $selectionError?></font>
<p> Date : <input type="datetime" value="<?php echo date("Y-m-d ",$timestamp); ?>"READONLY name="date"/></p>
<p> Type : <input type="radio" name="type" value="buy"<?php if ($type == 'buy') echo 'checked'; ?>CHECKED> Buy <input type="radio" name="type" value="sell" <?php if ($type == 'sell') echo 'checked'; ?>>Sell<font color="red"><?php echo $typeError;?></font></p>
<p> Size : <input type="number"pattern="[0-9]+([\.|,][0-9]+)?" step="0.01"min="0"name="size"value="<?php echo $size;?>"/><font color="red"><?php echo $sizeError?></font></p>
<p> Bid Price (Sell) : <input id="bidprice" READONLY name="bidprice" type="text" value="<?php echo $bidprice;?>"/><font color="red"><?php echo $bidpriceError?></font></p>
<p> Offer Price (Buy) :<input id="offerprice" READONLY name="offerprice" type="text" value="<?php echo $offerprice;?>"/><font color="red"><?php echo $offerpriceError?></font> </p>
<p> Stop Loss : <input type="number"step="any"min="0" name="stoploss" value="<?php echo $stoploss;?>"/><font color="red"><?php echo $stoplossError?></font></p>
<p> Take Profit : <input type="number"step="any"min="0"name="takeprofit"value="<?php echo $takeprofit;?>"/><font color="red"><?php echo $takeprofitError?></font></p>
</fieldset>
<div align="center">
<input type="submit" value="Submit" Onsubmit =**"return false"**;/><button onmousedown="toggleOverlay()">Close </button>
</div>
<input type="reset" name="Reset" value="Reset" tabindex="50">
<?php endif; ?>
</form>
</script>
</body>
</html></p>
</div>
</div>
<!-- Start Special Centered Box -->
<!-- Start Normal Page Content -->
<div id="wrapper">
<h2>Trade</h2>
<button onmousedown="toggleOverlay();**return false;"**>Create Order</button>
</div>
<!-- End Normal Page Content -->
</body>
</html>
<?php
?>
Unless you are using AJAX, you can't really do this from PHP. Once a form submits, that's it. Simple validation can be done in the browser. Bind a validation function to your form's submit event. That's the thing you return false or true from.
(You would of course validate again on the server.)
It looks from your code like you're trying to run some php code (tradeformresult.php). Loading it this way isn't going to work as expected-that require_once will be run as the page is being built in PHP, not in the browser.
For sending a form without refreshing the page, you should look into AJAX (http://en.wikipedia.org/wiki/Ajax_(programming))
JQuery has a good AJAX method. Here is a simple example of how to use it:
$.ajax({url:"http://www.someserver.com/api/path",
data:{val1:"value",val2:"value"})
.success(function(returnData) {
console.log(returnData);
});
The above will call the given URL with the given data as parameters, then, if successful, will return whatever data the server gave back into the returnData variable.
If you're using AJAX, you don't really even have to use a <form> tag, since you'll be building the query string manually. You can have the function that makes the AJAX call be triggered from the onClick event of a button.

Categories