jquery - How to make javascript module pattern work with ajax? -


I'm trying to change some javascript / jquery code to be able to handle AJAX tabs.

I All of my scripts load till the page loads, and I use the jquery live and livequery plugin to help with binding.

Each time it is in partial view (asp.net mvc 3) and when clicked is done to take over the operation of the controller and underlines partial view and sticks in the tab.

So live and livequality are solving most problems except for a problem. I am using the jquery datatables.net plugin and once it stores it in a variable and after using it in places I use it.

This is from when I am using module patterns that are running before the code table, even if the object storage variable is "undefined" then I will call it jquery livequery statement Tried to wrap around with and he creates table runs, but the variable is still "undefined".

My guess is that it is not like C # that it will update the context so I am thinking that it is in my global variable (for module pattern) and which is never updated.

  var tab = (function (my, $) {var myTable = my .dataTable = my.dataTable || {}; myTable.oDataTable = {}; myTable.init = function () {myTable.oDataTable = _fn Setaptebl (); _fnCreateDateFilters ();}; myTable.delete = function (rowToDelete) is required to obtain {/ / line. index var pos = this.oDataTable.fnGetPosition (rowToDelete [0] ) is required to use; / * Delete the line from the list - the first index of the ultimate line / /. data. Detatablkfnndelero (Pos, null, true);} function _fnSetupTable () {/ * datatable object * / Start $ ('# table'). Livequery (function () {// oDataTable after Switch to be used in lots of places, but when it will crash when the inevitable // use it. Var oDataTable = $ (this) .dataTable ({ "bJQueryUI": true, "Bifiltr": right the "Bituvdth": false, "endorsement type": "Puarn_snkya", "Seting": [[3, "ACC]]] / Ditet Time" default sorting on Olanugej ": {" sZeroRecord ( "Bsortable": false }, "bSortable": { "bSortable": true, "bsureable": false}, "bSortable": false, "{" BSortable ": false}," bSortable ": {" bSortable ": false," bSearchable ": False}, {"iDataSort": 3}, {"bSortable": false, "bSearchable": true}, {"bSortable": f Alse, BSearchable ": false}, {" bSortable ": wrong," bSearchable ": false}]}); Return oDataTable; }); } My return; } (Tab || {}, jquery));   

I use oDataTable quite a bit, as you can see that I can call my call. Delete I use it in OdateTable, but it will be "undefined" and crash.

I have another module class that starts the whole sequence (thus creates the code above) Run

  / * * document ready * / $ (function ( ) () * Starts all plugins and events * / tab.init ();}); Var tab = (function (Mary, $) {my.init = function () {tab.preload (); tab.dataTable.init (); $ ('# tabs'). Tab ();}; Return back; } (Tab || {}, jquery));    

There are several things that you are calling oDataTable and all of them are assigned in an inconsistent manner.

My first problem is that oDataTable value that you try to return from _fnSetupTable actually internal function Is scotched and comes back, so the following assignment does nothing:

  myTable.oDataTable = _fnSetupTable ();   

You are trying to use the result of _fnSetupTable but _ fnSetupTable does not actually return anything, its internal

Perhaps one major problem is how you are using the module pattern I will try to create a small example to demonstrate the problem:

 < Code> var input = {dataTable: "tab table"} var tab = (function (my, $) {// this var local var myTable = my.dataTable = my.dataTable || {}; // local variable myTable ODat Creating an asset at aTable = {}; //, this is what is back, but I am not accessible to me;} (input)); Console.log (tab) // does not contain an oTableData property   

A local variable named myTable has been created as your example and has given table properties But what is being returned is my , myTable is not. If you want to bring those properties back from the my object, then you have to assign them to my or you can myTable ?

Comments