How to pass extra data to an ajax success event?
var extra_data = 'some data';
var a = {
type : 'post',
async : true,
cache : false,
dataType : 'json',
timeout : 15000,
contentType : 'application/x-www-form-urlencoded;charset=UTF-8',
global : true,
url : url,
success : [
function(response, textStatus, jqXHR, extra_data){
}
]
};
You can just declare extra_data as a global variable if i remember (without var before) and you can use it inside the scope of the success method, and you don't need to pass it through methods arguments
extra_data = 'some data';
var a = {
type : 'post',
async : true,
cache : false,
dataType : 'json',
timeout : 15000,
contentType : 'application/x-www-form-urlencoded;charset=UTF-8',
global : true,
url : url,
success : [
function(response, textStatus, jqXHR){
console.log(extra_data); //for example
}
]
};
Related
Trying to display json data from PHP into a jQuery datatable, I get an error.
This is my code:
function fetchProjectTable()
{
$.ajax({
url: Domain+"/include/process.php",
method: "POST",
data: { getProjectResult: 1 },
success : function(data)
{
//var o = JSON.parse(JSON.stringify(data));
//var o = JSON.parse(data);
$('#project_table').dataTable({
data : data,
columns: [
{"data" : "id"},
{"data" : "p_name"},
{"data" : "p_amount"}
],
});
//console.log(o);
/*alert(o);
console.log(o);*/
}
});
I'm using cake php
For 8 times I have used div refresh pattern from the server but after few minutes my server crashed and I have to ask the server provider to reopen the server.
What would be the best way to proceed if I want to use the database through div refresh?
function check()
{
$.ajax({
type : 'POST',
url : '<?php echo $this->webroot;?>'+'Bookings/rand_f',
dataType : 'html',
data: {},
cache : false,
success:function(result){
$('#ht').html(result);
$("#session_value").val(result);
}});
}
setInterval(check, 1000);
function check_count()
{
var a=$("#session_value").val();
$.ajax({
type : 'POST',
url : '<?php echo $this->webroot;?>'+'Bookings/check_count/'+a,
dataType : 'html',
data: {},
cache : false,
success:function(result){
if(result=='change'){
$('#res').val(result);
listings_live1();
}else{
$('#res').val('no_change');
}
}});
}
setInterval(check_count, 1000);
function listings_live1()
{
var a=$("#session_value").val();
$.ajax({
type : 'POST',
url : '<?php echo $this->webroot;?>'+'Bookings/listingsbookingcheck/'+a,
dataType : 'html',
data: {},
cache : false,
success:function(result){
var x= $('#live_listing').html(result);
if(x){
return 1;
}
}});
}
function check_count_all()
{
var x=$("#last_count_all").val();
$.ajax({
type : 'POST',
url : '<?php echo $this->webroot;?>'+'Bookings/check_count_all',
dataType : 'html',
data: {},
cache : false,
success:function(result){
$("#count_all").val(result);
if(result!=x){
listings_liveall();
$("#last_count_all").val(result);
$("#st").val('change');
}
else{
$("#st").val('nochange');
}
}});
}
setInterval(check_count_all, 1000);
function listings_liveall()
{
$.ajax({
type : 'POST',
url : '<?php echo $this->webroot;?>'+'Bookings/listingall',
dataType : 'html',
data: {},
cache : false,
success:function(result){
$('#listings_liveall').html(result);
}});
}
function showaction(str,id){
$("#boking_status_call_cancel").show();
$("#alertshow").html('Are you sure you want to '+str+' this Booking?');
if(str!='accept'){
$("#reject_reason").show();
}else{
$("#reject_reason").hide();
}
$("#role_call").val(str+','+id);
}
function update_mobile_booking(){
var strcall=$("#role_call").val();
$.ajax({
type : 'POST',
url : '<?php echo $this->webroot;?>'+'Bookings/update_booking_mobile/'+strcall,
dataType : 'html',
data: {},
cache : false,
success:function(result){
var x=listings_live1();
if(x==1){
listings_liveall();
}
}});
}
/*settimeout page load mobile booking*/
var myFunc = function() {
listings_live1();
listings_liveall();
}
window.onload = function() {
setTimeout(myFunc, 1000);
}
/*
function check_counter_upper(){
c1=$("#session_value").val();
c2=$("#count_chk_cl").val();
if(c1!=c2 && c2!='undefined'){
listings_live1();
$("#st1").val('force_change');
}else{
$("#st1").val('no_force_change');
}
}
setInterval(check_counter_upper, 4000);*/
I am trying to implement custom form validation rules for my username field, which should check the database for duplicated or not.
After Searching on the internet, I had write out some code, and it successful getting the response "true / false" from my server. But the fields in the form doesn't update as it should. Below was my javascript code.
$.fn.form.settings.rules.checkUsername = function(value) {
var res = true;
$.ajax({
async : false,
url: '<?= Yii::app()->createAbsoluteUrl('home/doCheckUsername') ?>',
type : "POST",
data : {
username : value
},
dataType: "json",
success: function(data) {
if (data.result == true) {
console.log(data.result);
return false;
} else {
console.log(data.result);
return true;
}
}
});
};
$('.ui.form').form({
username: {
identifier : 'username',
rules: [{
type : 'checkUsername',
prompt : 'Username Already Exists'
}]
}
// some other rules
}, {
inline : true,
on : 'blur',
onSuccess : function(){
//post to controller
}
});
The console.log showing me the correct result as I want, but I keep getting "Username Is Exist" as show at the picture
Semantic UI form Validation result
May I know where are the place I doing it wrong ?
Somehow, Added Async at the ajax solve the problem.
$.ajax({
async : false,
url: '<?= Yii::app()->createAbsoluteUrl('home/doCheckUsername') ?>',
type : "POST",
async: false,
data : {
username : value
},
dataType: "json",
success: function(data) {
if (data.result == true) {
console.log(data.result);
res = false;
}
}
});
Put result in the res variable and return the res variable after the ajax call !
Work for me :
$.fn.form.settings.rules.checkemail = function(value) {
var res = true;
$.ajax({
async : false,
url: '../php/email_exist.php',
type : "POST",
async: false,
data : {
email : value
},
success: function(data) {
console.log(data);
if (data == "0") {
console.log("OK");
res = true;
} else {
console.log("KO");
res = false;
}
}
});
return res;
};
$.fn.form.settings.rules.checkUsername = function(value) {
var res = true;
$.ajax({
async : false,
url: '<?= Yii::app()->createAbsoluteUrl('home/doCheckUsername') ?>',
type : "POST",
data : {
username : value
},
dataType: "json",
success: function(data) {
if (data.result == true) {
//console.log(data.result);
//return false;
**value = 0;**
} else {
//console.log(data.result);
//return true;
**value = 1;**
}
}
});
**return (value == 1 )? true : false;**
};
$('.ui.form').form({
username: {
identifier : 'username',
rules: [{
type : '**checkUsername[value]**',
prompt : 'Username Already Exists'
}]
}
// some other rules
}, {
inline : true,
on : 'blur',
onSuccess : function(){
//post to controller
}
});
My page not showing a gif image while page in ajax request. Its a registration page and while clicking on submit button it should show a spin image and it should disapper after a success
this is my ajax code
$("#register-form").on("submit", function() {
var uname = $('#username').val();
var phone = $('#phone').val();
var mail = $('#email').val();
// $(".loader").show();
$.ajax({
type : "POST",
url : "registerUser",
secureuri : false,
cache : false,
async : false,
data : {
"username" : uname,
"phone" : phone,
"email" : mail
},
success : function(response) {
$(".status").fadeIn("slow");
$(".loader").hide();
$(".status").html(response);
if (response == "Please check your mail to verify account") {
$(".status").css({
"border" : "1px solid green",
"background-color" : "#B2D47F"
});
}
},
error : function() {
alert("error occured");
}
});
return false;
});
here I am binding ajaxstart
$(document).ajaxStart(function() {
$(".loader").show();
});
but it is not showing.. is anything wrong in my code?
Try adding beforeSend and complete handlers to your ajax call, and show/hide the loader in it. This will also work in case of error, because if you are hiding the loader in success handler and error happens, it will stay visible after ajax is completed.
$.ajax({
type : "POST",
url : "registerUser",
secureuri : false,
cache : false,
async : false,
data : {
"username" : uname,
"phone" : phone,
"email" : mail
},
beforeSend : function() {
$(".loader").show();
},
success : function(response) {
...
},
error : function() {
alert("error occured");
},
complete : function() {
$(".loader").hide();
},
});
I am working with MVC3. I have a javascript function which makes an ajax call to mvc3 controller action. When i send null in the data, it calls the controller action. but when I try to send location in data it gives javascript error i.e. 'this is not defined'.
function getPictureContent(location)
{
var pictures = getLocationPictures(location);
var content = "<div id=markerpictures></div>";
return content;
}
function getLocationPictures(location) {
var pics;
$.ajax({
type : "POST",
url : "/Home/GetLocationPictures",
data : {'location' : location},
contentType : "application/json; charset=utf-8",
dataType : 'json',
async : false,
success : function (data) {
pics = data;
}
});
return pics;
}
Here is the controller action:
public JsonResult GetLocationPictures(string location)
{
List<string> pictures = new List<string>();
return Json(pictures);
}
Try this.. Location should be string.Be sure that will string.
function getLocationPictures(location) {
var pics;
$.ajax({
type : "POST",
url : "/Home/GetLocationPictures",
data : JSON.stringify({'location' : location}),
contentType : "application/json; charset=utf-8",
dataType : 'json',
async : false,
success : function (data) {
pics = data;
}
});