How to get Form Element Value using JavaScript - php

I am trying to find value of the input element in a popup window which is being opened from a parent page.
My code is below. I am getting not able to get pc value from input.
<html>
<head>
<?
$pid=$_GET['pid'];
$cart_url = '../cart.php?action=add&p='.$pid;
echo $cart_url;
?>
</head>
<body>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function sendValue(val){
window.opener.document.getElementById('details_<?=$pid?>').value = val;
window.opener.location.href='<?php echo $cart_url; ?>&pc='.concat(val);
window.close();
window.location.reload();
}
</script>
<form name="selectform">
<label>Enter Price:</label>
<input id="1" name="details_<?=$pid?>" type="text"></input>
<input type="Submit" onsubmit="sendValue(this.value)"></input>
</form>
</body>
</html>

Code:
<input id="1" name="details_<?=$pid?>" type="text"></input>
<input type="Submit" onsubmit="sendValue(this.value)"></input>
Change to:
<input id="details" type="text">
<input type="button" value='Send...' onclick="sendValue(document.getElementById('details').value)">

Just make your input box id from
<input id="1" name="details_<?=$pid?>" type="text"></input>
to
<input id="details_<?=$pid?>" name="details_<?=$pid?>" type="text"></input>
It should work

If you're using getElementById, you have to use pass the id of the element you're trying to get the value from (in this case 1).

Related

Adding or deleting automatically rows in a form, processed with PHP

I'm using the script below to automatically add new lines in a form, but I do not see how to retrieve the values ​​of each field under PHP with $_POST.
If someone has already had this problem with a table in a form, thank you for helping me!
what procedure to retrieve in test5.php the values ​​of the fields.
I do not know how to get an array in a $_POST
thank you in advance
Here is my script
<html>
<head>
</head>
<body>
<form action="test5.php" method="post">
<div id="address">
<div id="1" name="address[]">
<input id="mail" type="text" />
<input id="type" type="text" />
<input id="comment" type="text" />
×
</div>
</div>
<input id="add_address" type="button" value="Ajouter" />
<input type="submit" value="Create PDF" />
</form>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$('#add_address').click(function(event) {
var lastDiv = $('#address > div').last();
var id = parseInt(lastDiv.attr("id")) + 1;
(lastDiv.clone(true).attr("id", id)).insertAfter(lastDiv).find(".removeclass").show();
return false;
});
$('body').on('click', '.removeclass', function(event) {
$(this).parent().remove();
return false;
})
</script>
</body>
</html>
1.) Remove the name-attribute from the div-element
2.) Build your input-elements like:
<div id="..">
<input type="..." name="address[1][mail]" />
<input type="..." name="address[1][type]" />
<input type="..." name="address[1][comment]" />
</div>
<div id="..">
<input type="..." name="address[2][mail]" />
<input type="..." name="address[2][type]" />
<input type="..." name="address[2][comment]" />
</div>
I modified my script as below and in test5.php, I can view the data with this script.
<? Php
// print_r ($ _ POST);
echo $ _POST ['mail'] [2];
?>
Thanks
-------------test5.php-------------
<div id="address">
<div id="1">
<input type="text" name="mail[]" />
<input type="text" name="type[]" />
<input type="text" name="comment[]" />
</div>
</div>

printing users input into an input field using php

