JSON does not work in ajaxForm - php

It is just impossible. I cannot find what is wrong!!Consider the following very simple testing code:
<head>
<script type="text/javascript" src="js/jquery-1.11.1.js"></script>
<script src="js/jquery.form.js"></script> <!--AJAX JQUERY FORM PLUGIN-->
</head>
<body>
<script>
$(document).ready(function() {
$('#form1').ajaxForm({
dataType: 'json',
success: function () {
alert(5);
}
});
});
</script>
<form action="proceed.php" method="post" name="form1" id="form1" >
<input type="submit" name="one_button" id="one_button" value="GO" />
</form>
</body>
and the code for proceed.php:
<?php
$message= 'success';
echo json_encode($message);
?>
The above code does not alert '5' on button click unless I subtract line dataType: 'json'. Is the problem in PHP which does not send correctly the json data? I cannot tell... The crazy about that is I have used exactly this code many times and everything was fine!!!

Please your $message as array. Your code must be look like this.
<?php
$message[]= 'success';
echo json_encode($message);
?>
http://php.net/manual/en/function.json-encode.php

$message= 'success';
must be an array;
$message[]= 'success';

Related

jQuery's $.post method AJAX is not working

Lately I've been experimenting with AJAX and jQuery. But somehow $.post method doesn't seem to work. Anybody got solutions?
Here's my code.
<html>
<meta charset="utf-8">
<head>
<script type="text/javascript" src="jquery-3.3.1.js"></script>
<script type="text/javascript">
function send(){
$.post('t.php', {stuff:1}, function(data){
if(data == 'success'){
alert('works');
}
});
}
</script>
</head>
<body>
<div id="btn" onclick="send()">CLICK</div>
</body>
</html>
and my t.php:
<?php echo "success";?>
It works actually but you don't know that how to get response from php file properly
Change ajax code like below:
$.post('t.php', {stuff:1}, function(data){
if(data[0] == 's'){//changed here. data is an array not string
alert('works');
}
});
And in php
<?php echo "s";?>

Ajax submit one page PHP

I have code with single page PHP method
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js">
</script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/js/bootstrap-datepicker.js"></script>
<?php
if(isset($_POST['submit'])){
$date=$_POST['date'];
}else{
$date=date('Y-m-d');
}
?>
<form action="" method="post" id="formId">
<input type="text" name="date" id="datepicker">
<input type="submit" name="submit">
</form>
<?php echo $date; ?>
<script>
$(function() {
$('#datepicker').datepicker({
autoclose: true
})
});
</script>
how, if i want to use ajax to keep the page not to reload? please help me
ok so here is quick tutorial. ajax helps you to submit your form without page loading. You have to use action="somepage.php". when you click it it will pass the values there right away. so here is basic coding
<form id="formId">
<input type="text" name="dte" id="dte">
<button type="button" id="buttonsubmit">submit</button>
</form>
and ajax should be look like. In my coding id="buttonsubmit" is button id so when user will click it it run the function and takes the values
var dte;
$("#buttonsubmit").click(function(){
dte = $("#dte").val();
$.ajax({
url:"somepage.php",
method:"POST",
data:{dte: dte},
success: function (data){
if(data == "done"){
window.location='http://somedomain.com/';
}
}
});
});
in somepage.php you will have
<?php
if(isset($_POST['dte'])){
$date=$_POST['dte'];
echo "done";
}else{
$date=date('Y-m-d');
}
?>
note: i am writing echo "done"; in success method it will come and
according to code when success will see it will redirect the page

Why am I not gettiing anything when I click the submit button?

