I have a input text field. I need to pass the values entered inside the element through onClick of javascript.
<form>
<fieldset>
<label>Common Site ID: </label><span><?php echo $commonsiteid ?></span><br>
<label>Acres: </label><input id="acre_value" name="acre_value" type="text" value="<?php echo $acre; ?>">
</fieldset>
</form>
<input type="submit" value="submit" onclick="saveValue('<?php echo $_REQUEST['acre_value'] ?>')">
I am passing the value through submit onClick, Which is going empty. How do i pass value in this onclick function.
Try this:
<input type="submit" value="submit" onclick="saveValue(document.getElementById('acre_value').value);">
Have you tried writing something like following.
<input type="submit" value="submit" onclick="saveValue(document.getElementById('acre_value').value)">
I try this, and worked:
<script>
function saveValue(){
alert(document.formName.hiddenField.value);
/*do something*/
return false;
}
</script>
<form name="formName" method="post">
<input type="hidden" name="hiddenField" value="<?php echo $_REQUEST['acre_value'] ?>"/>
<input type="submit" value="submit" onclick="saveValue()">
</form>
As you can see, i pass the value by a hidden field, and on the Js function i get the value of this field.If you need a php function instead off a js, it's the same logic.
Related
<form name="payform" action="payment.html" method="POST">
Amount: <input type="text" id="amount">
<button id="buttonPay" type="submit" onclick="someFunction()">Submit</button>
</form>
I need to post the text box content along with some variables which are defined outside of the form.
To pass any data with a form submit you could add an input hidden tag inside your form (it has to be inside the form tag):
<input type="hidden" name="varKey" value="varVal" />
If the data lies outside the form tag for some reason, use jQuery to get the data and update the hidden tag's value
<?php
$out_side_var = "myData";
?>
<form name="payform" action="payment.html" method="POST">
Amount: <input type="text" id="amount">
<input type="hidden" name="myData" id="myData" value='<?php echo $out_side_var ?>'>
<button id="buttonPay" type="button" onclick="someFunction()">Submit</button>
</form>
Can I Make a 2 second interval before the auto-save perform? this code shows my webpage with a single textbox in it, and it auto show my DTRSearch.php result. This code is working perfectly.
<div id="search">
<input type="text" placeholder="Scan" id="t1" name="t1" onkeyup="aa();"
autofocus/></div>
<script type="text/javascript">
function aa(){
xmlhttp=new XMLHttpRequest();
xmlhttp.open("GET","DTRSearch.php?
nmnm="+document.getElementById("t1").value,false);
xmlhttp.send(null);
document.getElementById("searchdiv").innerHTML=xmlhttp.responseText;
document.getElementById("searchdiv").style.visibility='visible';
}
</script>
<div id="searchdiv" style="visibility:hidden; position:absolute">
</div>
DTRSearch.php it query a single row, this a simple form with a submit button, i want this form to perform an auto-save but before that it should show the form for 2 second
<form action="GetDTRSearch.php" method="get">
<input type="text" value="<?php echo $id_number;>" name="ID_Number" /><br />
<input type="text" value="<?php echo $fullname; ?>"name="Fullname" /><br />
<p class="Ok"><input type="submit" value="Click Confirm" /></p>
Change the button to a simple button instead of an input type submit. Instead, add a click listener to the Submit button. The click listener should call a setTimeout() function to execute the form submission after 2 seconds.
<form id="theForm" action="DTRSearch.php" method="get">
<input type="text" value="<?php echo $id_number;>" name="ID_Number" /><br />
<input type="text" value="<?php echo $fullname; ?>"name="Fullname" /><br />
<p class="Ok"><button id="submitButton" value="Click Confirm" /></p>
Then, assuming you have JQuery, add the following script:
<script>
$(document).ready(function() {
$("#submitButton").click(function() {
setTimeout(function() {
$("#theForm").submit();
}, 2000);
});
});
</script>
This is the sample html code you need to change.
<form name="myForm" id="myForm" action="GetDTRSearch.php" method="get">
<input type="text" value="<?php echo $id_number;>" name="ID_Number" /><br />
<input type="text" value="<?php echo $fullname; ?>"name="Fullname" /><br />
<p class="Ok"><input type="submit" value="Click Confirm" /></p>
</form>
Below code the form will be automatically post back to server after 2 seconds to the action method.
make sure this code will be executed after the data will fetch from DTRSearch.php else it will send blank value to the server. You can use this on submit click or you can directly make function and call this after data is fetched.
setTimeout(function() {
document.forms["myForm"].submit();
}, 2000);
This is my code that I am using to submit form with post value
<form action="<?php echo DOMAIN; ?>contact/booking-form.php" method="post">
<input type="text" name="name" value="<?php echo $name; ?>" />
<input type="text" name="email" value="<?php echo $email; ?>" />
<input type="submit" name="submit" id="submit" />
<script>document.getElementById('submit').submit();</script>
</form>
Can anybody help me to pass name="submit" value of submit button to another page?
A submit button is only going to be a successful control if it is used to submit the form (and even then only if it has a name and a value … which yours does not).
If you want submit=submit in your form data when you submit the form with JavaScript, then don't use a submit button to put that data in the form in the first place. Use a hidden input.
<input type="submit">
<input type="hidden" name="submit" id="submit" value="submit">
Then you have two other problems.
First, submit is a method of form elements, not inputs. So you need to change your script to call the right element.
<script>document.getElementById('submit').form.submit();</script>
Second, if a form has a control called submit then that will clobber the submit method. So you need to get one from a different form (not supported in old versions of Internet Explorer):
<script>
var form = document.getElementById('submit').form;
var submit_method = document.createElement("form").submit;
submit_method.call(form);
</script>
<form id=submit action="<?php echo DOMAIN; ?>contact/booking-form.php" name="form1" method="post">
<input type="text" name="name" value="<?php echo $name; ?>" />
<input type="text" name="email" value="<?php echo $email; ?>" />
</form>
<script >
document.form1.submit()
</script>
there is no sumit button in your code. first add in html
<input type="submit" value="submit" id="submit"/>
<script>
document.getElementById("submit").value = "newSubmitButtonValue";
</script>
What I'm trying to do
On the user click, I wish to focus on the first input in the (only) form inside the child div with the class detailEdit.
The jQuery code I have works - but it seems like a fairly long way round. Is there a shorthand version?
My Code
HTML/PHP
<div class="detailEdit">
<form id="frm_contact">
<span>Office:</span><br/>
<input type="text" placeholder="Company Telephone" id="frm_tel2" name="tel2" maxlength="11" value="<?php echo $userData['tel1']; ?>" />
<span>Mobile:</span><br/>
<input type="text" placeholder="Mobile Number" id="frm_tel1" name="tel1" maxlength="11" value="<?php echo $userData['tel2']; ?>" />
<input type="submit" value="Submit" name="submit" />
</form>
</div>
jQuery
$(this).children('div.detailEdit').first().children('form').first().children('input').first().focus();
Try something like this :
$('.detailEdit').find('input:first').focus();
You have input id, why not use it
$('#frm_tel2').focus();
you can also use
$('.detailEdit input:first').focus();
try this:
$('#frm_contact').find('input:first').focus();
or this if you don't want to use id of the form:
$('.detailEdit').find('form').find('input:first').focus();
I'm currently working on a basic form. When you hit the submit button, it should first change the value of a field, and then submit the form as usual. It all looks a bit like this:
<form name="myform" id="myform" action="action.php">
<input type="hidden" name="myinput" value="0" />
<input type="text" name="message" value="" />
<input type="submit" name="submit" onclick="DoSubmit()" />
</form>
And this is how far I've come with the JavaScript code. It changes "myinput"'s value to 1, but it does not submit the form.
function DoSubmit(){
document.myform.myinput.value = '1';
document.getElementById("myform").submit();
}
You could do something like this instead:
<form name="myform" action="action.php" onsubmit="DoSubmit();">
<input type="hidden" name="myinput" value="0" />
<input type="text" name="message" value="" />
<input type="submit" name="submit" />
</form>
And then modify your DoSubmit function to just return true, indicating that "it's OK, now you can submit the form" to the browser:
function DoSubmit(){
document.myform.myinput.value = '1';
return true;
}
I'd also be wary of using onclick events on a submit button; the order of events isn't immediately obvious, and your callback won't get called if the user submits by, for example, hitting return in a textbox.
document.getElementById("myform").submit();
This won't work as your form tag doesn't have an id.
Change it like this and it should work:
<form name="myform" id="myform" action="action.php">
Here is simple code. You must set an id for your input. Here call it 'myInput':
var myform = document.getElementById('myform');
myform.onsubmit = function(){
document.getElementById('myInput').value = '1';
myform.submit();
};
No. When your input type is submit, you should have an onsubmit event declared in the markup and then do the changes you want. Meaning, have an onsubmit defined in your form tag.
Otherwise change the input type to a button and then define an onclick event for that button.
You're trying to access an element based on the name attribute which works for postbacks to the server, but JavaScript responds to the id attribute. Add an id with the same value as name and all should work fine.
<form name="myform" id="myform" action="action.php">
<input type="hidden" name="myinput" id="myinput" value="0" />
<input type="text" name="message" id="message" value="" />
<input type="submit" name="submit" id="submit" onclick="DoSubmit()" />
</form>
function DoSubmit(){
document.getElementById("myinput").value = '1';
return true;
}
My problem turned out to be that I was assigning as document.getElementById("myinput").Value = '1';
Notice the capital V in Value? Once I changed it to small case, i.e., value, the data started posting. Odd as it was not giving any JavaScript errors either.
I have done this and it works for me.
At first you must add a script such as my SetHolderParent() and call in the html code like below.
function SetHolderParent(value) {
alert(value);
}
<input type="submit" value="Submit" onclick="SetHolderParent(222);" />
You can use the onchange event:
<form name="myform" id="myform" action="action.php">
<input type="hidden" name="myinput" value="0" onchange="this.form.submit()"/>
<input type="text" name="message" value="" />
<input type="submit" name="submit" onclick="DoSubmit()" />
</form>
This might help you.
Your HTML
<form id="myform" action="action.php">
<input type="hidden" name="myinput" value="0" />
<input type="text" name="message" value="" />
<input type="submit" name="submit" onclick="save()" />
</form>
Your Script
<script>
function save(){
$('#myinput').val('1');
$('#form').submit();
}
</script>