Iframe loading parent page on js function call - javascript

I am trying to get an iframe to run js on my site
the iframe page is as follows (some php omitted for relevance):
<?php
function createModeratorFormPart($moderator_email = null, $modNumber = 5){
echo "<script src=\"frontend.js\"></script>"; //implement adding moderators dynamically and such
echo "<fieldset id=\"moderator\">";
echo "<button onClick=\"addModerator()\">Add a moderator</button>";
if($moderator_email == null){ //if we have no moderators set
echo "<div>";
echo "<input class=\"addCommunityInput\" type=\"email\" name=\"moderator[$i]\" placeholder=\"Moderator Email\">";
echo "<button onClick=\"dropModerator(this)\">-</button>";
echo "</div>";
}else{
for($i = 0; $i < count($moderator_email); $i++){
echo "<div>";
echo "<input class=\"addCommunityInput\" type=\"email\" name=\"moderator_email[$i]\" placeholder=\"Moderator Email\" value=\"" . $moderator_email[$i] . "/>";
echo "<button onClick=\"dropModerator(this)\">-</button>";
echo "</div>";
}
}
echo "</fieldset>";
}
?>
<html>
<head>
<link rel="stylesheet" href="/web/addOfferingStyles.css" type="text/css" />
<script src="/web/frontend.js"></script>
</head>
<body>
<?php if(isset($_GET['success'])){
echo '<p>Offering successfully created</p>';
}else{
echo "<p>$retCode</p>";
}
?>
<h1 id="addCompOff">New Community Period</h1>
<form method="post" id="addCommunityForm" action="<?php echo 'https://theprepapp.com'. $_SERVER['PHP_SELF'];?>">
<input type="hidden" name="formSubmit" value="1"></input>
<input class="addCommunityInput" type="text" name="name" placeholder="Offering Name" />
<input class="addCommunityInput" type="text" name="description" placeholder="Description" />
<input class="addCommunityInput" type="text" name="location" placeholder="Location & Time Information" />
<input class="addCommunityInput" type="number" name="peopleLimit" placeholder="Student Capacity" />
<input class="addCommunityInput" type="text" name="moderator" placeholder="Moderator Names(s)" />
<?php createModeratorFormPart(); ?>
</fieldset>
<div>
<p>Days Offered:</p>
<div class="control-group">
<label class="control control-checkbox">
Monday
<input name="monday" type="checkbox"/>
<div class="control_indicator"></div>
</label>
<label class="control control-checkbox">
Tuesday
<input name="tuesday" type="checkbox"/>
<div class="control_indicator"></div>
</label>
<label class="control control-checkbox">
Wednesday
<input name="wednesday" type="checkbox" />
<div class="control_indicator"></div>
</label>
<label class="control control-checkbox">
Thursday
<input name="Thursday" type="checkbox" />
<div class="control_indicator"></div>
</label>
<label class="control control-checkbox">
Friday
<input name="Friday" type="checkbox" />
<div class="control_indicator"></div>
</label>
</div>
<input type="submit" value="Submit">
</form>
</body>
</html>
I am trying to run this function:
function addModerator(){
var fieldset = document.getElementById("moderator");
//create encompassing div so that deletion of the moderator can be deleted easily
var div = document.createElement("div");
div.setAttribute("className", "moderator");
//create label
var label = document.createElement("Label");
label.appendChild(document.createTextNode("Moderator"));
div.appendChild(label);
//create text field
var input = document.createElement("Input");
input.setAttribute("placeholder","Moderator Email");
input.setAttribute("type","email");
div.appendChild(input);
//create the delete button
var button = document.createElement("button");
button.setAttribute("value","-");
button.setAttribute("onClick", "dropModerator(this)");
div.appendChild(button);
//add the div to the fieldset
fieldset.appendChild(div);
}
When I run this through the onClick event, the console does not show any JS errors: however, the iframe document becomes the document of the parent page (even though the iframe src attribute is not changed)
(linked to here, though I can't imagine how it would be relevant: https://github.com/articDrag0n/PrepApp/blob/master/web/teacher/teacher.php) How is this happening?

The problem was the form submission
Everytime I clicked on a button , the form would submit (and due to the form handling code, would go to the parent page);
solution was to add this line button.setAttribute("type", "button");
or, if your doing it in html <button type="button">
Ended up being a clone of this one:Can I make a <button> not submit a form?

Related

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 !

Dynamic display of Html div with php expression using javascript on button click

please help me with my problem, been cranking my head for this one, so basically I want to dynamically add a <div> with form elements on it. I want to append it on button click using javascript. I had it working at first until the part where I have to place a php expression on the <select> tag in the labels and values of the select option comes from my database.
HTML
<div id="file-container" class="container-fluid">
<div class="form-inline thumbnail">
<label class="sr-only">File Name</label>
<input type="text" class="form-control input-sm" name="filename[]" placeholder="File name *">
<select class="selectpicker" data-live-search="true" title="Choose Article" name="article[]">
<?php while($row_rsArticles = mysqli_fetch_assoc($rsArticles)){ ?>
<option value="<?php echo $row_rsArticles['id']; ?>" ><?php echo $row_rsArticles['name']; ?></option>
<?php } mysqli_data_seek($rsArticles, 0);?>
</select>
<div class="radio">
<fieldset id="group1">
<label class="radio"><input type="radio" class="radio" name="filemode[] id=group1" value="0">Can View</label>
<label class="radio"><input type="radio" class="radio" name="filemode[] id=group1" value="1">Can Download</label>
</fieldset>
</div>
<label for="fileinput" class="sr-only">File input</label>
<input type="file" class="form-control input-sm" name="fileinput[]">
<button type="button" class="btn btn-danger" id="deletefileinput">Delete</button>
</div>
SQL
mysqli_select_db($connection, $database);
$query_rsArticles = "SELECT * FROM article order by name asc";
$rsArticles = mysqli_query($connection, $query_rsArticles) or die("Error in retrieving article records");
$totalRows_rsArticles = mysqli_num_rows($rsArticles);
JAVASCRIPT
$(function() {
var counter = 2;
$('#addfileinput').click(function(){
var newDiv = $('<div class="form-inline thumbnail"><label class="sr-only">File Name</label><input type="text" class="form-control input-sm" name="filename[]" placeholder="File name *"><select class="selectpicker" data-live-search="true" title="Choose Article" name="article[]"><?php while($row_rsArticles = mysqli_fetch_assoc($rsArticles)){ ?><option value="<?php echo $row_rsArticles['id']; ?>" ><?php echo $row_rsArticles['name']; ?></option><?php } mysqli_data_seek($rsArticles, 0);?></select><div class="radio"><fieldset id="group'+counter+'"><label class="radio"><input type="radio" class="radio" name="filemode[] id=group'+counter+'" value="0">Can View</label><label class="radio"><input type="radio" class="radio" name="filemode[] id=group'+counter+'" value="1">Can Download</label></fieldset></div><label for="fileinput" class="sr-only">File input</label><input type="file" class="form-control input-sm" name="fileinput[]"><button type="button" class="btn btn-danger" id="deletefileinput">Delete</button></div>').append(newDiv);
counter ++;
});
});
I think ajax is the way to go. Try this approach...
HTML
<div id="file-container" class="container-fluid">
<div class="form-inline thumbnail">
<form id="articles_search">
<label class="sr-only">File Name</label>
<input id= "srch_input" type="text" class="form-control input-sm" name="filename[]" placeholder="File name *">
<button class = "btn btn-default" id="articles">Ajax</button>
</form>
<div id="srch">
</div>
<div class="radio">
<fieldset id="group1">
<label class="radio"><input type="radio" class="radio" name="filemode[] id=group1" value="0">Can View</label>
<label class="radio"><input type="radio" class="radio" name="filemode[] id=group1" value="1">Can Download</label>
</fieldset>
</div>
<label for="fileinput" class="sr-only">File input</label>
<input type="file" class="form-control input-sm" name="fileinput[]">
<button type="button" class="btn btn-danger" id="deletefileinput">Delete</button>
JAVASCRIPT
$(document).ready(function() {
$('#articles').click(function(){
var title = $("#srch_input").val();
$.ajax({
url: 'processing_php_file.php',
type: "POST",
data: {'title': $("#srch_input").val()},
processData: true,
success: function(data){
$('#srch').fadeIn(200).html(data);
},
error: function(){
}
});
});
PHP
Name of the php file should be processing_php_file.php.
<?php
mysqli_select_db($connection, $database);
$query_rsArticles = "SELECT * FROM article order by name asc";
$rsArticles = mysqli_query($connection, $query_rsArticles) or
die("Error in retrieving article records");
$totalRows_rsArticles = mysqli_num_rows($rsArticles);
while($row_rsArticles = mysqli_fetch_assoc($rsArticles));
echo '<select>';
for ($i=0; $i <sizeof($totalRows_rsArticles) ; $i++) {
echo '<option>';
echo $row_rsArticles['id'];
echo $row_rsArticles['name'];
echo '</option>';
}
echo '</select>';
?>
In this example we are querying the database via ajax call and retrieving the data from the database and showing them in the web page without page refresh.
note: You need to modify your php according to your need. I just used the code provided by you as it is just to show you the approach. I added the echo part to show the result in your webpage. You can optimize the look by css.
Hope this helps!

How to close a popup light box

This is my code. Here Iam closing the popupbox using 'x'. But I want it to be closed by clicking on any radio button.
HTML:
<span>Book now <!--<div class="disp"><p>-->
<div id="light_<?php echo $vid;?>" class="white_content">
<label>Email:</label>
<?=$vehicle->Email; ?>
</p><p>
<label>Mobile:</label>
<?=$vehicle->Mobile; ?></p>
<p>
<form id="form_<?php echo $vid;?>" name="form1" method="post" action="">
<?php //echo $_REQUEST['email'];?>
<p>
<input type="hidden" name="vehicleid" value="<?php echo $vid;?>" id="vehicleid" />
<label>
<input type="radio" name="RadioGroup1_<?php echo $vid;?> " value="1" id="bstatus<?php echo $vid;?>" onClick="idForm(<?php echo $vid;?>)" />
Conform
</label>
<br />
<label>
<input type="radio" name="RadioGroup1<?php echo $vid;?>" value="0" id="bstatus1<?php echo $vid;?>" onClick="idForm(<?php echo $vid;?>)" />
Not Conform
</label>
<br />
</p>
</form>
<b>X</b>
</div>
<div id="fade" class="black_overlay"></div>
</div></span>
JS:
function idForm(str) {
var light = 'light_' + str;
var fade = 'fade' + str;
document.getElementById(light).style.display = 'none';
document.getElementById(fade).style.display = 'none';
var confirmval = 'bstatus' + str;
var unconfirmval = 'bstatus1' + str;
if (document.getElementById(confirmval).checked) {
var selectvalue = document.getElementById(confirmval).value;
}

Echoing/outputting information that was added to an input field on the same page

I'm creating a checkout system. I have three parts to it:
Shipping info
Payment info
Order confirmation
I'm trying to figure out a way that when the customer enters their shipping information, that data can be echo'd out onto my order confirmation part, so they can confirm that is where they want it shipped to.
The way I designed my checkout system is that all three parts are on the same page. Only one part shows at once and the others are hidden until the customer would click 'Proceed to xxxx'. When they click that Proceed button, nothing is being sent. It is just taking the div and showing it and hiding the previous div. Nothing is sent until when the customer clicks Submit order on the confirmation div.
I validate the fields and assigned them to variables so I can post the shipping and product info into my db.
if($validation->passed()) {
if(isset($_POST['create'])){
$fullname = trim( $_POST['customer_name'] );
$streetline1 = trim( $_POST['streetline1'] );
$streetline2 = trim( $_POST['streetline2'] );
$city = trim( $_POST['city'] );
$state = trim( $_POST['state'] );
$zipcode = trim( $_POST['zipcode'] );
$phone_number = trim( $_POST['phone_number'] );
$email = ( $_POST['email'] );
//etc...
Shipping Information Section:
<div class="shippinginfocontainer">
<span class="summarytitle">
<p>Enter Shipping Information</p>
</span><br>
<div class="center">
<div class="field">
<label class="paddingleft" for="fullname">Full Name</label>
<div class="center">
<input type="text" class="biginputbarinline" name="fullname" value="<?php echo escape(Input::get('firstname')); ?>" required>
</div>
</div>
<div class="field">
<label class="paddingleft" for="streetline1">Street Line 1</label>
<div class="center">
<input type="text" class="biginputbarinline" name="streetline1" value="<?php echo escape($user->data()->streetline1); ?>" required>
</div>
</div>
<div class="field">
<label class="paddingleft" for="streetline2">Street Line 2</label>
<div class="center">
<input type="text" class="biginputbarinline" name="streetline2" value="<?php echo escape($user->data()->streetline2); ?>">
</div>
</div>
<div class="field">
<label class="paddingleft" for="city">City</label>
<div class="center">
<input type="text" class="biginputbarinline" name="city" value="<?php echo escape($user->data()->city); ?>" required>
</div>
</div>
</div>
<div class="formleftcenter">
<div class="field">
<label for="state">State</label>
<input type="text" class="mediuminputbar" name="state" value="<?php echo escape($user->data()->state); ?>" required>
</div>
<div class="field">
<label for="Phone Number">Phone Number</label>
<input type="text" class="mediuminputbar" name="Phone Number" value="<?php echo escape($user->data()->phone_number); ?>">
</div>
</div>
<div class="formrightcenter">
<div class="field">
<label for="zipcode">Zip Code</label>
<input type="text" class="mediuminputbar" name="zipcode" value="<?php echo escape($user->data()->zipcode); ?>" required>
</div>
<div class="field">
<label for="email">Email</label>
<input type="text" class="mediuminputbar" name="email" value="<?php echo escape($user->data()->email); ?>" required>
</div>
</div>
<div class="clear">
<button class="checkoutbutton" id="button2">Proceed to Payment Information</button>
</div>
</div>
I won't add my payment part as it is irrelevant to this question.
Then this is the relevant part of the Confirmation part. I wasn't sure how to do this, so I just wrote in echo's to show what I am trying to do.
<div class="confirmshippinginfo">
<p>Shipping to:</p>
<p><?php echo $fullname; ?></p>
<p><?php echo $streetline1; ?></p>
<p><?php echo $streetline2; ?></p>
<p><?php echo $city . $state . $zipcode; ?></p>
</div>
</div>
<input type="hidden" name="token" value="<?php echo Token::generate(); ?>">
<input class="widebutton" type="submit" value="Place Your Order">
Is there a way to do this with keeping this all on the same page? I really do not want to have multiple pages for this and I like the way I have all of this formatted. I just can't figure out this part.
You could possibly use AJAX via serialize() of your form when you click a review button (as Matthew Johnson suggested). Second idea is something like this where you copy from one input to another, in a different part of your page. It would take a bit more work to set up than something like AJAX because you are basically duplicating a form. Using .html() inside a div or span placeholder would probably work too:
HTML:
<input type="text" class="copy-from" data-copy="name" name="name" />
<input type="text" class="this-elem" id="name" disabled />
CSS
.this-elem {
border: none;
font-size: 18px;
color: #333;
}
jQuery
$(document).ready(function() {
$(".copy-from").keyup(function() {
var ElemId = $(this).data('copy');
$("#"+ElemId).val($(this).val());
});
});
Demo
http://jsfiddle.net/fh5kfhtm/4/
EDIT: AJAX/PHP Solution
<!-- This is the placeholder for the data after submission -->
<div id="final"></div>
<!-- FORM, well really simplified form -->
<form id="orderform" method="post" action="process.php">
<input type="hidden" name="order_form" />
<input type="text" name="address" />
<!--
This triggers the ajax (you would use your
"Proceed to Order Confirmation" button)
-->
<div id="confirm">CONFIRM</div>
<input type="submit" name="submit" value="ORDER" />
</form>
new.php
File name/path must match what's in the AJAX url
<?php
if(isset($_POST['order_form'])) {
print_r($_POST);
exit;
}?>
jQuery AJAX
<!-- GET THE LIBRARIES (YOU SHOULD ALREADY HAVE THEM) -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js"></script>
<script>
$(document).ready(function() {
$("#confirm").click(function() {
$.ajax({
// This is where you need the right path to the new php file
url:'/path/to/new.php',
type: 'post',
data: $("#orderform").serialize(),
success: function(response) {
$("#final").html(response);
}
});
});
});
</script>

shows the div if the value of the input field matched

the hidden div will appear if the selected value from the form matches the value of the div
the script for detecting the value of the input field
<script> $(document).ready(function() {
$("input[name$='sel']").ready(function() {
var test = $(this).val();
$("div.desc").hide();
$("#sel" + test).show();
}); });
</script>
value of the field and the divs that are supposed to show when the value of the input field is correct
<table><tr><td> <strong><font size="3" >Payment Method</font></strong>
<p> <?php echo $_POST["sel"]; ?> <input type="radio" name="sel" value="<?php echo $_POST["sel"]; ?>" /> </p> <!====================================================================================> </td><td> <img src="img/sep.png" /> </td><td> <!====================================================================================> <div id="selCreditCard" class="desc"> <table><tr><td>
<p> <label for="card"><strong>Card Number : </font></strong></label><?php echo $_POST["card"]; ?>
<input name="card" type="hidden" id="card" value="<?php echo $_POST["card"]; ?>" style="width:85px;"
class="validate[custom[card]] text-input" /> </p> <br>
<label for="ccv" ><strong>CVV2 Code : </strong></label><?php echo $_POST["ccv"]; ?>
<input type="hidden" name="ccv" id="ccv" style="width:30px;margin-bottom:2px;margin-left:12px;" value="<?
php echo $_POST["ccv"]; ?>" />
<br>
<label><strong>Expiration Date</strong>
<p> <label for="mon"><strong>Month : </strong></label><?php echo $_POST["mon"]; ?>
<input type="hidden" name="mon" id="mon" style="width:15px;" value="<?php echo $_POST["mon"]; ?>" />
<label for="yir" ><strong>Year : </strong></label><?php echo $_POST["yir"]; ?>
<input type="hidden" name="yir" id="yir" style="width:15px;" value="<?php echo $_POST["yir"]; ?>" />
</p>
</div> <!====================================================================================> <div id="selPaypal" class="desc" style="display: none;margin-left:20px;margin-top:1px;margin-bottom:1px;"> Please make sure that you have paid the amount on the Paypal payment page.<br> If not click here to proceed <img src="img/ppal.png" height="36" style="margin-bottom:-13px;" onclick="window.open
('paypal/paypal.html','Paypal','width=450,height=300,left=160,top=170');" style="cursor:pointer;"/> </div> <!====================================================================================> <div id="selWireTransfer" class="desc" style="display: none;margin-left:20px;margin-top:0px;margin-bottom:-5px;"> <font size="0.5"> <strong>Processing Time</strong><br> A bank wire is not an instant transfer. "Two to three business days" are<br> required to process the transfer and
allow the recipient to see the wired funds.</font> </div> <!====================================================================================> </td></tr></table>
i cant get the divs to show on the next page even if the correct value was entered on the field what approach will be much efficient or do you think will work for this code?
You should have used click event on input.
<script>
$(document).ready(function() {
var test = $("input[name='sel']").val();
$("div.desc").hide();
$("#sel" + test).show();
});
</script>

Categories

Resources