I have a submit form for a URL and I want it to have specific behavior which I am not able to achieve so far. Initially I want the button to be enabled. After someone enters a URL and hits the "submit" button, I want to call my checkURL() function. If the function returns true, I want the button to become disabled and I want to then open remote_file.php. If it returns false, I want the button to be enabled and make them try another URL.
<form name=URLSubmitForm
action="remote_file.php"
method="post">
<input type="hidden" name="MAX_FILE_SIZE" value="524288000">
<input type="text" name="name" size="50">
<input type="submit"
onchange="this.disabled=false"
onclick="this.disabled=true; checkURL();"
value="submit">
</form>
Edit: It looks like I was just putting the onchange in the wrong place. I ended up doing this to fix reenabling the button
<input type="text" onchange="submit.disabled=false" name="name" size="50">
Thanks!
I would propose that you attach the event handling code to the form's onsubmit event, not the button event(s). What you're trying to control is whether or not the form is posted. The button being disabled while your validation logic runs is a secondary goal.
Try this instead:
<script type="text/javascript">
function checkURL(){
var submitButton = document.getElementById('submitButton');
submitButton.disabled=true;
/* implement your validation logic here
if( url is invalid ){
submitButton.disabled=false;
return false;
}
*/
// everything is valid, allow form to submit
return true;
}
</script>
<form name="URLSubmitForm" action="remote_file.php" onsubmit="return checkURL();" method="post">
<input type="hidden" name="MAX_FILE_SIZE" value="524288000">
<input type="text" name="name" size="50">
<input type="submit" name="submitButton" id="submitButton" value="submit">
</form>
<input type="submit"
onclick="if (checkURL()) { this.disabled='disabled'; return true; } else { return false; }"
value="submit">
How about in the form's onsubmit event:
<form onsubmit="(function(){
if(checkURL()){
this.elements['submit'].disabled = 'disabled';
}
else{
return false;
}
})()">
Since you haven't given any ajax code, the form will still be submitted normally and when the page is reloaded the button will be enabled again.
onclick="checkURL(this);"
function checkURL(arg){
this.disabled=true;
if(<something>) this.disabled=false;
}
Related
hi i am using a form for users subscription on the website with target is _new.
when i click on the submit button that the submitting message shows on the new window but the previous window still holding the data.
How to remove input fields data after submitting.
<form target="_new" action="samplepage.php" method="post">
<input type="text" name="inputtxt1" />
<input type="text" name="inputtxt2" />
<input type="submit" value="submit" />
</form>
Any suggestions???
Make the autocomplete - off
try this
<form target="_new" action="samplepage.php" method="post" autocomplete="off">
<input type="text" name="inputtxt1" />
<input type="text" name="inputtxt2" />
<input type="submit" value="submit" />
</form>
Reset form data using this
$('form').get(0).reset();
$(document).ready(function(){
$('form_name').submit(function(){
$('input[type="text"]').val('');
});
});
You can set value to null for text field using jquery on submit button click
$("input[type=submit]").click(function()
{
$("input[type=text]").val('');
});
EDIT:
I don't know is this a good approach, use blur instead of click event
$("input[type=submit]").blur(function()
{
$("input[type=text]").val('');
});
But it will meet your need.
Is it possible to create two form actions? One should action a .php page and one should action a script on the same page.
<form method="post" action="">
// Input fields here
<input type="submit" name="calculate" value="Calculate price">
// Form should perform the calculation script below (not attached here)
<input type="submit" name="order" value="Order">
// Form should perform the action 'order.php'
</form>
Searched for a long time, but could not find a solution. Does anyone know how to fix this?
If you want a button in a form to do something other than submit the form set its type to button
<input type="button" name="calculate" value="Calculate price">
then attach a click handler to the button to run your script.
Assuming you have an event that will lead to this change, yes but with javascript.
Example:
$('select#actions').on('change', function(){
var action = $('#actions').find(":selected").val();
$('#someForm').attr("action", action + '.php');//or whatever is the route
}
you can try something like this:
<script type="text/javascript">
function SubmitForm()
{
if(document.pressed == 'Calculate price')
{
document.myform.action ="calculate.php";
}
else
if(document.pressed == 'Order')
{
document.myform.action ="order.php";
}
return true;
}
</script>
<form method="post" onsubmit="return SubmitForm();">
// Input fields here
<input type="submit" name="operation" onclick="document.pressed=this.value" value="Calculate price">
// Form should perform the calculation script below (not attached here)
<input type="submit" name="operation" onclick="document.pressed=this.value" value="Order">
// Form should perform the action 'order.php'
</form>
So when you submits, trigger a function that capture your button value and set form action.
In this case, you can put your calculation script in a php file.
I have read the answer to this question, to execute PHP scripts with the click of a button. But what if I have a "nested button", like this :
<?php
if(!empty($_POST['act'])) {
echo "Ready to rock!";
$someVar = "Rock n Roll";
if(!empty($_POST['act2'])) {
echo $someVar;
} else {
?>
<form method="POST" action="">
<input type="hidden" name="act2" value="run">
<input type="submit" value="Rock It!">
</form>
<?php
}
} else {
?>
<form method="POST" action="">
<input type="hidden" name="act" value="run">
<input type="submit" value="Show It!">
</form>
<?php } ?>
I heard my problem can be solved with jQuery, but I no idea.
anyone please.
To execute a script on the server you use the action property of your form:
<form method="POST" action="myscript.php">
When clicking a input type="submit" the browser will go to to action of the form surrounding the input type="submit"
Nesting is not a issue, as the browser always will look for the 'surrounding' form.
Problem is in second form, so it will never calls in this code, because it fails in first $_POST variable IF statement, because in second form you do not POST variable "act". so you need to add it
<form method="POST" action="">
<input type="hidden" name="act" value="run">
<input type="hidden" name="act2" value="run">
<input type="submit" value="Rock It!">
</form>
with this form you should see echo $someVar;
p.s. if form action property is emtpy, by default it submits form to the same php script
Just like #DTukans said here, you need the hidden field. If you would post the second form, the value of act will be lost if you are not having a hidden field with the value of act from the first form.
In php you can also check which submit button you submitted by giving the input[type="submit"] a name, such as <input type="submit" name="form2">, then you could check if you submitted that form by:
if (isset($_POST['form2'])) {}, but this is not the case here.
Use the hidden input and you will be good to go.
I have a form with 2 buttons, that depending on which is selected will either be deleted or edited from the database. Those are each individual pages using SQL statements (questionedit and questiondelete). However, when i press a button, nothing happens...Any Ideas
Here is my javascript
function SelectedButton(button)
{
if(button == 'edit')
{
document.testedit_questionform.action ="testedit_questionedit.php";
}else if(button == 'delete'){
document.testedit_questionform.action ="testedit_questiondelete.php";
}
document.forms[].testedit_questionform.submit();
}
Here is my form (being echoed from a loop)
<form name="testedit_questionform" action="SelectedButton" method="POST">
<span class="grid_11 prefix_1" id="" >
Question:<input type="text" name="QuestionText" style="width:588px; margin-left:10px;" value="$row[0]"/>
<input type="button" value="Edit" name="Operation" onclick="submitForm('edit')" />
<input type="button" value="Delete" name="Operation" onclick="submitForm('delete')" />
<input type="hidden" name="QId" value="$row[3]" /><br />
</form>
First of all, your function should be named submitForm
function submitForm(button) {
if(button == 'edit') {
document.testedit_questionform.action ="testedit_questionedit.php";
} else if(button == 'delete') {
document.testedit_questionform.action ="testedit_questiondelete.php";
}
document.testedit_questionform.submit();
}
And then, call submit method from your form.
EDIT:
An alternative to calling forms is: document.forms['FORM_NAME'].submit()
Look at how you access the form to call submit(). Now look at how you access the form to change the action. One of them is clearly wrong.
It would be easier to make one PHP file, and buttons with different names like this:
<form method="post" action="actions.php">
<input type="submit" name="action1" value="Action 1" />
<input type="submit" name="action2" value="Action 2" />
[...]
And the file actions.php:
if(isset($_POST["action1"])) {
// action 1
}
elseif(isset($_POST["action2"])) {
// action 2
}
Is it possible to to submit an HTML Form (with a PHP action) and include a javascript onsubmit="VerifyFields()?
I am trying to do it now, but it seems that it will do the PHP action and not do the onsubmit.
Update:
Thanks for all of your help.
The problem was that I was putting my VerifyMe() function in the <head></head>, as opposed to the <body></body>.
If return false in the onsubmit handler, the form will not submit, if you return true, it will.
You should make the function VerifyFields return true or false, and call it like this:
onsubmit="return VerifyFields();"
<script type="text/javascript">
function validateForm(){
...
}
</script>
<form name="contact" action="<?=$_SERVER['PHP_SELF']?>"
method="post" onsubmit="return validateForm();">
<label> Foo </label>
<input type="text" class="txt_input" name="sender_name" />
...
<input type="image" src="img/send.jpg" id="submitButton"
name="submitForm" value="send" />
</form>
I would test the inputs bevor submitting any fields to the server.
I would test it client side by javascript and finaly send it to the server.
You could call Your script also this way.
<input type="text" class="txt_input" name="sender_name" onchange="validateForm();" />