Passing Input name and column as variables to $.fn.dataTableExt.afnFiltering.push

Passing Input name and column as variables to $.fn.dataTableExt.afnFiltering.push

avronavron Posts: 2Questions: 0Answers: 0
edited June 2010 in Plug-ins
Hi,

This is an amazing product. The deeper I delve into it, the greater the flexibility I find.

I've tried the examples and forums, but had one last question I was hoping you could help me with.

I'm trying to filter individual columns that are greater then a given number. I've altered the code in the example provided to do this. However, I'm looking to add an input text box for each column, and I was wondering if in calling oTable.fnDraw() or $.fn.dataTableExt.afnFiltering.push it was possible to pass the column number (iColumn) as a variable, and perhaps the name of the form element (var iMin = document.getElementById('min').value * 1).

Thanks
Avron

Replies

  • allanallan Posts: 63,676Questions: 1Answers: 10,497 Site admin
    Hi Avron,

    The filtering functions in afnFiltering operate on the whole row of data, rather than on an individual column. It is then up to you, the developer, which columns should be filtered on in the array of data that is passed to you (it might need a bit of abstraction - detect which column needs this kind of filtering based on class name or something for example...).

    So there isn't a direct way to operate on a column only - since you aren't operating only on a column, but a row :-)

    Allan
  • avronavron Posts: 2Questions: 0Answers: 0
    Thanks Allan,

    You spurred me on to dig a bit deeper, and I believe I understand what you are saying, but hit one hurdle. Apologies if this query is too simple (or show's my lack of jquery knowledge).

    I've declared two variables - iColumn to represent the Column number, and frmID to represent the form element being called. I've then tried declaring these variables before calling fnDraw as below
    $('#Total').keyup( function() { var iColumn = 2; var frmID = 'Total'; oTable.fnDraw(); } );

    Unfortunately, the variables don't carry into the afnFiltering function. That said, declaring the variables before afnFiltering worked, but then I'm unable to update them. Could you give me any pointers?

    Thanks
    Avron
  • allanallan Posts: 63,676Questions: 1Answers: 10,497 Site admin
    The issue here is the scope of the variables. It might be worth reading about variable scope: http://www.digital-web.com/articles/scope_in_javascript/ , http://www.mredkj.com/tutorials/reference_js_intro_ex.html (the top two Google hits - there are plenty of others).

    Your iColumn and frmID variables only exist in the keyup function - hence why then can't be seen in the filtering function. When you declare them before the filtering function they were global variables (all functions can see them) - which works, and you can update them anyway (including the keyup function there) - but you are 'polluting the global name space'. It's a very bad idea to use global variables without a good deal of consideration - imagine for example you had a global variable i which you used for every counter - a loop which calls a function with a loop would be very bad news....

    So, worth trying globals for experimentation, but not a long term solution - for that you will need to know how scope resolution works in Javascript and good programming practices :-)

    Hope this helps,
    Allan
This discussion has been closed.