Can jquery.ajax post a value from an attribute Name? If can, I want send image's title apple to b.php, then return the data This is an apple from b.php to the div#result, Thanks.
a.php
<html>
<head>
</head>
<script src="jquery-1.4.4.min.js" type="text/javascript"></script>
<script language="javascript">
$(document).ready(function () {
var params = "value=" + $('#send').attr(title);
$.ajax({
url:'b.php',
type:'post',
dataType:'html',
data:params,
success:data
});
function data (html) {
$("#result").html(html);
}
});
</script>
<body>
<div id="result"></div>
<img id="send" src="apple.jpg" title="apple" />
</body>
</html>
b.php
<?php
echo 'This is an '.$_REQUEST['value'].'.';
?>
If you put quotes around the attribute name, .attr('title'), it should work. Otherwise, title will be treated as variable, and, as it is not defined, it will have the value undefined.
But better is to pass an object to data and let jQuery take care of proper encoding:
$.ajax({
url:'b.php',
type:'post',
dataType:'text', // actually, you are not outputting HTML
data: {value: $('#send').attr('title')},
success:data
});
You don't set the 'values' parameter in the same way you set a normal variable in this application. Instead you could create an object with a member called "value" and set that equal to your image title.
var params = new Object();
params.value = $('#send').attr('title');
Or you could create params as a literal like:
var params = {value: $('#send').attr('title')};
Related
I have an ajax request to save my mail template in the database.
However I can't send my div with the ajax request ? I've been looking on the internet for 2 hours now but I couldn't find a solution
the ajax file :
function saveEmail(){
var mail3 = $jQ('templateContent');
$jQ.ajax({
method: 'POST',
url: 'ajax/saveMail.php',
data: {mail2: mail3.html(), test: "test"}
}).done(function( data ) {
console.log(data);
});
}
saveMail.php :
echo '<pre>';
print_r($_POST);
echo '</pre>';
exit();
The only POST value i get is test example:
<pre>Array
(
[test] => test
)
</pre>
some usefull info :
mail3 = `[prevObject: jQuery.fn.jQuery.init[1], context: document, selector: "templateContent", jquery: "1.10.2", constructor: function…]`
var mail3 = $jQ('templateContent');
Should be something like
$jQ('.templateContent'); or $jQ('#templateContent');
You forget to use templateContent as a element class or id
Try to use .templateContent or #templateContent.
So you can get content of element by using it's id or class.
The following gives the div's contents in the ajax data call. Note the jquery selector for the div i.e. var dataToSend = $("#templateContent").text();
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
function myFunction() {
var dataToSend = $("#templateContent").text();
alert(dataToSend);
$.ajax({
method: 'POST',
url: 'ajax/saveMail.php',
data: {mail2: dataToSend, test: "test"}
}).done(function( data ) {
console.log(data);
});
}
</script>
</head>
<body>
<p>Click the button to trigger a function that will output "Hello World" in a p element with id="demo".</p>
<button onclick="myFunction()">Click me</button>
<div id="templateContent"><span><p>This is supposed to be sent in email!</P><span></div>
</body>
</html>
I want to send some data to Javascript from PHP.(these two file is different file in same folder)
For example, If I calculate some value in PHP side, I want to send the data to javascript and I use the data.
How can I do this??
There's complete technology for that called AJAX with a lot of tutorials on the internet.
And there's already a great and easy-to-deploy implementation - within jQuery.
In practice, you can use this:
FILE: index.php
<HTML>
<body>
<input type="text" id="test" value="123"><br>
<input type="button" id="btn" onclick="send_to_php()" value="send to php">
<script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<script>
function send_to_php() {
$.ajax({
url: 'js_php.php',
type: 'POST',
// Form data
data: function(){
var data = new FormData();
data.append('test', $("#test").val() );
return data;
}(),
success: function (data) {
var obj = JSON.parse(data);
$("#test").val( obj.result );
},
error: function (data) {
console.log(data);
},
complete: function () {
},
cache: false,
contentType: false,
processData: false
});
}
</script>
</body>
</HTML>
FILE: js_php.php
<?php
//FILE: js_php.php
$test = $_POST["test"];
$test .= "456";
$arrResult = array(
'result' => $test
);
print json_encode($arrResult);
die();
?>
The file "index.php" is the communication between JavaScript and PHP using jQuery Ajax method.
When click the "send to php" button will run the "send_to_php ()" that will take the value of the input id "test" and send through ajax, for "js_php.php" file.
In turn, the file "js_php.php" will receive this variable as POST, modify and print the value in JSON format.
The method implemented by ajax function "send_to_php ()" will be "listening" all that "js_php.php" print.
After the success of the return, javascript convert the text "js_php.php" printed on a JSON object and then the JS able to process within the javascript code:
success: function (data) {
var obj = JSON.parse (data);
$("# test").val(obj.result);
},
<script type='text/javascript'>
var myVar = <?php echo $myVar; ?>;
</script>
in a nutshell. There are more sophisticated way to communicates though.
Have a Look at this AJAX Tutorial: http://news.php.net/php.general/219164
Assign a JavaScript global variable in a script tag in the PHP page, and include the other javascript files after.
Sample:
<html>
<head>
<script type='text/javascript'>var testGlobal = <?php echo $globalJSValue ?></script>
<script type='text/javascript' src="url"></script>
<script type='text/javascript' src ="url"></script>
</head>
</html>
testGlobal variable will now be available to both javascript files.
main.php:
<SCRIPT type="text/javascript">
$("#btnSubmit").click(function () {
alert("What will i put here!");
});
</SCRIPT>
<input type = "submit" id = "btnSubmit" value = "Try IT!" />
<div id = "show_search2">
</div>
output.php:
<?php $val = $_POST['btnSubmit'];
echo "<H1>$val</H1>"; ?>
What specific jQuery functionality can get the value of the btnSubmit and access it through $_POST and output it to the div show_search2? I used prototype.js but it provides conflict with my other JS scripts in the index.
Note: all my script source is included in index and that's why I didn't include the source in this post.
Do you mean something like this:
$("#btnSubmit").click(function (e) {
e.preventDefault();
var submitVal = $(this).val();
$.ajax({
type: "POST",
url: "url_of_your_output.php",
data: {btnSubmit : submitVal},
success: function(response) {
$("#show_search2").html(response); //response from output.php
}
});
});
I want to post the PHP variables $uid and $submissionid to the file fblike.php. Is the Ajax below formatted correctly to do this?
<?php
ob_start();
session_start();
$uid = $_SESSION['loginid'];
$submissionid = mysql_real_escape_string($_GET['submissionid']);
$_SESSION['submissionid'] = $submissionid;
?>
<head>
<script type='text/javascript' src='jquery.pack.js'></script>
<script type='text/javascript'>
$(function(){
$("a.connect_widget_like_button").live(function(){
$.ajax({
type: "POST",
data: "action=vote_up&uid="+$(this).attr("uid")"&submissionid="+$(this).attr("submissionid"),
url: "fblike.php",
});
});
});
</script>
</head>
You dont really want to use expando attributes if you dont have to, especially since thise are links... i would jsut do:
Like
then you can do a simple:
$("a.connect_widget_like_button").live('click', function(e){
e.preventDefault();
$.post($(this).attr('href'));
});
Now on the php side you need to be aware of where the values will be. If you pass the values as i have done in my example they will be in $_GET (even if its a POST request). If you pass them like you did in your original post then they will be in $_POST.
You need to send the data as an array/object. Something like this should do the trick.
$(function(){
$("a.connect_widget_like_button").live(function(){
$.ajax({
type: "POST",
data: {
action: "vote_up",
uid: $(this).attr('uid'),
submissionid: $(this).attr('submissionid')
},
url: "fblike.php"
});
});
});
I am new to studying jquery.ajax. Through some tutorials, I tried some code by myself, but I met some trouble. So I ask for help.
I tried to do this: open a.php, send html data from div#send to b.php, then return the data and show in div#result.
a.php
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
<script language="javascript">
$(document).ready(function () {
var params = "value=" + $('#send').text();
$.ajax({
url:'b.php',
type:'post',
dataType:'html',
data:params,
success:data
});
function data (html) {
var str=html.send;
alert(html);
$("#result").html(str);
}
});
</script>
<body>
<div id="result"></div>// I need return 'this is an apple.'
<div id="send">apple</div>
b.php
<?php
echo 'This is an '.$_REQUEST['value'].'.';
?>
You are not sending any valid parameters with the ajax request. If you want the textual contents of #send you need to use:
$('#send').text();
Although that only gives you a string, so it would have to be:
var params = "value=" + $('#send').text();
Apart from that, $_REQUEST is an array, so you have to use something like $_REQUEST['value']
A third point is that your success function is too complicated and wrong (html.send does not exist), it could just be:
success: function(msg){
$("#result").html(msg);
}
To return datas from b.php, you have to do an echo