I have a php file which I want be executed when I click on a button. I have been using the following code to achieve the same:
<form action="test.php" method="post">
<input type="submit" value="Run Script" name="submit">
</form>
The code seems to take me to test.php file, but I want to be redirected back to the page where I was. Can is be possible to run this test.php on click on a button and not get redirected? Something like running the script in background?
Please let me know if you guys need further clarification.
Any help will be highly appreciated.
Thanks in advance guys!
you will need to use AJAX
<script>
function doTheFunction(){
xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET","URL_OF_PHP_FILE",true);
xmlhttp.send();
}
</script>
<button onclick"doTheFunction();">Run the script</button>
You need to do an ajax call and prevent the forms submit.
Html:
<form onsubmit="return doAxajCall();"> </form>
js Code:
function doAjaxCall(){
//do ajax call however you want
return false; //prevents the form from submitting
}
Easy way;
Make the action of your form 'self' like this;
<form action="#" method="post">
<input type="submit" name="submit" value="Do PHP">
</form>
Then test for submission at the top of the page like this;
if (isset($_POST['submit'])) {
// do stuff
}
in your instance 'test.php' has to included in the original file.
at the bottom of you php file
header('Location: lastPage.php');
or do some tricks using ajax.
code:
<!-- including jquery.min.js cdn -->
<script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<input type="submit" value="Run Script" id="submit" name="submit" />
<!-- now set ajax call for button -->
<script>
$("#submit").click(function(){
$.ajax({
url:'test.php',
type:'POST',
success:function(response){
alert('test.php file executed');
}
});
});
</script>
Related
My Requirement
Form Submission in New Window & Redirect Existing Page to a new page
on same click.
When I tried only Form submission is happening. Javascript function to redirect is not working.
Html
<form id="feedback.php" name="form1" method="post" action="feedback.php" target="_blank">
<input type="submit" class="button" value="SUMBIT" onclick="btntest_onclick();"/>
</form>
Javascript
<script>
function btntest_onclick()
{
window.location.href("mainpage.php");
}
</script>
Actual
But Only Form Submission is Happening in New Window. Existing Page is
not redirected.
Please tell me how to do this ?
Your HTML :
<form id="feedback.php" name="form1" method="post" action="feedback.php" target="_blank">
<input type="submit" class="button" value="SUMBIT" onClick="btntest_onclick()"/>
</form>
See onClick
Your Javascript :
function btntest_onclick()
{
setTimeout(function(){
window.location.href = "mainpage.php";
},0);
}
window.location.href is not a function.
And apparently it needs to be async to work.
JsFiddle
add onsubmit to your form.
and inside function do something like that:
function btntest_onclick() {
window.open("http:// your url");
window.location.href="/mainpage.php";
}
I have a php script page with a form like this:
<form method="post" action="clientmanager.php">
<input type="text" name="code_client" id="code_client" />
<input type="submit" value="Save" />
</form>
In my file "clientmanager.php", I have a function for example "addClient()".
I want to click the button and only call the function "addClient()" in the file "clientmanager.php" instead of call the whole file "clientmanager.php", So how could I do??
Thx!!!!
Add this to the top of the file:
if (isset ($_POST ['code_client'])) addClient();
However, you should consider using a different setup - processing forms like this is considered bad practice.
Maybe create a separate file, use OOP, MVC, a framework, anything other than this.
You can do that over jquery (ajax).
Call jquery library in head
Call clientmanager.php over this code:
my_form.php
....
<script type="text/javascript" src="jquery.js"></script>
...
<form method="post" action="">
<input type="text" name="code_client" id="code_client" />
<input id="my_button" type="button" value="Save" />
</form>
<div id="response_div"></div>
<script type="text/javascript">
$(document).ready(function(){
$("#my_button").click(function(){
$.post("clientmanager.php", {code_client: $('#code_client').val()}, function(data){
if(data.length >0) {
$('#response_div').html(data);
}//end if
});
});
});
</script>
clientmanager.php
<?php
echo $_POST['code_client'];
?>
I have an HTML form that currently just posts the data directly to a PHP file. I want to update the code so that the submit button sends the data to a JavaScript function so that I can create an AJAX function. Is it possible for the submit button to activate a JavaScript function rather than posting to a php file? The only thing I have come up with is below, which quite obviously does not work:
<html>
<head>
<script type="text/javascript">
function ajax(){
//...
}
</script>
</head>
<body>
<form action="ajax();">
<!-- ... -->
<input type="submit" value="Submit" />
</form>
</body>
</html>
You can give the "submit" input a "click" handler that explicitly prevents the default behavior from being carried out.
<input type='submit' value='Submit' onclick='ajax(event)'>
Then in the function:
function ajax(event) {
if ('preventDefault' in event) event.preventDefault();
event.returnValue = false; // for IE before IE9
// ...
}
edit #Esailija points out correctly that another option is to handle the "submit" event on the <form> element instead. The function would look pretty much the same, in fact exactly the same, but you'd wire it up like this:
<form id='yourForm' onsubmit='ajax(event)'>
That will also trap things like the "Enter" key action, etc.
Of course you can. But it's more useful to call your Javascript function in the input like this :
<input type="submit" value="Submit" onclick="ajax();" />
And remove the action part in the form.
I jQuery you can use event.preventDefault(); otherwise just use return false;
http://jsfiddle.net/mKQmR/
http://jsfiddle.net/mKQmR/1/
Pointy is correct... just add a click handler to the submit button, however make sure the last line of the click handler returns "false" to prevent the form from actually being posted to the form's action.
<html>
<head>
<script type="text/javascript">
function ajax(){
//...
return false;
}
</script>
</head>
<body>
<form action="thispage.htm">
<!-- ... -->
<input type="submit" value="Submit" onclick="ajax();" />
</form>
</body>
</html>
I am using the following code to effect an iframe that allows an ajax file upload on submit of the form without refresh.
This works as expected
window.onload=init;
function init() {
document.getElementById('form').onsubmit=function() {
document.getElementById('form').target = 'iframe';
}
}
What i would like to do is the same thing but 'onchange' of the file field input, i.e. when the user has chosen a file, to autmatically trigger the init() function and thus upload the file. I have tried with this code:
document.getElementById('file').onchange=function(){...
This doesn't work, and i'm completely stuck. Any ideas?
Many thanks
This should work for you
<script type="text/javascript">
window.onload = function() {
// add old fashioned but reliable event handler
document.getElementById('file_input').onchange = function() {
// submit the form that contains the target element
this.form.submit();
}
}
</script>
<iframe name="my_iframe"></iframe>
<form target="my_iframe"
action="your/file.ext"
method="post"
enctype="multipart/formdata">
<input type="file" name="my_file" id="file_input">
<!-- for no js users -->
<noscript>
<br/>
<input type="submit">
</noscript>
</form>
i think something like .live() will solve your issue hopefully, comment if you want more info on how to use it...
Give the file input element an id and:
$(document).ready(function(){
$(element).change(function(e){
fileInfo = e.currentTarget.files[0];
init();
});
});
I have a file upload script which works great when opened from the calling page via window.open(). However, I'm trying to avoid the popup window and load the script into the calling page itself (via jQuery.load()).
However, although everything appears to work fine, the file does not actually get transferred. The calling page is itself a form. Could that cause the problem?
<form id="myParentPage">
<div id="myUploadPlaceholder"></div>
<input type="button" id="loadScript" value="Test" />
<script type="text/javascript">
$(document).ready(function()
{
$('#loadScript').click(function() {
$('#myUploadPlaceholder').load('myUploadScript.php?action=test' );
});
});
</script>
</form>
Try using a hidden iframe instead:
<iframe id="myUploadPlaceholder" src="_blank"></iframe>
<input type="button" id="loadScript" value="Test" />
<script type="text/javascript">
$(document).ready(function()
{
$('#loadScript').click(function() {
$('#myUploadPlaceholder').attr('src','myUploadScript.php?action=test');
});
});
</script>