how can I get users input and print it into another text field input?
I'm using php. I have 2 input types of text and one submit button. i want to be able to print the results of input A into the input textbox B
example:
<form>
<input type="text" name="input"/> <!-- thiss is where the user enters text -->
<input type="text" name="output"/> <!-- I take that text out and output it here -->
<input type="submit" value="submit" <?php echo $input;/>
</form>
I keep trying to echo "$input" into output but not working.
hope this will help
<?php
$output= (isset($_POST['submit']))?$_POST['input']:'';
?>
pure php. <br>
try to input value in input field then submit.
<form method="post">
<input type="text" name="input"/> <!-- thiss is where the user enters text -->
<input type="text" name="output" value="<?php echo $output;?>"/> <!-- I take that text out and output it here -->
<input type="submit" name="submit" value="submit">
</form>
using javascript onchange.<br>try to input value in field input1
<form method="post">
<input type="text" id="input1" name="input1" onchange="clone();"/> <!-- thiss is where the user enters text -->
<input type="text" id="output1" name="output1" /> <!-- I take that text out and output it here -->
<input type="submit" name="submit1" value="submit">
</form>
<script>
function clone()
{
var x = document.getElementById("input1").value; document.getElementById("output1").value=x;
}
</script>
You cannot do this with PHP since PHP is a server side language. It does not support client side manipulation.
You will need something like this.
<script type="text/javascript">
$(document).ready(function () {
$(document).on('change', 'input[name="input"]', function () {
var contents = $(this).val();
$('input[name="outut"]').val(contents);
})
});
</script>
<!-- HTML -->
<form method="post">
<input type="text" name="input" />
<input type="text" name="output" value="" />
<input type="submit" name="submit" value="submit">
</form>
For more information about jQuery take a look at this W3Schools article
May be this what you are looking for using simple javascript events
function myFunction(){
var a=document.getElementById('a').value;
document.getElementById('b').value= a
}
<form>
<input type="text" name="input" onkeydown="myFunction()" onkeydown="myFunction()" id="a"/> <!-- thiss is where the user enters text -->
<input type="text" name="output" id ="b"/> <!-- I take that text out and output it here -->
<input type="submit" value="submit" >
</form>

Hiding div when is submitted and send values to PHP

<?php
echo $_POST['textvalue'];
echo $_post['radiovalue'];
?>
<div id="hidethis">
<form method="POST" action="">
<label>Tekst Value</label>
<input type="text" name="textvalue">
<label>Radio Value</label>
<input type="radio" name="radiovalue" value="autogivevalue">
<input type="submit" id="submit" name="submit" value="submit">
</div>
http://jsfiddle.net/Bjk89/2/ here is it with the jQuery.
What i try to do is to hide the <div id="hidethis"> when it's clicking submit.
I know i can make another page where i can recieve the values without the <form> section, but i want to put both in one page, make the <div id="hidethis"> hidden after submit.
So i'll be able to get echo $_POST['textvalue']; and echo $_post['radiovalue']; as results
RESULT MUST BE LIKE
A Text // This is the value you input into Tekst Value
autogivevalue // This is the value from the radio button
----- INVISIBLE -----
<form is hidden because we set it in jQuery so>
</form>
Try this. No need to use jQuery here.
<?php
if($_POST) {
echo $_POST['textvalue'];
echo $_post['radiovalue'];
} else {
?>
<form method="POST" action="">
<label>Tekst Value</label>
<input type="text" name="textvalue">
<label>Radio Value</label>
<input type="radio" name="radiovalue" value="autogivevalue">
<input type="submit" id="submit" name="submit" value="submit">
</form>
<?php
}
?>
Try adding '#' in your jquery code. Your version does not have # next to submit. Also your form is missing a closing tag here and in your JSFiddle code.
Try this:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function () {
$('#submit').click(function () {
$('form').submit();
$('#hidethis').hide();
});
});
</script>
<form method='post' id="hidethis" name='form'>
<input type="text" name="textvalue">
<input type="radio" name="radiovalue" value="1">
<input type="button" id="submit" name="submit" value="submit">
</form>

Submit Only One of Two toggling forms

