Providing Default Ajax Implementation

zepernick · January 2015

First off, thank you for all your hard work on 1.10! I am in the middle of trying to move off of 1.9 and have ran into a couple roadblocks. Let me first describe how my 1.9 was setup and why. The DataTables are being used inside of a secured web application. All of our jQuery ajax calls are run through our own JS ajax wrapper for jQuery that checks if the user is logged in before firing the success of the ajax. If not logged in, a login dialog is presented and the ajax is fired again after login. This was accomplished in 1.9 by extending the $.fn.dataTable.defaultsand providing a function for fnServerData

fnServerData: function (sSource, aoData, fnCallback) {
                    $jw.secureAjax({
                        url: sSource,
                        data: aoData,
                        dataType : "json",
                        success: function(data, status, xhr) {
                            fnCallback(data, status, xhr);
                        } 
                            
                    }); 
                }

The nice thing about this was that the sSource got handed in which allowed each table to specify the ajax URL for that particular table.

I am now trying to replicate this same type of thing in 1.10 and have not been able to find a way around it.

ajax: function(params, callback, dtSettings) {
                
                $jw.secureAjax({
                    url: $(dtSettings.nTable).data("ajax-url"),
                    data: params,
                    type: "post",
                    dataType : "json",
                    success: function(data, status, xhr) {
                        callback(data);
                    } 
                        
                }); 
            }

The above default works fine, but there does not seem to be a way for each table instance to specify the URL like I was able to accomplish in 1.9. I am considering putting a data attribute on the table itself data-ajax-url as you can see in my example above, but would like it to remain in the JS if possible. I wanted to see if there was another way that I may be missing?

I was also looking at the source of the _fnBuildAjax in hopes I might be able to do something with the preXhr event, but it does not have access to the baseAjax which stopped me from being able to potentially use that instead of trying to do it through $.fn.dataTable.defaults.

I am trying my best not to modify the source making it harder for us to implement future upgrades.

I am also dealing with the issue of letting each table instance specify additional http parameters when I have overridden the default ajax implementation. I have tried to add my own custom properties to the DataTables option object, but those end up getting removed before I can get at them.

Thanks for any assistance you can provide!

allan · January 2015

This isn't a scenario I had thought about for 1.10 to be honest - apologies.

What I think you might need to do is define a custom parameter in the DataTables initialisation (perhaps ajaxUrl) and then use that in your default ajax method - much as you suggest.

There isn't an API method to access the initialisation options yet (I am going to be adding it very soon!) but what you can do is simply dtSettings.oInit.ajaxUrl. This works as dtSettings.oInit is the configuration object that was used to create the DataTable.

The settings object is not a public API so I normally wouldn't recommend this, but in this case I think it is the only option until I add the new method...

Allan

zepernick · January 2015

Thank you!!!

Here is what I ended up with if it helps anyone else out.

default ajax property

ajax: function(params, callback, dtSettings) {
                
                if(dtSettings.oInit.$jwAjax === undefined) {
                    throw "[DataTables init error] $jwAjax Param Not Defined";
                }
                
                if(dtSettings.oInit.$jwAjax.url == undefined) {
                    throw "[DataTables init error] $jwAjax.url Param Not Defined";
                }
                
                var httpParams = dtSettings.oInit.$jwAjax.params || {};
                params = {
                        dtParams : JSON.stringify(params)   
                };
                jQuery.extend(params, httpParams);
                
                //console.log("server url " + dtSettings.oInit.$jwAjax.url);
                $jw.secureAjax({
                    url: dtSettings.oInit.$jwAjax.url,
                    data: params,
                    type: "post",
                    dataType : "json",
                    success: function(data, status, xhr) {
                            callback(data);
                    } 
                        
                }); 
            }

parameter passed on init

$jwAjax : {
                        url: "claimsList.action",
                        params: {
                            memberId : getMemberId()
                        }
                    }

Providing Default Ajax Implementation

Providing Default Ajax Implementation

Answers

Howdy, Stranger!

Categories

DataTables

Providing Default Ajax Implementation

Providing Default Ajax Implementation

Answers

Howdy, Stranger!

Quick Links

Categories

DataTables