I have built a basic contact from that has multiple divs, after testing this on my localhost without CMS it seems to work, but when i create a wordpress plugin and call the form via shortcode the post does not show any sign of being filled.
function pagechange(frompage, topage) {
var page=document.getElementById('formpage_'+frompage);
if (!page) return false;
page.style.visibility='hidden';
page.style.display='none';
page=document.getElementById('formpage_'+topage);
if (!page) return false;
page.style.display='block';
page.style.visibility='visible';
return true;
}
<form action="" method="post">
<div id="formpage_1" style="visibility: visible; display: block;">
<h1>We would Love to Hear about your Project!</h1>
<p>Please answer a few questions, this will save time on communication and help you receive an answer quickly.</p>
<?php if(isset($_POST['cf-submitted'])) {
$name = $_POST['name-form'];
echo $name;
} ?>
<input class="button1-form" type="button" value="next" onclick="pagechange(1,2);" />
</div>
<div id="formpage_2" style="visibility: hidden; display: none;">
<h4>What is your name?</h4>
<input type="text" name="name-form" />
<input class="next-btn-form" type="button" value="next" onclick="pagechange(2,3);" />
</div>
<div id="formpage_3" style="visibility: hidden; display: none;">
<h4>Hello! Tell us your Company Name?</h4><?php echo $name; ?>
<input type="text" name="companyname" />
<input class="next-btn-form" type="button" value="next" onclick="pagechange(3,4);" />
</div>
<div id="formpage_4" style="visibility: hidden; display: none;">
<h4>Tell us a bit about your Project?</h4>
<input type="text" name="project" />
<input class="next-btn-form" type="button" value="next" onclick="pagechange(4,5);" />
</div>
<div id="formpage_5" style="visibility: hidden; display: none;">
<h4>What is your email so we can contact you?</h4>
<input type="email" name="email" />
<input class="next-btn-form" type="submit" value="next" onclick="pagechange(5,1);" />
</div>
I just tested it on the jsfiddle, doesnt seem to be working either now, am i missing something here?
Im still learning so i am not the best XD
Alex
Related
I have an form with submit button as follows in html :-
<div style="display: flex;">
<form name="myform"method="post" action="usdbtc.php" style="float:left;">
<div id="log_err"> <strong><?php if(isset($logerror)) { echo $logerror; } else { $dn = 'dn'; } ?></strong> </div>
<p><label style="float: left;">Price:</label><input class="input101" style="float: left;" type="text" name="username" id="box1" oninput="calculate()"><label style="float: right;">: BTC</label><input class="input101" style="float: right;" type="text" name="username" id="box2" oninput="calculate()">
<br><input class="input101" style="float: right;" type="text" name="username" id="result"><br><label style="padding: 10px;">Total BTC:</label>
<td rowspan="2">
<input type="hidden" id="myform" value="1"/>
<br><span class="orderbutton" type="submit" id="ordersell" onclick="myform.submit()">SELL</span></p>
</td>
</form>
<form name="yourform"method="post" action="usdbtc.php" style="float:right;">
<p><label style="float: left;">Price:</label><input class="input101" style="float: left;" type="text" name="username" id="box3" oninput="calculate()"><label style="float: right;">: BTC</label><input class="input101" style="float: right;" type="text" name="username" id="box4" oninput="calculate()">
<br><input class="input101" style="float: right;" type="text" name="username" id="resul"><br><label style="padding: 10px;">Total BTC:</label>
<td rowspan="2">
<input type="hidden" id="yourform" value="1"/>
<br>
<span class="orderbutton" type="submit" id="orderbuy" onclick="yourform.submit()">BUY</span></p>
</td>
</form>
</div>
And to check whether user clicked 'SELL' button i do in php :-
if($_POST['myform']){
echo 'yes';
}
else {
echo 'no';
}
I am always getting no after clicking button, is there anything wrong that I haved coded in the html or php part? Help is appreciated.. I just want to get the part for php
if($_POST['?']) {...
Remember there are two forms in the page with each having name and hidden input id.
<input type="hidden" id="myform" value="1"/>
Change id attribute to name
<input type="hidden" name="myform" value="1">
And there's a missing space in form tag
I have a popup which shows up if the user is not logged in. It contains a cancel link, a form to enter details, and a forget password link. My problem is when the user comes back from the forget password link and clicks the cancel link, it takes them back to the forget password page.
Here is my code.
<div class="contactForm_new" id="popUpDiv" style="display:none;">
<!--<div class="lightBlue heading" >Tell us your Buy Requirement</div>-->
<div class="blueLightBG heading" style="text-align: left;
padding-left: 2%;background-color:#009bcb ">Enter Password <span class=" dpbl fr mainSp cr_bt2 p_a closeTrigger closePopup href" style="position: absolute; display: block;"></span></div>
<form method="post" class="contactF" id="login-form">
<input type="hidden" value="" name="offerid">
<input type="hidden" value="" name="refvalue">
<input type="hidden" value="" name="tenderid">
<input type="hidden" value="" name="item_id">
<input type="hidden" value="" name="pid">
<input type="hidden" value="sd" name="ref">
<input type="hidden" value="1" name="isLogRequest">
<input type="hidden" name="iso" id="iso" value="<?php echo $details['iso'] ?>">
<input type="hidden" value="<?php echo $return_en_url ?>" id="p_address" name="p_address">
<div class="errorMessage" id="errorUsername"></div>
<input type="hidden" name="diff_usr" value="Y">
<input type="hidden" value="Y" name="diff_usr">
<input class="pd3 textlogin_new" name="LoginForm[password]" id="LoginForm_password" type="password">
<div class="errorMessage" id="errorPassword"></div>
<div style="padding:15px 0;text-align:center">
<span id="imgprcp" class="fl" style=" display: none; text-align: center;margin-left:50%;"><img src="<?php echo Yii::app()->params['hostName'] ?>/images/ind.gif" alt="Proceeding"></span>
<input id="btnSubmit" type="button" name="yt0" value="Proceed" class="redBtn_new" >
</div>
<div class="mb3per" style="display:block">
<p class="k7_new" style="position:absolute;" >
<a class="k7_new" id="forgotpass" style="position:relative;" href="<?php echo Yii::app()->params['hostName'] ?>/forgotpass/?ref=<?php echo $ref ?>&p=<?php echo $return_en_url ?>" >Forgot Password?</a>
</p>
</div>
</form>
</div>
Can anybody suggest what am I doing wrong? All of my URLs are formed correctly.This problem is coming in only chrome browser.In another browser it is working fine
I have a file called form.php and when I upload it to my server, that supports php, the form keeps on repeating and never executes the php code. I uploaded it at http://davidjahn.info/DavidJahnNet/form.php
<?php
$age=$_POST["age"];
echo $age;
?>
<html>
<head>
<title>Survey</title>
<style type="text/css">
.welcome {
color: #FFFFFF;
text-align: center;
background-color:red;
font-weight:bold;
height: 50px;
}
</style>
</head>
<body>
<table style="height: 232px; width: 500px">
<form method="post" id="survey" action="form.php">
<tr>
<td>
<div class="welcome"><br>Welcome!</div>
</td>
</tr>
<tr>
<td>
<ul>
<br>
<br>
<div id="question1" style="display: inline;">
<h3>
Are You 30+ Years Old?
</h3>
<div style="height: 10px"></div>
<input type="button" name="age" value="Yes" onclick="document.getElementById('question1').style.display='none';document.getElementById('question2').style.display='inline';">
<input type="button" name="age" value="No" onclick="document.getElementById('question1').style.display='none';document.getElementById('question2').style.display='inline';">
</div>
<div id="question2" style="display: none;">
<h3>
Are You Looking for a Date?
</h3>
<div style="height: 10px"></div>
<input type="button" name="date" value="Yes" onclick="document.getElementById('question2').style.display='none';document.getElementById('question3').style.display='inline';">
<input type="button" name="date" value="No" onclick="document.getElementById('question2').style.display='none';document.getElementById('question3').style.display='inline';">
</div>
<div id="question3" style="display: none;">
<h3>
Which Girl Is Your Type?
</h3>
<div style="height: 10px"></div>
<input type="image" src="http://healthystartups.com/storage/600px-MA_Route_1.png?__SQUARESPACE_CACHEVERSION=1319542839834" alt="Submit" width="100px" value="type1" />
<input type="image" src="http://jenntgrace.com/wp-content/uploads/2012/12/2.png" alt="Submit" width="100px" value="type2" />
<input type="image" src="http://3.bp.blogspot.com/-Q_owQUxNjdQ/Te3ALCmT3oI/AAAAAAAAAnk/wv9r0b0MT-g/s1600/600px-MA_Route_3.svg_.jpg" alt="Submit" width="100px" value="type3" />
<input type="image" src="http://4.bp.blogspot.com/-wY_qFr2pcAs/UCxhAayJ6oI/AAAAAAAAC6w/PgtLs2O_4g8/s1600/4.png" alt="Submit" width="100px" value="type4" />
</div>
</ul>
</td>
</tr>
</form>
</table>
</body>
</html>
PHP is a server-side language. You need a server running PHP to write PHP pages. You can't simply save them and open them in your browser.
Look into something like XAMPP which will get you up-and-running quickly with a development environment.
Are you testing this on localhost ? I think you don't have WAMP installed and you are trying to view .php file without php server & you must know that php is server side language. Install EasyPHP and then you will be able to run .php
http://www.easyphp.org/
You should use buttons for submitting. I have edited your code to do the following:
buttons that have cover images of the four types
hidden values to represent age, date
Code:
<?php
if (isset($_POST['age'])) {
$age=$_POST["age"];
echo $age;
}
?>
<html>
<head>
<title>Survey</title>
<style type="text/css">
.welcome {
color: #FFFFFF;
text-align: center;
background-color:red;
font-weight:bold;
height: 50px;
}
.type1 {
background-image: url(http://healthystartups.com/storage/600px-MA_Route_1.png?__SQUARESPACE_CACHEVERSION=1319542839834);
}
.type2 {
background-image: url(http://jenntgrace.com/wp-content/uploads/2012/12/2.png);
}
.type3 {
background-image: url(http://3.bp.blogspot.com/-Q_owQUxNjdQ/Te3ALCmT3oI/AAAAAAAAAnk/wv9r0b0MT-g/s1600/600px-MA_Route_3.svg_.jpg);
}
.type4 {
background-image: url(http://4.bp.blogspot.com/-wY_qFr2pcAs/UCxhAayJ6oI/AAAAAAAAC6w/PgtLs2O_4g8/s1600/4.png);
}
input[type=submit]{
border: none;
width: 100px;
height: 100px;
background-size:cover;
}
</style>
</head>
<body>
<table style="height: 232px; width: 500px">
<form method="post" id="survey" action="form.php">
<input type="hidden" name="age" id="age">
<input type="hidden" name="date" id="date">
<tr>
<td>
<div class="welcome"><br>Welcome!</div>
</td>
</tr>
<tr>
<td>
<ul>
<br>
<br>
<div id="question1" style="display: inline;">
<h3>
Are You 30+ Years Old?
</h3>
<div style="height: 10px"></div>
<input type="button" value="Yes" onclick="document.getElementById('question1').style.display='none';document.getElementById('question2').style.display='inline';document.getElementById('age').value='Yes'">
<input type="button" value="No" onclick="document.getElementById('question1').style.display='none';document.getElementById('question2').style.display='inline';document.getElementById('age').value='No'">
</div>
<div id="question2" style="display: none;">
<h3>
Are You Looking for a Date?
</h3>
<div style="height: 10px"></div>
<input type="button" value="Yes" onclick="document.getElementById('question2').style.display='none';document.getElementById('question3').style.display='inline';document.getElementById('date').value='Yes'">
<input type="button" name="date" value="No" onclick="document.getElementById('question2').style.display='none';document.getElementById('question3').style.display='inline';document.getElementById('date').value='No'">
</div>
<div id="question3" style="display: none;">
<h3>
Which Girl Is Your Type?
</h3>
<div style="height: 10px"></div>
<input type="submit" value="1" class="type1" name="type" />
<input type="submit" value="2" class="type2" name="type" />
<input type="submit" value="3" class="type3" name="type" />
<input type="submit" value="4" class="type4" name="type" />
</div>
</ul>
</td>
</tr>
</form>
</table>
</body>
</html>
Make sure you are running your code on a localhost server because PHP only works on server side not client side.
If you are running it correctly use this for better practice:
if(isset($_POST['age'])){
$age=$_POST["age"];
echo $age;
}
Your Javascript and HTML doesn't make much sense if you are looking for the age field.
The age elements that you have are two buttons.
You could solve this by using <input type="hidden" name="age" value=""> and then modifying the value of this using Javascript, when the user clicks your buttons (if you do this, change the name attribute of your buttons).
OR you could solve it by replacing the buttons with radio buttons.
Simply replace <input type="button" name="age" ...
with <input type="radio" name="age" ...>
I'm not sure what you're trying to say. Could you elaborate a bit more?
On the other hand, by taking a rough guess, it could be your browser. Try add
<!DOCTYPE html>
above
<html>
EDIT: If you're talking about PHP printing rather than doing what it's meant to do. Well just to let you know, PHP is a server side scripting language. It needs to be processed via PHP engine. Are you on a shared web host or did you setup your own server?
It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center.
Closed 10 years ago.
<li style="padding: 5px; width: 150px; overflow: hidden; float: left; height: 202px;">
<div class="title"> Castle Bounce House </div>
<div class="image"> <img height="100" width="130" border="0" src="http://newsite.domain.com/images/stories/virtuemart/product/resized/castle_themed_bo_4f844059227b89_90x90.jpg"> </div>
$949.00
<div class="addtocart">
<div class="addtocart-area">
<form action="index.php?option=com_virtuemart&view=cart" class="product" method="post">
<div class="addtocart-bar">
<label class="quantity_box" for="quantity68"> </label>
<span class="quantity-box">
<input type="text" value="1" name="quantity[]" class="quantity-input">
--> </span> <span class="quantity-controls">
<!--<input type="button" class="quantity-controls quantity-plus" />
<input type="button" class="quantity-controls quantity-minus" />-->
</span> <span class="addtocart-button">
<input type="submit" value=" " class="addtocart-button" name="addtocart">
</span>
<div class="clear"></div>
</div>
<input type="hidden" value="Castle Bounce House" class="pname">
<input type="hidden" value="com_virtuemart" name="option">
<input type="hidden" value="cart" name="view">
<noscript>
<input type="hidden" name="task" value="add" />
</noscript>
<input type="hidden" value="68" name="virtuemart_product_id[]">
<input type="hidden" value="7" name="virtuemart_category_id[]">
</form>
<div class="clear"></div>
</div>
</div>
</li>
i have this 'li' tag and it's cloning properly i have matched every line but their is submit button in both original and clone object and when i submitting my page through the original then it is working properly.But when i submitting my page through the clone then their functionality is not working properly can any one tell me what is the problem with the cloning in jquery.
this is my clone object :
<li style="padding: 5px; width: 150px; overflow: hidden; float: left; height: 202px;">
<div class="title"> Castle Bounce House </div>
<div class="image"> <img height="100" width="130" border="0" src="http://newsite.domain.com/images/stories/virtuemart/product/resized/castle_themed_bo_4f844059227b89_90x90.jpg"> </div>
$949.00
<div class="addtocart">
<div class="addtocart-area">
<form action="index.php?option=com_virtuemart&view=cart" class="product" method="post">
<div class="addtocart-bar">
<label class="quantity_box" for="quantity68"> </label>
<span class="quantity-box">
<input type="text" value="1" name="quantity[]" class="quantity-input">
--> </span> <span class="quantity-controls">
<!--<input type="button" class="quantity-controls quantity-plus" />
<input type="button" class="quantity-controls quantity-minus" />-->
</span> <span class="addtocart-button">
<input type="submit" value=" " class="addtocart-button" name="addtocart">
</span>
<div class="clear"></div>
</div>
<input type="hidden" value="Castle Bounce House" class="pname">
<input type="hidden" value="com_virtuemart" name="option">
<input type="hidden" value="cart" name="view">
<noscript>
<input type="hidden" name="task" value="add" />
</noscript>
<input type="hidden" value="68" name="virtuemart_product_id[]">
<input type="hidden" value="7" name="virtuemart_category_id[]">
</form>
<div class="clear"></div>
</div>
</div>
</li>
Keep in mind that with .clone(true) (see the "true"?) the HTML code and all events are cloned. Also make sure not HTML ids are in the copied area, since only the last occurrence of the multiple same ids will be found.
I made once a hard search and replace on the cloned HTML string to replace the ids, and inserted it afterwards.
I have had problems with
$elem.clone().function1().function2().bla().bla();
try
var $elemToClone = $elem.clone();
and
$elemToClone.function1().function2().bla().bla();
after.
Also share the js code.
Here's the code:
<div id="regpage">
<form action="" method="post">
<fieldset style="border:none;">
<div class="label">Username:</div> <input type="text" name="username" class="item" value="" /><br />
<div class="caption">Must be 5-15 characters</div><br />
<div style="clear:both;"></div>
<div class="label">Password:</div> <input type="password" name="password" class="item" value="" /><br />
<div class="caption">Must be 6-20 characters</div><br />
<div style="clear:both;"></div>
<div class="label">Email:</div> <input type="text" name="email" class="item" value="" /><br />
<div class="caption">Valid email address is required</div><br />
<div style="clear:both;"></div>
<input name="terms" type="checkbox" id="terms" value="agree" /><div class="caption2"><label for="terms">I agree to the terms and conditions</label></div>
<p><input type="submit" name="register" value="Register" id="register" style="float:left;border:1px solid #999;background:#E4E4E4;margin-top:5px;" /></p><br />
</fieldset>
</form>
</div>
And the id "regpage" is definded in the style.css as:
#regpage {
width: 356px;
height: 150px;
color: #000000;
font-family: "Tahoma", Arial, Helvetica, sans-serif;
font-size: 13px;
}
If I move the checkbox OUT of <div id="regpage"> it works just fine. But inside it will not interact in Mozilla. I've even tried adding onclick='this.checked="checked"' and it still does not interact. You can click until your blue in the face and nothing will happen.
What's the deal! This is REALLY driving me batty.
I don't see any problem: http://jsfiddle.net/cXRPd/ (Firefox 3.0.19)
Found it myself: My div's height wasn't set high enough. It didn't expand enough to cover the checkbox.
Setting the height to 250 fixed the problem.
My overflow is set to hidden, but apparently it still blocked the ability to interact with the box.