I'm learning jquery and ajax. I have tried the following code, to post value to php from jquery. But it doesn't work. Can someone tell me what mistake am I doing here, and what is the solution.
I just want value1 to be printed by the PHP server side code, with that value being sent by the Jquery based client side code.
<html>
<head>
<title>Practice 1</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<?php
if (isset($_POST['data'])) {
$data = $_POST['data'];
print( "data is: $data" );
return;
}
?>
<body onload='process()'>
<script type="text/javascript">
$.post(window.location, {'data': "value1"}, function (data) {
$('#response').text(data);
});
</script>
</body>
</html>
You're trying to output to an element that doesn't exist '#response', also the process function is missing.
Try something like this:
<html>
<head>
<title>Practice 1</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js">
</script>
</head>
<?php
if (isset($_POST['data'])) {
$data = $_POST['data'];
print( "data is: $data" );
return;
}
?>
<body>
<div id="response"></div>
<script type="text/javascript">
$.post(window.location, {'data': "value1"}, function (data) {
$('#response').text(data);
});
</script>
</body>
</html>
Related
I'm trying out a tutorial to learn how to do instant search with PHP/jQuery. I can't seem to find why this code won't work. This search was working before when I had the PHP in the same file as the index, but when I moved it to another file, it stopped working. I keep getting this console error message with each keystroke: ReferenceError: Can't find variable: $_POST. Any help would be deeply appreciated.
index.php file
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset-utf-8">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript">
function searchkey() {
var searchTxt = $("input[name='search']").val();
$_POST("search.php", {searchVal: searchTxt}, function(output) {
$("#output").html(output);
});
}
</script>
<title>Search</title>
</head>
<body>
<form action="index.php" method="post">
<input type="text" name="search" placeholder="Search for members..." onkeyup="searchkey();">
<input type="submit" value="Search">
</form>
<div id="output"></div>
</body>
</html>
search.php file (same location as index.php)
<?php
$connection = mysqli_connect('localhost','root','root','LBD');
$output='';
if(isset($_POST['searchVal'])){
$searchkey= $_POST['searchVal'];
$searchkey=preg_replace("#[^0-9a-z]#i", "", $searchkey);
$query = mysqli_query($connection,"SELECT * FROM members WHERE ownerName LIKE '%$searchkey%' OR companyName LIKE '%$searchkey%'") or die("Could not search!");
$count = mysqli_num_rows($query);
if($count == 0){
$output="There was no search result!";
}
else{
while($row=mysqli_fetch_array($query)){
$oName=$row['ownerName'];
$cName=$row['companyName'];
$output .='<div>'.$oName.'<br/>'.$cName.'</div>';
}
}
}
echo ($output);
?>
Looks like you've used the PHP $_POST in your script..
Try to use:
$.POST
Try this
$.ajax({
url: "search.php",
type: 'POST',
data: {
searchVal: searchTxt
},
})
.done(function(output) {
$("#output").html(output);
});
I have created a button "clear all",
which sends data to 'data.php' at the click of the button via ajax
</head>
<body>
<script type="text/javascript">
function klick(id){
$.ajax({
type:"POST",
url:"data.php",
data:{id:id},
success:function(resp){
$('#w3').html(resp);
}
});
}
</script>
shop
<br><br>
<button type='button'onclick= " klick()"/>clear all</button>
</body>
</html>
and this is my data.php page,
so what i want to do is overwriting $ _SESSION ['warenkorb'] with an empty array If the variable from the call is present in the "data.php" page.
Something like this: $_SESSION['warenkorb']=array();
<html>
<head>
<title>DATA</title>
<script src="https://www.novastorm.de/js/jquery-1.11.3.min.js"></script>
</head>
<body>
<?php
include 'produkte.php';
if(!isset($_SESSION['warenkorb'])){
$_SESSION['warenkorb']=array();
}
if(isset($_POST['id'])){
foreach($a as $key =>$value){
if($value['id']==$_POST['id']){
$_SESSION['warenkorb'][]= $_POST['id'];
}
}
}
print_r(count($_SESSION['warenkorb']));
?>
</body>
</html>
i need a little info on google recaptcha. I want to grab the value of "g-recaptcha-response" that compares in the captcha.php file i inserted below in my jquery file and then send it to the captcha.php file using jquery $.post() method. I apologize if this is duplicate but i really cannot find someone with my same problem ;)
THE HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="generator" content="AlterVista - Editor HTML"/>
<script src='https://www.google.com/recaptcha/api.js'></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="handle_spam.js" type="text/javascript"></script>
<title></title>
</head>
<body>
<div class="g-recaptcha" data-sitekey="6Lf8LxIUAAAAALg93pw24l53KTeqrIwl7kUY-opk"></div>
<button id="go">Register</button>
</body>
</html>
THE PHP
<?php
$captcha=$_POST['g-recaptcha-response'];
echo $captcha;
if(!$captcha){
echo 'You must verify yourself';
exit;
}
$response=file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=6Lf8LxIUAAAAACB9iqeOermR-rPOW0zcWRfoetBO&response=".$captcha."&remoteip=".$_SERVER['REMOTE_ADDR']);
if($response.success==false)
{
echo 'abort_all';
}else
{
echo 'success';
}
?>
THE JS
$(document).ready(function(){
$('#go').click(function(){
send=$('')
$.post('captcha.php',function(data){
alert(data);
});
});
});
Use this
<div class="g-recaptcha" data-callback="captchaCallback" data-sitekey="...">
and provide the function:
function captchaCallback(response) {
alert(response);
}
I am trying to send AJAX but it is not working. Could someone please clarify what it is I am doing wrong or not doing. Just trying to figure this out.
FIRST PAGE.
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</head>
<body>
<div class="text-center">Button</div>
<input class="form-control" name="cartID" id="cartID" type="hidden" value="<?php echo $order['clientid'] ;?>">
<p id="edit_box"></p>
<script>
$("#scaleButton").click(function() {
var cartID = "hello"
var second = "second";
///////// AJAX //////// AJAX //////////
$.ajax({
type: 'POST',
url: 'testing1234.php',
data: {first:cartID,second:second},
success: function( response ){
alert('yay ajax is done.');
$('#edit_box').html(response);//this is where you populate your response
}//close succss params
});//close ajax
///////// AJAX //////// AJAX //////////
}
</script>
</body>
</html>
SECOND PAGE
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
</head>
<body>
<?php
$first = $_POST['first'];
$second = $_POST['second'];
$third = $_POST['third'];
echo $second;
?>
</body>
</html>
In your case, it's just a syntax issue. You forgot to close the click event with an ending parenthesis. This kind of problem can be easily avoided by using a text editor with linting. There are many out there, like Sublime Text, Atom, etc. Or as suggest in comment, open up developer console in your browser to check for any errors/warning.
I passed along data via POST to php using JQuery, but when the page direct to the php file, the POST["createVal"] in php doesn't seem to exit after the call back. I showed this in demo below, notice that the $name is undefined when the callback result is clicked. Any idea how to fix this?
I'm trying to make a function that when the returned result was clicked, html page could redirect to the php page in which user input in html file could be printed out.
HTML file
<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
</head>
<body>
<input type="text" id="userinput">
<div id="result">
</div>
</body>
<script>
$("input").keyup(function(){
var input=$("input").val();
$.post("process.php",{createVal:input},function(data){
$("#result").html("<a href='process.php'>"+data+"</a>");
})
})
</script>
</html>
php file(process.php)
<?php
if(isset($_POST["createVal"])){
$name=$_POST["createVal"];
echo $name;
}
?>
<?php
echo $name;
?>
change
$("#result").html("<a href='process.php'>"+data+"</a>");
to
$("#result").html("<a href='process.php?createVal="+data+"'>"+data+"</a>");
and
process.php
if(isset($_REQUEST["createVal"])){
$name=$_REQUEST["createVal"];
echo $name;
}
Use this Html Code:
<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
</script>
</head>
<body>
<input type="text" id="userinput">
<div id="result"> </div>
</body>
<script>
$("input").keyup(function(){
var input=$("input").val();
$.ajax({
type: "POST",
url: "http://localhost/stackoverflow/process.php",
data: {'createVal': input},
success: function(data){
$("#result").html("<a href='http://localhost/stackoverflow/process.php?createVal="+data+"'>"+data+"</a>");
}
});
});
</script>
</html>
PHP Code:
<?php
if(!empty($_REQUEST['createVal']) || !empty($_GET['createVal'])){
$name = $_REQUEST['createVal'];
echo $name;
}elseif(!empty($_GET['createVal'])){
$name = $_GET['createVal'];
echo $name;
}
return 1;
?>
I have run and checked this too.
localhost: if you are running this code on localhost
stackoverflow: is the folder name, if you have any folder in localhost for it so replace the name by this.