hi i want to submit the page through following code but i can't get post data on ajax.php
please tell me where i am wrong
new Ajax(wgScriptPath +'/' + 'ajax.php', {
method: 'post',
data:{items:item},
onComplete: function(res)
{
////Code
}
to keep it simple and fast you can use open source jquery.
$.ajax({
type: 'POST',
url: url,
data: data,
success: success
dataType: dataType
});
check links below
- http://api.jquery.com/category/ajax/
http://api.jquery.com/jQuery.post/
example
<script>
$(document).ready(function() {
$('#checkbox').click(function() {
$.ajax({type : "POST",
url : "test.php",
data : "ffs=somedata&ffs2=somedata2",
success : function() {
alert("something");
}
});
});
});
</script>
<body>
<input type = "checkbox" name = "checkbox" id = "checkbox">
</body>
Mention the framework you are using, assuming you are using prototype, try below code
new Ajax(wgScriptPath +'/' + 'ajax.php', {
method: 'post',
parameters:{items:item},
onComplete: function(res)
{
////Code
}
});
Related
I'm trying to create a search field on the top navbar with ajax. Since it's on the navbar, it has to be present on all pages, therefore the URL is constantly changing.
$.ajax({
type: 'GET',
url: CURRENT_URL,
dataType: 'json',
data: {
search: userSearch
},
success: function (){...
I'm working with Laravel, so i tried this on the navbar page:
<script>
var CURRENT_URL = "{{url()->current()}}"
</script>
The CURRENT_URL is displayed fine if i try to console log it, but ajax gives an error "Source map error: Error: request failed with status 404".
How can i insert the current URL into the ajax request?
You can use location.href instead of CURRENT_URL
$.ajax({
type: 'GET',
url: location.href,
dataType: 'json',
data: {
search: userSearch
},
success: function (){...
or
<script>
var CURRENT_URL = location.href;
</script>
Hopefully, this can help. Here's my approach to make my url dynamically I get the URL in every forms var URL = $('#example_form').prop('action'); then the URL variable must append or set via Js/Jquery. check my example below.
<script type="text/javascript">
var URL = $('#example_form').prop('action');
$.ajax({
type:'GET',
url: URL+'/clearContent',
beforeSend: function (xhr) {
var TOKEN = $('meta[name="csrf-token"]').attr('content');
if (TOKEN) {
return xhr.setRequestHeader('X-CSRF-TOKEN', TOKEN);
}
},
data:{
get_category_id : $('.parent-id').val(),
},
success:function(data){
if (data.response.status == true) {
// your codes here
}
},
dataType: 'json',
complete: function () {}
});
So I have this simple jQuery ajax function, but it's inside each function because it's inside each post on site
$('.post .button').each(function() {
$(this).click(function() {
$.ajax({
url: 'action/update.php',
type: 'POST',
data: {
postID: $(this).closest('.container').find('.postID').val()
},
success: function() {
$(this).css({'color' : 'green'});
}
});
});
});
But after success I want change some css of that element that has been clicked.
Basically I want to post this without need of refreshing the site using basic html post.
Is it even possible? Can you help me out?
you may try this :
$('.post .button').on('click',function() {
var $this = $(this);
$.ajax({
url: 'action/update.php',
type: 'POST',
data: {
postID: $this.closest('.container').find('.postID').val()
},
success: function() {
$this.css({'color' : 'green'});
}
});
});
I am using ajax, php and json to store click counts in json file...Let's say the file is this:
count.json
{"countbtn1":28,"countbtn2":25,"countbtn3":39}
downloadsCount.php
<?php
$buttonName=$_POST["buttonName"];
$file = "count.json";
$json = json_decode(file_get_contents($file), true);
echo $json['count'.$buttonName] ;
?>
downloads.php
<?php
$buttonName=$_POST["buttonName"];
$file = "downloads.json";
$json = json_decode(file_get_contents($file), true);
$json['count'.$buttonName] = $json['count'.$buttonName] + 1;
file_put_contents($file, json_encode($json));
echo 'success';
?>
And I need to place each btn value inside these on page load:
<div class='smallbtn1'>0</div>
<div class='smallbtn2'>0</div>
<div class='smallbtn3'>0</div>
Counting and updating the json file with this:
$('.download').click(function() {
//get name of button
var name= $(this).prop('name');
$.ajax({
url: "downloads.php",
data:{buttonName:name},
method: "POST",
success: function(response) {
if (response = 'success') {
//get count download
$.ajax({
url: "downloadsCount.php",
data:{buttonName:name},
method: "POST",
success: function(response){
$('.small'+name).html(response);
}
});
}
}
});
return true;
});
..and I tried updating the count on page load with this:
$.ajax({
url: "downloadsCount.php",
data:{buttonName:name},
method: "POST",
success: function(response){
$('.small'+name).html(response); }
});
});
...but it doesn't update the values on load, just after the first click.
PS: The whole thing IS wrapped in $(document).ready(function(){..});
After seeing the code on your server, I'd say the issue is how you are calling the AJAX. You are doing this:
$(document).ready(function(){
$.ajax({
url: "downloadsCount.php",
data:{buttonName:name},
method: "POST",
success: function(response){
$('.small'+name).html(response); }
});
});
But you don't have defined what name is (it is defined on the click event, but not when the page is loaded for the first time). You should do something like this:
$(".download").each(function() {
var name = $(this).attr("name");
$.ajax({
url: "downloadsCount.php",
data:{buttonName:name },
method: "POST",
success: function(response){
$('.small'+name).html(response);
}
});
});
So the AJAX is called for each one of the buttons, and you use the attribute name by doing $(this).attr("name").
Try sending the AJAX request after the page completely loads using $(document).ready():
$(document).ready(function() {
$.ajax({
url: "downloadsCount.php",
data: { buttonName:name },
async: false,
method: "POST",
success: function(response) {
$('.small' + name).html(response);
}
});
});
What is wrong:
$('#click01').click(function(){
$a = 14;
$.ajax({
url : 'msg.php',
type : 'post',
data : {a:$a}
});
window.location = 'msg.php';
});
msg.php contains:
var_dump($_POST['a']); // NULL, but expected: 14
$('#click01').click(function(){
var a = 14;//not $a since this is javascript
$.ajax({
url : 'msg.php',
type : 'post',
data : {'a':a}
});
window.location = 'msg.php';
});
$('#click01').click(function(){
var a = 14
$.ajax({
type: "POST",
url: "msg.php",
data: {a:a},
beforeSend: function () {
// do action
},
success: function(html){
window.location = 'msg.php';
}
});
});
Rather than set the window.location you want to set a 'success' function on the ajax call so that when it finishes it takes the response and puts it into your page.
E.g. something like:
$('#click01').click(function(){
$a = 14;
$.ajax({
url : 'msg.php',
type : 'post',
data : {a:$a},
success: function(data, textStatus, jqXHR) {
$('#placeToPutTheResponse').append( data );
}
});
});
The above assumes that you have added an HTML node with the id="placeToPutTheResponse"
It is worth reading this other post on SO for a decent overview: jQuery Ajax POST example with PHP
It uses done rather than success, and slightly different syntax, but it's a great overview.
$(document).on('click','#click01',function () {
var a = 14;
$.ajax({
url: 'msg.php',
type: 'post',
data: {a: a},
success: function(e){
console.log(e);
},
error: function(e) {
console.log(e);
}
});
});
Try this
$('#click01').click(function(){
var a = 14;
$.ajax({
url : 'msg.php',
type : 'POST',
data : {a:a},
complete: function (data) {
console.log( data ); // this will tell you the output of var_dump.
window.location.href = 'msg.php';
}
});
// window.location = 'msg.php';
});
also this line window.location.href = 'msg.php'; in function complete will actually redirect you to the msg.php, so if you dont want any redirects remove those lines..
I am trying to send data to my PHP script to handle some stuff and generate some items.
$.ajax({
type: "POST",
url: "test.php",
data: "album="+ this.title,
success: function(response) {
content.html(response);
}
});
In my PHP file I try to retrieve the album name. Though when I validate it, I created an alert to show what the albumname is I get nothing, I try to get the album name by $albumname = $_GET['album'];
Though it will say undefined :/
You are sending a POST AJAX request so use $albumname = $_POST['album']; on your server to fetch the value. Also I would recommend you writing the request like this in order to ensure proper encoding:
$.ajax({
type: 'POST',
url: 'test.php',
data: { album: this.title },
success: function(response) {
content.html(response);
}
});
or in its shorter form:
$.post('test.php', { album: this.title }, function() {
content.html(response);
});
and if you wanted to use a GET request:
$.ajax({
type: 'GET',
url: 'test.php',
data: { album: this.title },
success: function(response) {
content.html(response);
}
});
or in its shorter form:
$.get('test.php', { album: this.title }, function() {
content.html(response);
});
and now on your server you wil be able to use $albumname = $_GET['album'];. Be careful though with AJAX GET requests as they might be cached by some browsers. To avoid caching them you could set the cache: false setting.
Try sending the data like this:
var data = {};
data.album = this.title;
Then you can access it like
$_POST['album']
Notice not a 'GET'
You can also use bellow code for pass data using ajax.
var dataString = "album" + title;
$.ajax({
type: 'POST',
url: 'test.php',
data: dataString,
success: function(response) {
content.html(response);
}
});
$.ajax({
type: 'POST',
url: 'test.php',
data: { album: this.title },
success: function(response) {
content.html(response);
}
});