displayin forms and undisplayin forms
Moderator: General Moderators
displayin forms and undisplayin forms
i have a plm
i am writin this order application whr pple can order, i want people to place thr order and when it goes into the database, i want the order recipt/confirmation to display on the same page where the form is.. and the form should dissappear with out sendin it to another page, all must be done in one page
i can paste my code is you want
i am writin this order application whr pple can order, i want people to place thr order and when it goes into the database, i want the order recipt/confirmation to display on the same page where the form is.. and the form should dissappear with out sendin it to another page, all must be done in one page
i can paste my code is you want
Re: displayin forms and undisplayin forms
What's your question, exactly? Where are you running into problems?
- phazorRise
- Forum Contributor
- Posts: 134
- Joined: Mon Dec 27, 2010 7:58 am
Re: displayin forms and undisplayin forms
i guess you don't want to leave the page.
so you need Ajax to do this stuff. You can either use javascript or other javascript libraries like jQuery (my fav) or mootools.
With Ajax you can request another php page/script to perform some operations, catch it's response and report it to user. In your case, order should be go into database( i.e request ) and display receipt/confirmation ( i.e response) on that very page.
so you need Ajax to do this stuff. You can either use javascript or other javascript libraries like jQuery (my fav) or mootools.
With Ajax you can request another php page/script to perform some operations, catch it's response and report it to user. In your case, order should be go into database( i.e request ) and display receipt/confirmation ( i.e response) on that very page.
Re: displayin forms and undisplayin forms
yup... i dont want to leave the page atall
but i am not too good with jquery or javascript, i had a feeling it would work with it, i want all the data in and out of the same page, more like passing a variable to the url and using $_get to call it, thru links, but this time there is no link i just want the form beneath my php to disappear
will paste the code
so after it echos "order placed, i dont want to see the form beneath it, without creating another php page
but i am not too good with jquery or javascript, i had a feeling it would work with it, i want all the data in and out of the same page, more like passing a variable to the url and using $_get to call it, thru links, but this time there is no link i just want the form beneath my php to disappear
will paste the code
Code: Select all
<?php
if (isset($_REQUEST['submit'])) {
$errors = array();
/*$required_fields = array('name', 'organization', 'phone', 'address');
$errors = array_merge($errors, check_required_fields($required_fields));*/
if (empty($errors)) {
$date = strftime("%Y-%m-%d %H:%M:%S", time());
$fullname = trim(strip_tags($_POST['fullname']));
$organization = trim(strip_tags($_POST['organization']));
$phone = trim(strip_tags($_POST['phone']));
$address = trim(strip_tags($_POST['address']));
$edition = $_POST['edition'];
$custom = $_POST['custom'];
$qty = trim(strip_tags($_POST['qty']));
$body = trim(strip_tags($_POST['add_body']));
$orders = "INSERT INTO sample.order(date, fullname, organization, phone, address, edition, type, quantity, enquiry)
VALUES('$date','$fullname','$organization','$phone','$address', '$edition','$custom','$qty','$body')";
$order = mysql_query($orders);
if(!$order){
echo "Order was not placed<br/>";
die('Error: ' . mysql_error());
}else{
echo "Order has Been placed<br/>";
if(isset($_REQUEST['order'])){
echo "Order Notice";
echo "<hr/>";
}
}
}
} // end: if (isset($_POST['submit']))
?>
<?php
/*$form = "<h1> This is a test page</h1>";
echo $form;
echo strip_tags($form). "<br/>";
echo htmlentities($form);*/
?>
<form action="html.php?order=placed" method="post">
<table width="95%" border="0" cellspacing="0" cellpadding="2">
<tr>
<td width="29%" class="pText">FullName:</td>
<td width="71%" align="left"><input name="fullname" type="text" class="inputText" /></td>
</tr>
<tr>
<td width="29%" class="pText">School/College/Organization:</td>
<td width="71%" align="left"><input name="organization" type="text" class="inputText" /></td>
</tr>
<tr>
<td width="29%" class="pText">Direct Active Phone:</td>
<td width="71%" align="left"><input name="phone" type="text" class="inputText" /></td>
</tr>
<tr>
<td width="29%" class="pText">Delivery Address:</td>
<td width="71%" align="left"><input name="address" type="text" class="inputText" /></td>
</tr>
<tr>
<td width="29%" class="pText">Edition:</td>
<td width="71%" align="left"><p>
<label>
<input type="radio" name="edition" value="standard" id="edition_0" checked="checked"/>
Standard</label>
<br />
<label>
<input type="radio" name="edition" value="classroom" id="edition_1" />
Classroom</label>
<br />
<label>
<input type="radio" name="edition" value="classic" id="edition_2" />
Classic</label>
<br />
</p></td>
</tr>
<tr>
<td width="29%" class="pText">Type:</td>
<td width="71%" align="left"><p>
<label>
<input type="radio" name="custom" value="customized" id="custom_0" checked="checked"/>
Customized</label>
<br />
<label>
<input type="radio" name="custom" value="uncustomized" id="custom_1" />
Non-Customized</label>
<br />
</p></td>
</tr>
<tr>
<td width="29%" class="pText">Quantity Required:</td>
<td width="71%" align="left"><input name="qty" type="text" class="inputText" /></td>
</tr>
<tr>
<td width="29%" class="pText">Additional Order Enquiry:</td>
<td width="71%" align="left"><textarea name="add_body" cols="40" rows="10"></textarea></td>
</tr>
<tr>
<td></td>
<td><input name="submit" type="submit" value="Place Order !!!" class="nameTxt"/></td>
</tr>
<tr>
<td>
</td>
</tr>
</table>
so after it echos "order placed, i dont want to see the form beneath it, without creating another php page
- phazorRise
- Forum Contributor
- Posts: 134
- Joined: Mon Dec 27, 2010 7:58 am
Re: displayin forms and undisplayin forms
Ohkay, here's something you can try out- ( i used jQuery library for Ajax purpose.)
process.php
and your form be the-
and here's jQuery to be include on same page -
Try this example if it works. I didn't tested it.
And only tip, use POST method for passing information collected from form no matter you are using either Ajax or pure php.
Let me know if you encountered an error.
process.php
Code: Select all
<?php
$date = strftime("%Y-%m-%d %H:%M:%S", time());
$fullname = trim(strip_tags($_POST['fullname']));
$organization = trim(strip_tags($_POST['organization']));
$phone = trim(strip_tags($_POST['phone']));
$address = trim(strip_tags($_POST['address']));
$edition = $_POST['edition'];
$custom = $_POST['custom'];
$qty = trim(strip_tags($_POST['qty']));
$body = trim(strip_tags($_POST['add_body']));
$orders = "INSERT INTO sample.order(date, fullname, organization, phone, address, edition, type, quantity, enquiry)
VALUES('$date','$fullname','$organization','$phone','$address', '$edition','$custom','$qty','$body')";
$order = mysql_query($orders);
if(!$order){
echo "Order was not placed<br/>";
die('Error: ' . mysql_error());
}else{
echo "Order has Been placed<br/>";
if(isset($_REQUEST['order'])){
echo "Order Notice";
echo "<hr/>";
}
}
}
} // end: if (isset($_POST['submit']))
?>
Code: Select all
<form action="process.php" method="post" id="order_form"> <!-- added id attribute to identify form uniquely. and i've no idea what "action="html.php?order=placed" thing do ? Does it really do anything at all ? " -->
<table width="95%" border="0" cellspacing="0" cellpadding="2">
<tr>
<td width="29%" class="pText">FullName:</td>
<td width="71%" align="left"><input name="fullname" type="text" class="inputText" /></td>
</tr>
<tr>
<td width="29%" class="pText">School/College/Organization:</td>
<td width="71%" align="left"><input name="organization" type="text" class="inputText" /></td>
</tr>
<tr>
<td width="29%" class="pText">Direct Active Phone:</td>
<td width="71%" align="left"><input name="phone" type="text" class="inputText" /></td>
</tr>
<tr>
<td width="29%" class="pText">Delivery Address:</td>
<td width="71%" align="left"><input name="address" type="text" class="inputText" /></td>
</tr>
<tr>
<td width="29%" class="pText">Edition:</td>
<td width="71%" align="left"><p>
<label>
<input type="radio" name="edition" value="standard" id="edition_0" checked="checked"/>
Standard</label>
<br />
<label>
<input type="radio" name="edition" value="classroom" id="edition_1" />
Classroom</label>
<br />
<label>
<input type="radio" name="edition" value="classic" id="edition_2" />
Classic</label>
<br />
</p></td>
</tr>
<tr>
<td width="29%" class="pText">Type:</td>
<td width="71%" align="left"><p>
<label>
<input type="radio" name="custom" value="customized" id="custom_0" checked="checked"/>
Customized</label>
<br />
<label>
<input type="radio" name="custom" value="uncustomized" id="custom_1" />
Non-Customized</label>
<br />
</p></td>
</tr>
<tr>
<td width="29%" class="pText">Quantity Required:</td>
<td width="71%" align="left"><input name="qty" type="text" class="inputText" /></td>
</tr>
<tr>
<td width="29%" class="pText">Additional Order Enquiry:</td>
<td width="71%" align="left"><textarea name="add_body" cols="40" rows="10"></textarea></td>
</tr>
<tr>
<td></td>
<td><input name="submit" type="submit" value="Place Order !!!" class="nameTxt"/></td>
</tr>
<tr>
<td>
</td>
</tr>
</table>
Code: Select all
$(function(){
$("#order_form").submit(function(){
var dataString=$(this).serialize();
$.ajax({
type: "POST",
url: "process.php",
data: dataString,
success: function(msg) {
$("#oder_form").replace("<div>"+msg+"</div>"); // display message back to user. Either error or success message. Whichever script echo's first in //process.php script
}
});
});
});
And only tip, use POST method for passing information collected from form no matter you are using either Ajax or pure php.
Let me know if you encountered an error.
Re: displayin forms and undisplayin forms
well thot it will change as the variable in the order changes, more like links.... will try out the javascript code now
Re: displayin forms and undisplayin forms
well ... tried it with the javascript you gave me, and it still doing the same thing, it still displays the form beneath it...
- phazorRise
- Forum Contributor
- Posts: 134
- Joined: Mon Dec 27, 2010 7:58 am
Re: displayin forms and undisplayin forms
have you included jQuery library before the javascript i mentioned? Write following line in your file -
to check if jQuery is successfully running put -
[text]alert("jQuery's is included");[/text] immediately after [text]$(function(){[/text] line.
Code: Select all
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
[text]alert("jQuery's is included");[/text] immediately after [text]$(function(){[/text] line.
- phazorRise
- Forum Contributor
- Posts: 134
- Joined: Mon Dec 27, 2010 7:58 am
Re: displayin forms and undisplayin forms
simply follow jQuery Ajax Tut link. and see demo how it works.
Re: displayin forms and undisplayin forms
well... still didnt work... may be u shld pls try it urself then tell me wat u got... thanks for tryin
- phazorRise
- Forum Contributor
- Posts: 134
- Joined: Mon Dec 27, 2010 7:58 am
Re: displayin forms and undisplayin forms
ohkay, here's code that do the job. Put this code inside <HEAD> section.
Code: Select all
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
$("#order_form").submit(function(){
var dataString=$(this).serialize();
$.ajax({
type: "POST",
url: "process.php",
data: dataString,
success: function(msg) {
$("#order_form").replaceWith("<div>"+msg+"</div>"); // display message back to user. Either error or success message. Whichever script echo's first in //process.php script
}
});
event.preventDefault();
});
});
</script>