call and end ajax function - javascript

When I call ajax function such
$(save_Data()).ajaxStop(function()
{
new_Form(code);
}
function save_Data()
{
// here send data to php and save it
}
Now, I call another ajax function such
$(get_Data()).ajaxStop(function()
{
// doing some thing
}
function get_Data()
{
$.ajax
({
type: 'POST',
url: 'insert_Stock.php',
data: { insert_Data : inserted_Data },
dataType: 'json',
success:function(data)
{
// doing some thing such call another function to control on form
}
});
}
When I call save_Data function already new_Form function execute, after that when I call get_Data function the new_Form function execute automatically.
Why new_Form function execute?

If I understood you this is what you want.
function doSomething(){
//your code here if success
}
function doSomethingElse(){
//your code here if error
}
function finallyDoSomethingElse(){
//your code here no matter what is the result of post
}
$.ajax({
type: 'POST',
url: 'insert_Stock.php',
data: { insert_Data : inserted_Data },
dataType: 'json',
success: doSomething,
error: doSomethingElse,
complete: finallyDoSomethingElse
});

Related

How can i pass function as parameter with arguments

I have ajax call function which have parameter function and it's looks like this
function selectedLang(func) {
let selected = selectLang.options[selectLang.selectedIndex].value;
$.ajax({
url: 'lang.php',
type: "POST",
dataType: 'json',
data: { language: selected },
success: function (data) {
// call here displayData function with parameter
func(data);
}
});
}
inside success i want to call function displayData with parameter data
function displayData(data) {
// some data
}
selectedLang(displayData);
Right now i'm getting an error that func is not a function
It looks like it is working.
https://jsfiddle.net/bpomehv5/
Check out this fiddle
function selectedLang(func) {
$.ajax({
url: 'https://randomuser.me/api',
type: "GET",
dataType: 'json',
success: function (data) {
// call here displayData function with parameter
func(data);
}
});
}
function showIt (data) {
console.log(data);
}
selectedLang(showIt);

Ajax Jquery run a function then with ajax inside and return success data

var datatobeuse = SearchTable("user_tbl", "first_name", "fname", "last_name", "lname");
I have this above code right after document ready.Then I have below code after document ready
function SearchTable(tablename, column1, label1, column2, label2) {
$.ajax({
type: 'POST',
url: '..user.php',
data: {
tablename: tablename,
column1: column1,
label1: label1,
column2: colum2,
label2: label2,
},
dataType: "json",
success: function (data) {
// console.log(JSON.stringify(data))
},
error: function (data) {
}
}).done(function (data) {
});
}
How can I use the data in success? I need to have return value so that I can use var datatobeuse which is right after document ready.
I tried solution from here
Like this one :
function isSession(selector) {
$.ajax({
type: "POST",
url: '/order.html',
data: ({ issession : 1, selector: selector }),
dataType: "html",
success: function(data) {
// Call this function on success
someFunction( data );
return data;
},
error: function() {
alert('Error occured');
}
});
}
function someFunction( data ) {
// Do something with your data
}
But it is not working
What you should do, is embrace the asynchronous character of javascript.
Asynchronous means it takes some time to execute the function, the rest of the javascript stuff will not wait for it. Ajax is an exellent example of this.
The solution is the callback. A callback is a function that will be called when the rest of the functionnality is ready.
I'll take your example to explain.
function isSession(selector, onReady) {
$.ajax({
type: "POST",
url: '/order.html',
data: ({ issession : 1, selector: selector }),
dataType: "html",
success: function(data) {
// all is finished. Now we can call the callback
if(typeof onReady == 'function') {
onReady(data);
}
},
error: function() {
}
});
}
function someFunction( data ) {
// Do something with your data
}
// now use them both
var selector = ".links";
isSession(selector, function(data) {
someFunction( data );
});
Reconsider why exactly you asked this question. You don't need a return value for your function.
This takes some different thinking. You wanted to know how to set the values to datatobeuse, like this:
var datatobeuse = somefunction();
// now datatobeuse is ready and we can use it.
displayOnScreen(datatobeuse);
Instead, think this way
var datatobeuse;
somefunction(function(data) {
datatobeuse = data;
displayOnScreen(datatobeuse);
})

Multiple Ajax function calls cause slow to load

function function1(val)
{
$.ajax({
type: 'post',
url: 'page1.php',
data: {
get_option:val
},
success: function (response) {
document.getElementById("id1").value=response;
function2(val);
function3(val);
function4(val);
function5(val);
}
});
}
function function2(val)
{
$.ajax({
type: 'post',
url: 'page2.php',
data: {
get_option:val
},
success: function (response) {
document.getElementById("id2").value=response;
function6(val);
}
});
}
function function3(val)
{
$.ajax({
type: 'post',
url: 'page3.php',
data: {
get_option:val
},
success: function (response) {
document.getElementById("id3").value=response;
}
});
}
This is my some functions function1 success part I call other functions like function2, function3, function4, function5. In my Second function function2 I call another one function function6 on its success part its more time to get its resultsHow to avoid this wait time...?
If each of your ajax requests are returning results somewhat sequentially it's probably session blocking in effect. If the execution of the scripts can be performed simultaneously without affecting the results, try adding the following early in the PHP code:
session_write_close(); //let the next requests start
This will allow the subsequent ajax requests to begin PHP processing and should improve your results significantly.

Jquery deferred not behaving as expected

I make 2 ajax calls. Second one should be called only when the first is finished:
var deferred = $.Deferred();
firstAjaxCall();
deferred.done(function () {
secondAjaxCall();
});
function firstAjaxCall() {
$.ajax({
url: '/SomeUrl',
type: 'POST',
success: function () {
deferred.resolve();
}
});
}
function secondAjaxCall() {
$.ajax({
url: '/SomeOtherUrl',
type: 'Get',
});
}
I also tried like this (jQuery deferreds)
$.when(firstAjaxCall()).done(function() {
secondAjaxCall();
});
but no luck.
Still, in the first example, sometimes the second call gets called first, sometimes it doesn't
In the first example the flow is like this:
firstAjaxCall();
secondAjaxCall();
deferred.resolve();
why is second call called first and before deferred.resolve() ?
You have to actually return the Deferred from $.ajax to $.when to make that work
function firstAjaxCall() {
return $.ajax({
url : '/SomeUrl',
type : 'POST'
});
}
function secondAjaxCall(data_from_first) {
return $.ajax({
url : '/SomeOtherUrl',
type : 'Get',
});
}
firstAjaxCall().done(secondAjaxCall);
You can try to call secondAjaxCall() in the success function of the first one
Like this :
function firstAjaxCall() {
return $.ajax({
url: '/SomeUrl',
type: 'POST',
success: secondAjaxCall()
});
}

$.ajax + make success function parameterized

A stupid question.
I am calling $.ajax function in many of my button clicks, text changed, drop down value changed etc. So I thought of making this function parameterized. Below is the code I was trying to use.
function ajaxCall(ajaxUrl, methodName) {
try {
$.ajax({
type: 'POST',
url: ajaxUrl,
success: methodName
},
dataType: "html"
});
}
catch (e) {
alert(e.message);
}
}
In this the "methodName" should be the name of the method the control should go.
Or in short, when I use ajaxCall('test.aspx','testMethod'), the control should be transferred to
function testMethod(xmlResponse){
alert ('Inside testMethod');
}
In JavaScript you can use functions as variables, so just call ajaxCall with url and success handler.
function testMethod (xmlResponse) {
alert('Inside testMethod');
}
function ajaxCall (ajaxUrl, methodName) {
try {
$.ajax({
url: ajaxUrl,
type: 'POST',
dataType: 'html',
success: methodName
});
}
catch (e) {
alert(e.message);
}
}
ajaxCall('test.aspx', testMethod);

Categories

Resources