I have a link on a website when it's clicked it will load a form in a div. The form is processed by a PHP script. I need the output from the PHP script to appear in that div. Any idea how to do this? Thanks
File header.php
<html>
<head>
<script>
$(document).ready(function(){
$('#mylink').click(function(){
$('#content').load("form.php");
});
});
</script>
</head>
<body>
<li>Add Account</li>
file index.php
<?php
include_once 'header.php';
?>
<div id="content"></div>
in form.php
<form id= method="POST" action="script.php">
......
........
<input type="submit" value="Add account" />
</form>
in script.php
i need to send error message or thank you note in div #content
Ajax may help you. It's easy to do so. Try it.
First, this sounds like a job that JavaScript would be perfect for. But if you want to go old school, once you submit your form, depending if you set it to be method="post" or method="get" in the form tag, you can access it with php in the receiving script with $_GET or $_POST.
example:
html:
<form action="yourScript.php" method="post">
<input type="text" name="location" />
php (file: yourScript.php): echo $_POST['location'];
Related
i want to get the values from a form before its action redirect it.
for example in this form, i want to grab the "text_one" and send it to database before it be redirected to google. I also want "text_one" in google too.what should i do?
<form method="post" action="google.com">
<input type="text" name="text_one">
<input type="submit">
</form>
try this ...
<form method="post" onsubmit="return getdata()" action="google.com">
<input type="text" name="text_one" id="text_one">
<input type="submit">
</form>
<script>
function getdata(){
var txtOne = document.getElementById('text_one').value;
// Do Something
}
</script>
You can change the action to "yourscript.php" and do s.th. like:
<?php //yourscript.php
//save $_POST['text_one'] to Database
header('Location: http://google.com');
?>
Or you can call the "yourscript.php" with ajax to do it in the background.
Try this :
echo (isset($_POST['text_one']) ? $_POST['text_one'] : '');
or Use Ajax Ajax is the answer of your question
For a pure PHP solution, you can work with the idea presented by #v.eigler. In order to create a POST request to a Google server (or what ever server you want), you just need to use some library to make the HTTP request, I strongly recommend you to take a look at the Guzzle library.
Using this should be easy enough, you just need to redirect the form handling to a script that you own, do your own processing and then create an HTTP post to the real destination.
I do it with little complexity.
I change your form action handler.
<form method="post" action="yourscript.php">
<input type="text" name="text_one">
<input type="submit">
</form>
Now, Its time to handle it server side. I have put comments for explanation.
<!-- yourscript.php -->
<?php
echo $_POST['text_one'];
// also do required server side operation.
?>
<!-- note: Action part is google.com -->
<form id="myform" method="post" action="google.com">
<!-- Note: value of input already set.-->
<input type="text" value=<?php echo $_POST['text_one'];" ?> name="text_one">
<input type="submit">
</form>
<script language="JavaScript">
// submit your form as soon as page loaded.
document.myform.submit();
</script>
I am trying to load the same form but slightly rearranged html based on screen size.
I know this can be achieved with css but this is not what I am after as I have specific pages where I don't want the form to load so I am using php to check what page I am on and show/hide the form depending on the page.
Both search.php and search_mobile.php are using the same forms and everything is the same except minor html rearranging.
On submission, even though the mobile form is hidden, it still affect the search results. Is there any way to completely hide it? I tried visibility:hidden but that's just visually hidding it and display:none doesn't seem to work either..
<form method="get" action="">
<?php include 'search.php'; ?>
<div id="mobile" style="display:none;">
<?php include 'search_mobile.php'; ?>
</div>
...more code
</form>
It depends on what is the condition for loading the mobile or the default. When you have this condition, you won't have to hide it, you just don't include it on the page... The result html won't even contain the code.
<form method="get" action="">
<?php
if( /* CONDITION FOR SHOWING MOBILE OR DEFAULT */ )
include 'search.php';
else
include 'search_mobile.php';
?>
...more code
</form>
It's hard to be sure exactly what is happening or what you are trying to achieve but I would check that each form tag, they needs to have their own name attribute to work exclusively on a page.
<form name="form1" method="get" action="">
<?php include 'search.php'; ?>
...more code
</form>
<form name="form2" method="get" action="">
<div id="mobile" style="display:none;">
<?php include 'search_mobile.php'; ?>
</div>
...more code
</form>
Yes, any input element in the form is submitted, regardless it it's visible or not. You can solve it by disabling the elements before submit.
$('form').on('submit', function() {
$(this).find(':input').not(':visible').attr('disabled', true);
});
No need to change the HTML or PHP.
what I am trying to do is to create a from, and execute a php script after the submit has been pressed. the problem seems to be that the page of wprdpress with the form and the code gets executed all at once.
If I put the code below into a regular test.php file on my server, it does what it is supposed to do (echo "Form Submitted!") after I click submit. However if I put the same code in a page template or a wp page it spits it out all at once (the form, and the "form submitted).
<html>
<head>
<title>Notify on Submit</title>
</head>
<body>
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="POST">
<label>Name: <input type="text" name="name" /></label>
<input type="submit" value="Submit" />
</form>
<?php if (count($_POST)>0) echo "Form Submitted!"; ?>
</body>
</html>
I have no idea why this is like that, and would really need some help on this.
What I have also done is to create two different wp pages(one goes to the other). It works, but will create a bit of a mess. I would like to do this in one page.
page 1
<form action="page2" method="POST">
Your form input.
<input type="submit" name="submit" />
</form>
Page 2
<?php
if (count($_POST)>0)
{
echo "Form Submitted!";
unset($_POST);
$_POST = array();
}
else echo "Form has been reset!";
?>
Probably there is another form on the Wordpress page using the POST method. Instead of checking for $_POST > 0 (which will only tell you that something was posted) add some identifier to your form, and check for that so you can tell if your form was posted.
A simple way to do this is with a hidden input:
<html>
<head>
<title>Notify on Submit</title>
</head>
<body>
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="POST">
<label>Name: <input type="text" name="name" /></label>
<input type="hidden" name="whatform" value="myform" />
<input type="submit" value="Submit" />
</form>
<?php if (isset($_POST['whatform']) && $_POST['whatform'] == 'myform') echo "My Form Submitted!"; ?>
</body>
</html>
I think you just need to remove the php from your action. The action defaults to the current url on any form.
PHP_SELF refers to the file path - thats why it works when you do it on just a solo file. As part of the wordpress application, you can't run files directly - you have to reach that url.
Remember that WP uses actions and hooks, and so if you put code "in a WP page" or "in a template" it may fire at various times. You might get an echo statement that fires something to the screen before the content comes out. Consider putting all your output within filters, actions and hooks.
Your logic seems to depend on the post count. Consider using a unique name, i.e. the name of the submit button on your form. Check for if(isset($_POST['my-unique-submit-button'])). Is anything else in WP submitting via post? You might not know!
I am testing Html form using post method and got this odd result:
I have two html pages on server apache (already installed php): post.html and target.html, and the code for these page are followings:
post.html (don't worry about the html standard)
<div style="text-align: center">
<form method="POST" action="target.html">
<input type="text" name="testname" value="sometext" />
<input type="submit" value="submit" />
</form>
</div>
and target.html
<html>
<head>
</head>
<body>
<h1>Target page</h1>
</body>
</html>
When I entered data to the form on post.html page and hit submit button, I got to the target.html page. When on this page(target.html), I refreshed the page, and what I receive is a blank page. The second time I refreshed, It turned to normal Html page.
I don't know why it returned a blank page the first time I refreshed, I have tried the same approach but with PHP page, and the content of target page (assum name target.php) still remains (not blank like html files above)
So, could you explain me about this problem?
Thank you.
This definitely has something to do with your browser. Same here on a mac using Safari, on some pages after submitting the content, the page seems to freeze, I refresh it, and then it works again.
Definitely not a code problem, as far as I'm concerned.
It's because you cannot pass an input from html to html file. Your target.html should be a php file (target.php).
and try to put this code on your target.php
<?php
var_dump($_POST); //this will show the inputted text and also show the data type and will stop the code execution here. other codes below will not be executed.
echo $_POST['testname'];
?>
Additionally, change target.html to target.php in your form action
First I will start out by correcting your post.html
<div style="text-align: center;"> <!-- added a ; after center -->
<form method="POST" action="target.html">
<input type="text" name="testname" value="sometext" />
<input type="submit" value="submit" />
</form>
</div>
that may not matter but you should end all your styles with ;
To continue, everything looks fine. maybe something weird happened between refreshes.
save your form page in php than add the php script in the same page, here try this. remember save in .php.
<?php $testname = $_Post['testname'];
echo $testname ?>
<div style="text-align: center">
<form method="POST" action="">
<input type="text" name="testname" value="sometext" />
<input type="submit" value="submit" />
</form>
</div>
I am creating a website using PHP and JQuery and have come into problems rearding forms.
For example, my index.php looks like the following:
<body>
<?php
echo "<div id=\"web_Page\">";
require("public/templates/header.php");
require("public/templates/menu.php");
require("public/templates/home.php");
require("public/templates/footer.php");
echo "</div>";
?>
</body>
It then loads a header, footer, menu area and a starting page. The files that are loaded are also encased in div areas so the final index.php is rendered like so:
<div id="web_Page">
<div id="web_Header">
//contents of header.php loaded into this div//
</div>
<div id="web_Menu">
//contents of menu.php loaded into this div//
</div>
<div id="web_Contents">
//contents of home.php loaded into this div//
</div>
<div id="web_Footer">
//contents of footer.php loaded into this div//
</div>
</div>
The menu items are then loaded into the web_contents DIV area using the javascript code:
$('#web_Menu a').click(function(e)
{
e.preventDefault();
$('#web_Content').load($(this).attr('href'), function()
{
});
});
Now the code loads all pages selected from the menu into the web_Contents div area. But i have now created a page called register.php and it has some very unexpected functuality. Below is the rendered HTML for it, It will also load in the web_Contents div area:
<div id="reg_Div">
<form id="reg_Form>
<label>Desired Username: </label><input type="text" name="uname" id="uname" />
<button>Register</button>
</form>
</div>
The index.php page would then be rendered like this:
<div id="web_Page">
<div id="web_Header">
//contents of header.php loaded into this div//
</div>
<div id="web_Menu">
//contents of menu.php loaded into this div//
</div>
<div id="web_Contents">
<div id="reg_Div">
<form id="reg_Form>
<label>Desired Username: </label><input type="text" name="uname" id="uname" />
<button>Register</button>
</form>
</div>
</div>
<div id="web_Footer">
//contents of footer.php loaded into this div//
</div>
</div>
The problem is that even though this form has no functionality and neither does the button, whenever the button is clicked, the website navigates to the index.php page. I really cannot understand why?
Could anyone see why the code would then cause the triggered button navigate to index.php. Also, since index.php is just a collection of require() pages, and the register.php is also loaded there, what is causing the page to automatically discard the web_Contents div that contained register.php and replace it with contents of home.php?
This is really confusing me?
Any feedback would be much appreciated.
Thanks.
Firstly, you are missing a quotation in this line
<form id="reg_Form> // <--- missing a quote
also, you'll want to update it to something like this...
<form id="reg_Form" onsubmit="return(false);"> // <--- should prevent form submittion
Form has action attribute, which tells browser where to navigate after submit button is clicked. If no action attribute is specified then, by default it is current page, in your case "index.php".
HTML forms submit their data to a page, if none is specified, then it submits to the current page (index.php in your case).
<form id="reg_Form">
Is the same as
<form id="reg_Form" action="index.php" method="GET">
To stop the form from submitting, create an onsubmit handler that tells it not to submit.
$('#reg_Form').submit(function(e){
e.preventDefault(); // Tells the form not to submit
});
The reason that the form submits after clicking the button, despite not having an action attribute, is that the action attribute defaults to the URL of the current page if it is not specified.
One way to prevent the form from being submitted is to include an onsubmit attribute in the form tag. If the JavaScript code contained within this attribute returns false, then the form will not be submitted.
<form id="reg_Form" onsubmit="return false;">