This is the html code..
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#button").click(function(){
var senda=$("#ans").val();
$.ajax({
type:"POST",
url:"ajax.php",
data:{"answer":"senda"},
dataType:"json",
success: function()(msg,string,jqXHR){
$("#result").html(msg+string+jqXHR);
}
});
});
});
</script>
</head>
<body>
Hey what has a head and a tail but no body?
<input type="text" id="ans" name="ans" />
<input type="button" id="button" value="submit" />
<p><div id="result"></div>
</body>
</html>
and this is the code of the php file ajax.php:-
<?php
$y=$_REQUEST['answer'];
echo "hey $y ";
if($y=='coin'){
echo "hey it worked";
}
?>
Please tell me where I am going wrong.The html code runs fine initially but when I click the submit button nothing happens. I now this might be just very beginner kinda question,actually I am just learning Jquery and php. What I am actually trying to do is take an input from the user and check if the input matches a string and then take the user to a new page.So any help would be much appreciated.
fix your ajax data:
var senda=$("#ans").val();
$.ajax({
type:"POST",
url:"ajax.php",
data:{"answer":senda} // without quotes
}).done(function(response) {
$("#result").html(response);
});
handle passed data using param name:
$y = $_POST['answer'];
echo "hey $y ";
if ($y == 'coin') {
echo "hey it worked";
}

Passing data using Jquery Post method to the same page

I'm a newbie to Jquery , my question is simple , I'm trying to pass data using Jquery Post method, I have read a lot , but I can't figure it out:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div class="TestAd" id="TestAd">
<iframe data-aa='58593' src='https://ad.a-ads.com/58593?size=468x60' scrolling='no' style='width:468px; height:60px; border:0px; padding:0;overflow:hidden' allowtransparency='true' frameborder='0'></iframe>
</div>
<button>Send request</button>
<br>
<?php
if(!empty($_POST["block"])) {
echo "Ads Are Blocked";
}
?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
var height = $('.TestAd').height();
$("button").click(function()
{
if (height==0)
{
$.post("", {block:true});
}
}
</script>
</body>
</html>
The script is a simple AdBlocker checker, thanks for your help
<form method="post">
<input type="hidden" value="true" name="block">
<input type="submit" value="Send request">
</form>
<?php
if(isset($_POST["block"])) {
echo "Ads Are Blocked";
}
?>
if you want to redirect it to the same page why dont you use simple form tag to pass the block value.By default it will redirect it on the same page
Change your PHP to this:
<?php
if(isset($_POST["block"])) {
echo "Ads Are Blocked";
}
?>
And Change your jQuery to this:
<script>
var height = $('.TestAd').height();
$("button").click(function () {
if (height == 0) {
$.post("somepage.php",{block: true}, function (data) {
// data is the response
// do something with it here
alert(data);
});
}
}
</script>
Here are the docs for $.post(), essentially, the way you had it, ignores the response. You have to pass the anonymous function (function (data) {}) callback as the 3rd argument to be able to work with the response.
From the docs:
Examples:
Request the test.php page and send some additional data along (while still ignoring the return results).
$.post( "test.php", { name: "John", time: "2pm" } );

Get a process response

I am looking for a way to get a response in a form of a javascript alert after a form has been submitted using a php script. I guess ajax should do this but Im not an Ajax guy yet. A simple sample code would help a lot. Thanks for reading
In your PHP code after successfully saving/processing data, write/echo the following inside <body> tag. This will show an alert when rendered on client's browser.
<script language="javascript" type="text/javascript" >
alert('This is what an alert message looks like.');
</script>
If you want to venture into ajax and jquery - grab a copy of the jquery core and then do something like the following:
(Now with a full example. You will also need jquery.form.js plug in)
<html>
<body>
<script type="text/Javascript" src="jquery-1.2.4.min.js"></script>
<script type="text/Javascript" src="jquery.form.js"></script>
<script type="text/Javascript">
$(document).ready(function(){
$("#SUBMIT_BUTTON").click(function()
{
var options = {
url: 'processForm.php',
success: function(){
alert('success');
},
error: function() {
alert('failure');
}};
$('#MYFORM').ajaxSubmit(options);
return false;
}
)});
</script>
<form id="MYFORM" method="post">
<input type="text" name="testing">
<input type="button" value="click me" id="SUBMIT_BUTTON">
</form>
</body>
</html>

Categories