I have two different forms which are being included in a php file. Their visibility is based on a onClick JS toggle function. The toggle works great. However if I was to fill only one of the forms out and click its respective submit button, I get sent back to the same page rather than the action.php file that i have specifed with this in the broswer:
http://localhost/?user_temp=f&pass_temp1=f&pass_temp2=ff&email_temp=f&answer1=3&submitbtn=Signup+Now
And this Javascript error: "TypeError undefined document.hform.sSecureUser
Both Forms also have their own javascripts to MD5 some data and sSecureUser comes from the Signup Form.
Interestingly, if I was to remove one of the inlcude forms leaving only the Submit form lets say, it would work. It seems that these forms' javascript is clashing with one another :/ ...
I tried this but it didnt work for me since each one of my forms is using java script. PLEASE HELP AND THANKS IN ADVANCE!!!... Let me know if you would like to see any of my forms, javascript, or php files...
Toggle Code:
<div>
Login
<div id="login-div" style="display:none">
<?php include($_SERVER['DOCUMENT_ROOT'].'/forms/login-form.php');?>
</div>
Sign up
<div id="signup-div" style="display:none">
<?php include($_SERVER['DOCUMENT_ROOT'].'/forms/signup-form.php'); ?>
</div>
<script type="text/javascript">
<!--
function toggle_visibility(id) {
var e = document.getElementById(id);
if(e.style.display == 'block'){
e.style.display = 'none';
}
else{
e.style.display = 'block';
}
}
//-->
</script>
</div>
Login Form:
<div id="hasJavaScript1" style="display:none">
<form name="login">
Username:
<input type="text" name="user_temp" size=32 maxlength=32><br>
Password:
<input type="password" name="pass_temp" size=32 maxlength=32><br>
<input onClick="passResponse(); return false;" type="submit" name="submitbtn" value="Login now">
</form>
<form action="/action/login-action.php" METHOD="POST" name="hform">
<input type="hidden" name="secureuser">
<input type="hidden" name="securepass">
</form>
</div>
<script language="javascript" src="/js/md5.js"></script>
<script language="javascript">
<!--
document.getElementById('hasJavaScript1').style.display = 'block';
function passResponse() {
document.hform.secureuser.value = MD5(document.login.user_temp.value);
document.hform.securepass.value = MD5(document.login.pass_temp.value);
document.login.pass_temp.value = "";
document.hform.submit();
}
// -->
</script>
SignUP Form:
<?php include ($_SERVER['DOCUMENT_ROOT'].'/functions/functions.php');?>
<div id="hasJavaScript" style="display:none">
<form name="signup">
<label>Username</label> <input type="text" name="user_temp" size=32 maxlength=32><span>alphanumeric, no spaces</span><br>
<label>Type password</label> <input type="password" name="pass_temp1" size=32 maxlength=32><span>alphanumeric, 8-12 long</span><br>
<label>Retype password</label> <input type="password" name="pass_temp2" size=32 maxlength=32><br>
<label>Email</label> <input type="text" name="email_temp" size=32 maxlength=32><br>
<label> What is: </label><?php $captchaArray = myCaptcha(); echo $captchaArray['equation'];?><br>
<label>Answer</label><input type="text" name="answer1">
<input onClick="passResponse1(); return false;" type="submit" name="submitbtn" value="Signup Now">
</form>
<form action="/action/signup-action.php" METHOD="POST" name="signup-hform">
<input type="hidden" name="sSecureUser">
<input type="hidden" name="sSecurePass1">
<input type="hidden" name="sSecurePass2">
<input type="hidden" name="secureEmail">
<input type="hidden" name="answer2">
<input type="hidden" name="checker" value=".<?php echo $captchaArray['answer'];?> .">
</form>
</div>
<script language="javascript" src="/js/md5.js"></script>
<script language="javascript">
<!--
document.getElementById('hasJavaScript').style.display = 'block';
function passResponse1() {
document.signup-hform.sSecureUser.value = MD5(document.signup.user_temp.value);
document.signup-hform.sSecurePass1.value = MD5(document.signup.pass_temp1.value);
document.signup.pass_temp1.value = "";
document.signup-hform.sSecurePass2.value = MD5(document.signup.pass_temp2.value);
document.signup.pass_temp2.value = "";
document.signup-hform.secureEmail.value = MD5(document.signup.email_temp.value);
document.signup-hform.answer2.value = document.signup.answer1.value;
document.signup.answer1.value = "";
document.signup-hform.submit();
}
// -->
</script>
One problem I see is that you do not specify any value attributes or values in your hidden fields:
<input type="hidden" name="sSecureUser">
<input type="hidden" name="sSecurePass1">
<input type="hidden" name="sSecurePass2">
<input type="hidden" name="secureEmail">
<input type="hidden" name="answer2">
But then in your JS, you're trying to access the value attribute.
document.hform.sSecureUser.value = ...
Try adding values to those. I would also give your hidden forms ids and use the document.getElementById() syntax instead of the document.hform.sSecureUser syntax.
As far as your form submits, you are suppressing the action of the first form, trying to fill in values for the hidden fields in the second form and then submitting that. Both of your scripts use the same name for the forms "hform". They need to be unique. I would also give them a unique id.
Another possible issue is this line:
<input type="hidden" name="checker" value=".<?php echo $captchaArray['answer'];?> .">
You're using the . for string concatenation, but it's not in an echo/print statement. I think it's supposed to be:
<input type="hidden" name="checker" value="<?php echo $captchaArray['answer'];?>">

