How can I override Drupal.ajax written in misc/ajax.js?
I need to check URL existence before firing an AJAX call.
Is there any other way/better way to achieve that without overriding this js?
Thanks
I don't know about Drupal.ajax but this Jquery Method is the way to go:
$(document).ajaxSend(function(event, jqxhr, settings){
if ( settings.url == "some urls" ) {//checks if related url should be checked or not.
//Do Something likeThis url checkingor what ever you want.
if(!UrlExists(settings.url)){
jqxhr.abort();
}
}
});
Be careful, This method is a global ajax event -- so this effectively can filter all ajax requests.
Related
I have an ajax request to server side script in order to validate my captcha. I want my requested script to stopPropagation based on server response.
this is my script:
$scope.submit = function(e){
s_registration.captchaValidation($scope.txtCaptcha)
.then(function(r){
if(r == 'failed'){
e.stopPropagation();
}
});
}
I understand this not gonna work because the response will not arrive soon due to ajax call, but i cannot find another way that fix my scenario. Any advice guys?
you need to stop propagation synchronously, and you called it asynchronously
$scope.submit = function(e){
s_registration.captchaValidation($scope.txtCaptcha);
e.stopPropagation();
}
I want to have a function called for every ajaxComplete call regardless of the ajax call. I know I can set a default value using my spinner by saying ('#spinner').ajaxComplete(complete) however if I have an ajax request that implements it's own complete my default complete method is not called.
How can I make a central function get called when any ajax call has completed??
Attach your ajaxComplete to the document; the ajax event will bubble up:
$(document).ajaxComplete(function(e, xhr, settings) {
// Do whatever you need here.
});
Attach the ajaxComplete listener to the DOM. This allows us to monitor it for any
$(document).ajaxComplete(function(e,request, options){
//attach our listener for ajaxComplete to the DOM.
//whenever an ajax call is completed, the DOM will send this function
customAjaxCompleteFunction();
});
var customAjaxCompleteFunction = function(){
alert("Custom Function for Each ajax call on complete!");
}
I would like to have a central place where I monitor ajax requests and in certain situations abort them.
The only thing I don't know to do is to actually abort the ajax request from one central function.
I Imagine that the solution would look something like this:
jsf.ajax.addOnEvent(function(data) {
if (data.status === 'begin') {
// abort the ajax request
}
});
But I might be mistaken.
Thanks!
This is not possible by the standard JSF JS API. Your best bet is to add an onclick or onchange handler on the calling JSF component which returns false if the desired condition is met to abort the ajax request.
<h:commandButton onclick="return mayFireAjax(this)">
<f:ajax />
</h:commandButton>
You can if necessary abstract this away with jQuery.on() (or jQuery.delegate() or jQuery.live() depending on the jQuery version used) on a common selector so that you don't need to repeat it on every desired component.
$(someSelector).on("click", function() {
return mayFireAjax(this);
});
If you have control the source, you can always attach a onClick to the UICommand component. But in some situation, you do not have access to source. For example, the ajax is provided by some third-party component. You do not want to mess up with their components.
First, I have a small js library.
var FxJSFBegin = "JSFBegin";
if (jsf) {
var originalRequest = jsf.ajax.request;
jsf.ajax.request = function(source, oevent, options) {
var event = $.Event(FxJSFBegin);
event.options = options;
event.originalEvent = oevent;
$(source).trigger(event);
if (event.isDefaultPrevented()) {
return;
} else {
originalRequest.apply(null, arguments);
}
};
}
This piece code proxies original JSF ajax call. It uses jQuery to fire a "JSFBegin" event. Integration code can listen this event using jQuery mechanism. Listener can cancel the jsf call using event.preventDefault().
Requirement:
jQuery
This piece code should be placed after jsf.js is loaded.
Using global="false" will help you prevent calling the ajax status for an ajax call. Please refer to the following link.
Different Ajax statuses for different components in PrimeFaces
On my website I have mouse over and mouse out events set up on an HTML table. These events trigger ajax requests, and perform certain actions etc. However, i want to be able to not trigger a second request if one is already running. So, is there away to detect these requests, and therefore avoid a second. Incidentally Im using the jQuery $.ajax()
if it helps at all.
Thanks in advance
Chris
I'd try something simple like:
var requestMade = false;
function yourAjaxFunction(){
if(!requestMade)
{
requestmade = true;
$.ajax({
url: "page",
success: function(){
requestMade = false;
}
error: function(){
requestMade = false;
}
});
}
}
You can use the success: and error: settings to change the variable back to false.
I have never used the error so you may have to include some other things in it, but this is the general idea.
For this suppose I'd use ajaxStart() and ajaxStop() which would change specific variable ajaxRunning which could be checked before sending the request (maybe in ajaxStart() directly?)
Set global or local static variable to true when first ajax is about to trigger, than add if before triggering the second one ;) Than after one request is finished, set this variable to false
This is easy enough to work around, but it would be nice if it was wrapped up in the global ajax setup
When I run an ajax call, I'd like to know which element/event trigger the ajax call in the beforeSend option.
Is there a concise way of doing this?
The beforeSend callback takes two arguments: the XMLHTTPRequest instance and the settings used by the current AJAX call.
Therefore, if you pass the triggering element and event in the context option, they will be available to beforeSend even if you define it in the global setup:
$.ajaxSetup({
beforeSend: function(xhr, settings) {
var element = settings.context.element;
var event = settings.context.event;
// Do something with 'element' and 'event'...
}
});
$("selector").click(function(e) {
$.ajax("url", {
// your settings,
context: {
element: this,
event: e
}
});
});
Start Here
Global Ajax Event Handlers
These methods register handlers to be called when certain events, such as initialization or completion, take place for any AJAX request on the page. The global events are fired on each AJAX request if the global property in jQuery.ajaxSetup() is true, which it is by default. Note: Global events are never fired for cross-domain script or JSONP requests, regardless of the value of global.
.ajaxComplete() // initialize in for all ajax request and set event in jQuery.ajaxSetup()
.ajaxComplete() - Register a handler to be called when Ajax requests complete. This is an Ajax Event.