I can't process the uploaded image file with php ajax requuest. It's process the text field but can't process uploaded file. Following is my form. can you tell me what is wrong in my simple code and how can i solve it ?
and without upload file i saw that it's not redirect after successfull.
html form
<link rel="stylesheet" href="http://jquery.bassistance.de/validate/demo/css/screen.css" />
<script src="http://jquery.bassistance.de/validate/lib/jquery.js"></script>
<script src="http://jquery.bassistance.de/validate/jquery.validate.js"></script>
<script>
// JQuery Script to submit Form
$(document).ready(function () {
$("#commentForm").validate({
submitHandler : function () {
// your function if, validate is success
$.ajax({
type : "POST",
url : "process.php",
data : $('#commentForm').serialize(),
success : function (data) {
$('#message').html(data);
}
});
return false;
}
});
});
</script>
<form class="cmxform" id="commentForm" method="get" action="" enctype="multipart/form-data">
<fieldset>
<p>
<input type="text" name="text"/>
</p>
<p>
<input type="file" name="img"/>
</p>
<p>
<input class="submit" type="submit" value="Submit" />
</p>
</fieldset>
</form>
<div id="message"></div>
php process page:
<?php
$text = $_POST['text'];
$file = $_FILES['img']['name'];
if(empty($text) && empty($file))
{
echo "Both field is empty ";
}
else
{
header("Refresh:3, url=ajax_form.php");
}
?>
Related
When I try to submit my form everything seems to work, but it doesn't actually work when I add the $ _FILES variable to my PHP file.
This is my code and it doesn't work:
action.php
<?php
if (isset($_FILES['logoUp']['name'][$key])){
echo 'success form submit';
}
echo $_POST['test'];
?>
form.html
<form id="co-heared4us-form" name="co-heared4us-form" method="post" enctype="multipart/form-data" autocomplete="off">
<input type="file" id="logoUp" name="logoUp[]" accept=".ai, .pdf, .eps, .svg, image/png, image/jpeg, image/jpg" multiple="multiple"/>
<input type="text" name="test" value="test" id="test" />
<input type="submit" value="send" />
</form>
<script>
$("html").on("submit", "form#co-heared4us-form", function(e) {
e.preventDefault();
$.ajax({
type: 'post',
url: 'action.php',
data: $('form#co-heared4us-form').serialize(),
success: function () {
alert('form was submitted');
}
});
});
</script>
I noticed that if I run the action.php without submit ajax the action.php works correctly even with $ _FILES.
How can i do?
I'm not sure what's wrong with my code but my AJAX isn't working. I've included the jQuery library file but the program just won't load up the PHP file when I call on AJAX. As you'll see below, the .ajax call has a URL to "mail.php" but on submit, this file never loads. I can manually name the action tag for the form to "mail.php" but that just loads up "mail.php", which defeats the point of AJAX. What am I doing wrong?
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<form method="post" name="myForm" action="tac.php">
<label>Name:</label> <br />
<input name="sender">
<br /> <br />
<label>Email address:</label><br />
<input name="senderEmail">
<br />
<label>Message:</label> <br />
<textarea rows="5" cols="20" name="message"></textarea>
<br /> <br />
<input type="submit" name="submit">
</form>
<script>
$(document).ready(function() {
$("#myForm").submit(function() {
var roy = new Object();
roy.sender = $('#sender').val();
roy.senderEmail = $('#senderEmail').val();
roy.message = $('#message').val();
var jo = JSON.stringify(roy);
$.ajax({
type: "POST",
url: "mail.php",
data: {roy: jo},
success: function(msg){
alert(msg);
}
});
return false;
});
});
</script>
Change
<form method="post" name="myForm" action="tac.php">
To
<form method="post" id="myForm" action="tac.php">
This code
$("#myForm")
is looking for an element with id="myForm" not name="myForm"
Cheers
It's not working because you are trying to trigger an event of an id that doesn't exist.
$("#myForm").submit(function() { the id "myForms" it doesn't exist on < form > tag
put id="myForm" in < form > and it will work fine.
Like this: <form method="post" id="myForm" action="tac.php"> and also remove the name="myForm" because it has no use on form tags ...
I have a HTML form which reads some data and saves in the text file with help of PHP. The form's HTML code looks like below.
What is happening now:
1. once i click on submit button it redirects to the 'myprocessing.php'
2. successfully saving in data.txt
The help i required on
1. when i click on submit it shouldn't redirect me to the php page, it should stay on the HTML form page
2. it should show the php file's output on the same HTML page
In simple words, I want to stay on the HTML page itself. Since I'm pretty new to HTML and PHP, struggling much to do these. Thanks in advance :-)
<html>
<head>
<title></title>
</head>
<body>
<form action="myprocessing.php" method="POST">
<input name="field1" type="text" />
<input name="field2" type="text" />
<input type="submit" name="submit" value="Save Data">
</form>
<a href='data.txt'>Show data</a>
</body>
</html>
This is my data prcoessing PHP file.
<?php
echo "starting...";
if(isset($_POST['myTextBox']) && isset($_POST['field2'])) {
$data = $_POST['field1'] . '-' . $_POST['field2'] . "\n";
$ret = file_put_contents('data.txt', $data, FILE_APPEND | LOCK_EX);
if($ret === false) {
die('There was an error writing this file');
}
else {
echo "$ret bytes written to file";
}
echo "Ended...";
}
else {
die('no post data to process');
}
?>
Try below. Call refresh_div() on button click :-
<div class="result"></div>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
function refresh_div() {
jQuery.ajax({
url:'YOUR PHP page url',
type:'POST',
success:function(results) {
jQuery(".result").html(results);
}
});
}
</script>
Write php code in same html file and use isset() function to check for $_POST data
Try this
<?php
if(isset($_POST['field1']) && isset($_POST['field2']))
{
echo "starting...";
if(isset($_POST['myTextBox']) && isset($_POST['field2'])) {
$data = $_POST['field1'] . '-' . $_POST['field2'] . "\n";
$ret = file_put_contents('data.txt', $data, FILE_APPEND | LOCK_EX);
if($ret === false) {
die('There was an error writing this file');
}
else {
echo "$ret bytes written to file";
}
echo "Ended...";
}
else {
die('no post data to process');
}
}
?>
<html>
<head>
<title></title>
</head>
<body>
<form action="current_page.php" method="POST">
<input name="field1" type="text" />
<input name="field2" type="text" />
<input type="submit" name="submit" value="Save Data">
</form>
<a href='data.txt'>Show data</a>
</body>
</html>
<html>
<head>
<title></title>
</head>
<body>
<form action="" method="POST" name="testForm" id="testForm">
<input name="field1" type="text" />
<input name="field2" type="text" />
<input type="submit" name="submit" value="Save Data">
</form>
<a href='data.txt'>Show data</a>
<div class="result"></div>
</body>
</html>
add the name and id for form tag. if you keep action as blank, it will submit your form to current page itself.
You need a ajax call to perform as per your requirement.
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$( "#testForm" ).on( "submit", function( event )
{
$.ajax({
url:'myprocessing.php',
type:'POST',
data: $("#testForm").serialize()
success:function(results) {
jQuery(".result").html(results);
}
});
return false;
});
</script>
Dont forget to put a return false at the end. If we dont put return false, it will submit your form after the ajax call.
I test my first AJAX form, but when I submit my form the alert message just shows '2'. I search for sending ajax data to the same page and I found, that I can do that, but URL is optional.
my PHP code:
<html>
<body>
<form action="index.php" method="post">
<input name="name" type="text" />
<input type="submit" value="submit" name="submit">
</form>
<?php
if(isset($_POST["name"]))
{
$data="test string";
echo json_encode($data);
}
?>
<script src="jquery-2.1.0.min.js"></script>
<script src="ajax.js"></script>
</body>
</html>
my AJAX code:
$(document).ready(function() {
$('form').submit(function(event) {
$.ajax({
type : 'POST',
url : 'index.php',
data : $(this).serialize(),
dataType : 'json',
encode : true
})
.done(function(data) {
alert(1);
})
.fail(function(data) {
alert(2);
});
event.preventDefault();
});
});
I don't know where I go wrong?
It's better to delegate page generation and json-response generation to different pages. At least you should isolate it, because the following part of page also ends up in ajax-response:
<html>
<body>
<form action="index.php" method="post">
<input name="name" type="text" />
<input type="submit" value="submit" name="submit">
</form>
...
<script src="jquery-2.1.0.min.js"></script>
<script src="ajax.js"></script>
</body>
</html>
Modifiyng your script, you can do something like that:
<?
if(isset($_POST["name"]))
{
// And don't forget to specify content type!
header("Content-type: application/json");
$data="test string";
echo json_encode($data);
} else {
?>
<html>
<body>
<form action="index.php" method="post">
<input name="name" type="text" />
<input type="submit" value="submit" name="submit">
</form>
<script src="jquery-2.1.0.min.js"></script>
<script src="ajax.js"></script>
</body>
</html>
<? } ?>
And, for future, please, post the exact request and response information in your questions, which you can get on Network page for developer tools of chrome, for example.
I want to submit my form. In my form using first button I create a textbox through ajax and after that I use second button to submit the form normally. When I want to get the value of newly created textbox using $_POST it gives error. How can i get value of ajax created button on submission. my php code is :
<?php`enter code here`
session_start();
ob_start();
require_once "config.php";
if ($_SERVER['REQUEST_METHOD']=="POST")
{
if (isset($_POST['subtest']))
{
print $_GET['tt'];
}
}
?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="jquery-ui-1.8.21.custom/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="jquery-ui-1.8.21.custom/js/jquery-ui-1.8.21.custom.min.js"> </script>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery("#subt").click(function(){
jQuery("#divload").show();
jQuery.ajax({url:"adp.php", type:"post", success:function(result){
jQuery("#disp").html(result);
jQuery("#divload").hide();
}});
return false;
});
});
</script>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery("#subtest").click( function() {
alert(jQuery("#tt").val());
});
});
</script>
</head>
<body id="#bdy">
<form id="FrmMain" method="post" action="">
<div id="Shd" style="font: 10%; margin: 50px; background-repeat:repeat-y; padding- left:120px;" >
<input type="text" id="txtFrom" name="txtFrom" />
<input type="text" id="txtUpto" name="txtUpto" />
<input type="text" id="txtOpt" name="txtOpt" />
<input type="submit" id="subt" name="subt" />
<input type="submit" id="subtest" name="subtest" />
<div id="RuBox" style="font-weight:bold;"><input type="checkbox" id="chkaccept" name="chkaccept" /> I accept terms and conditions.</div>
</div>
</form>
<div style="color:#F00; font-size:18px; display:none;" id="divload">Please wait loaidng... </div>
<div id="disp"></div>
</body>
</html>
Code of my adp.php file :
<?php
sleep(5);
?>
<div style="color:#30F; font-size:36px;">
Application testing............
<input type="text" id="tt" name="tt" />
</div>
I am not getting value of textbox named "tt" in temp form
Thanks
You're pretty much not posting anything from here:
jQuery(document).ready(function(){
jQuery("#subt").click(function(){
jQuery("#divload").show();
jQuery.ajax({url:"adp.php", type:"post", success:function(result){
jQuery("#disp").html(result);
jQuery("#divload").hide();
}});
return false;
});
});
So I would assume that you only want to generate a text field dynamically. And you can do it without the use of ajax:
var form = $('#FrmMain');
$('<input>').attr({'type' : 'text', 'id' : 'tt', 'name' : 'tt'}).appendTo(form);
Plus you're also trying to print out $_GET['tt'] while the form method is POST
if (isset($_POST['subtest']))
{
print $_GET['tt'];
}
This should also be:
echo $_POST['tt'];