How to submit an HTML form on loading the page?

How to submit this form without using submit button. I want to submit it in loading this form,
<form name="frm1" id="frm1" action="../somePage" method="post">
Please Waite...
<input type="hidden" name="uname" id="uname" value="<?php echo $uname;?>" />
<input type="hidden" name="price" id="price" value="<?php echo $price;?>" />
</form>
You don't need Jquery here!
The simplest solution here is (based on the answer from charles):
<html>
<body onload="document.frm1.submit()">
<form action="http://www.google.com" name="frm1">
<input type="hidden" name="q" value="Hello world" />
</form>
</body>
</html>
You can try also using below script
<html>
<head>
<script>
function load()
{
document.frm1.submit()
}
</script>
</head>
<body onload="load()">
<form action="http://www.google.com" id="frm1" name="frm1">
<input type="text" value="" />
</form>
</body>
</html>
Do this :
$(document).ready(function(){
$("#frm1").submit();
});
You can do it by using simple one line JavaScript code and also be careful that if JavaScript is turned off it will not work. The below code will do it's job if JavaScript is turned off.
Turn off JavaScript and run the code on you own file to know it's full function.(If you turn off JavaScript here, the below Code Snippet will not work)
.noscript-error {
color: red;
}
<body onload="document.getElementById('payment-form').submit();">
<div align="center">
<h1>
Please Waite... You Will be Redirected Shortly<br/>
Don't Refresh or Press Back
</h1>
</div>
<form method='post' action='acction.php' id='payment-form'>
<input type='hidden' name='field-name' value='field-value'>
<input type='hidden' name='field-name2' value='field-value2'>
<noscript>
<div align="center" class="noscript-error">Sorry, your browser does not support JavaScript!.
<br>Kindly submit it manually
<input type='submit' value='Submit Now' />
</div>
</noscript>
</form>
</body>
using javascript
<form id="frm1" action="file.php"></form>
<script>document.getElementById('frm1').submit();</script>
You missed the closing tag for the input fields, and you can choose any one of the events, ex: onload, onclick etc.
(a) Onload event:
<script type="text/javascript">
$(document).ready(function(){
$('#frm1').submit();
});
</script>
(b) Onclick Event:
<form name="frm1" id="frm1" action="../somePage" method="post">
Please Waite...
<input type="hidden" name="uname" id="uname" value=<?php echo $uname;?> />
<input type="hidden" name="price" id="price" value=<?php echo $price;?> />
<input type="text" name="submit" id="submit" value="submit">
</form>
<script type="text/javascript">
$('#submit').click(function(){
$('#frm1').submit();
});
</script>

Categories