Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

jquery datatables server side update to filter out inactive records

Posted on 2013-01-08
4
Medium Priority
?
1,611 Views
Last Modified: 2013-01-10
I have the following jQuery datatables initialization code and on the page
pTable = $('#myTable').dataTable({
					"bProcessing": true,
					"bServerSide": true,
					"bStateSave": false,
					"bAutoWidth:":false,
					"iDisplayLength":8,
					"sAjaxSource":"myServerSideScript”
					"bLengthChange": false
		}

Open in new window

Additionally I have a checkbox on the page above myTable that allows a user to see only records with an “active” status.  
 Only active <input id="active" onClick="showActive(this)" type="checkbox" name="selected">							   
		</form>

Open in new window

I’m not certain what dataTables API to use (if there is even one) to accomplish this.  Something like pTable.fnFilter(‘active’) but that keeps all the filtering and sorting already present in the table.  Is there a function to update the server side call but maintain the filtering and sorting?
Thanks!
0
Comment
Question by:HyperBPP
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
4 Comments
 
LVL 1

Accepted Solution

by:
tjyoung earned 2000 total points
ID: 38758355
Hi,
yes that is doable, no problem. Might want to use 2 radio buttons. Show active, show all or something like that. I've attached a jpeg of one of my tables showing filters in use. Relevant code for my table radio button other then the jquery for theshown below:

"fnServerParams": function ( aoData ) {
            aoData.push( {"name": "calltype", "value": $('input:radio[name="calltype"]:checked').val()} )
            },

You also need the fnReload linked up (check datatables.net, not sure on the name, might be fnDraw?). That is called when you click the radio button and reloads the table.

//radio button code calling the fnDraw
$("input:radio[name='calltype']").click( function () {
    oTable.fnPageChange( 'first', false );
      oTable.fnDraw();
      } );

table sample
0
 
LVL 6

Author Comment

by:HyperBPP
ID: 38764933
Works a charm!  Thanks!
0
 
LVL 6

Author Closing Comment

by:HyperBPP
ID: 38764937
Thanks!  Works great!
0
 
LVL 1

Expert Comment

by:tjyoung
ID: 38765150
Sure glad to help
0

Featured Post

DFW AZURE MEETUP TONIGHT FRI 6PM

We will be discussing what Azure Stack is, how does it fit into the suit of offerings that Azure has currently, and where can it fit into your organizations technology stack. We will also be discussing limitations of the platform while covering various applicable scenarios.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

721 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question