Quantcast
Channel: DataTables 1.9 — DataTables forums
Viewing all 1817 articles
Browse latest View live
↧

Link to specific row of data on datatables

June 28, 2013, 3:52 pm
$
0
0
Hi all,

Is there a way to link to a specific row of data in datatables using something like:

http://localhost/datatables?search=entry1

So that when user click on the link, only the specific data is being displayed? Is it possible to do so?

Thanks in advanced!
↧
Search

Doubt regarding infinite scrolling

June 29, 2013, 5:12 pm
$
0
0
Hi,
I am trying to implement the infinite scrolling feature and I saw from the documentation that I can either use server side processing and do all the filtering as well as incremental data fetch on the server or I can use the ajax data source to fetch all the data and let datatables do the filtering for me.

Now my requirement here is kind of a mix of these 2 features such that, I have a filter on a column, but I only want to do client side filtering (as in filter only on the rendered data), but the scrolling should be done by fetching data from the server incrementally.

Is there any way to achieve this functionality?
↧
↧

how to add progress bar in specific cells this table?

June 30, 2013, 2:16 pm
$
0
0
hi

how to add progress bar in specific cells this table?

  <script>

        $(document).ready(function () {
            var oTable = $('.table').dataTable({
                "bProcessing": true,

                "aaData": [

	["Trident", "how to add progress bar in this cell", "Internet Explorer 4.0", "Win 95+", "4", "X"],
	["Trident", "how to add progress bar in this cell", "Internet Explorer 5.0", "Win 95+", "5", "C"],
	["Trident", "how to add progress bar in this cell", "Internet Explorer 5.5", "Win 95+", "5.5", "A"],
	["Trident", "how to add progress bar in this cell", "Internet Explorer 6", "Win 98+", "6", "A"],
	["Trident", "how to add progress bar in this cell", "Internet Explorer 7", "Win XP SP2+", "7", "A"],
	["Trident", "how to add progress bar in this cell", "AOL browser (AOL desktop)", "Win XP", "6", "A"]]

            });
        });
    </script>
</head>
<body>
    <script>
        progressBar(75, $('#progressBar'));
	</script>
    <div class="span6 box gradient">
        <div class="title">
            <h3>
                <i class=" icon-bar-chart"></i><span>Striped Table</span>
            </h3>
        </div>
        <!-- End .title -->
        <div class="content">

            <table class="table table-striped">
                <thead>
                    <tr>
                        <th>#
                            </th>
                        <th>ProgressBar
                            </th>
                        <th>Last Name
                            </th>
                        <th>Username
                            </th>
                        <th>Cpu
                            </th>
                        <th>First Name
                            </th>
                    </tr>
                </thead>
            </table>
        </div>
    </div>
</body>
</html>
↧

Selecting a row

June 30, 2013, 9:42 pm
$
0
0
Hi
I will like to selec one row of my table, I got the idea of the example of the selecting example, but it doesn't work.
This is my code
<script type="text/javascript" charset="utf-8" id="init-code">

var oTable;
$(document).ready(function() {
    oTable = $('#example').dataTable( {
        "bProcessing": true,
        "sAjaxSource": "tomacorrienteslist.jsp",
        "bFilter": false,
        "bSort": false,
        "bInfo": false,
        "bPaginate": false,
        
         "aaSorting": [[ 4, "desc" ]],
        "aoColumns": [
            { "mData": "codigo" },
            { "mData": "descripcion" },
            { "mData": "xbee_id" }
        ]

        
    } );
    
     $("#example tbody tr").click( function( e ) {
        if ( $(this).hasClass('row_selected') ) {
            $(this).removeClass('row_selected');
        }
        else {
            oTable.$('tr.row_selected').removeClass('row_selected');
            $(this).addClass('row_selected');
        }
    });
} );

</script>
What's wrong?
↧

Toolbar re-sizing.

July 1, 2013, 2:27 am
$
0
0
Is there any way to force the toolbars to be the same size as the table ?

I have a table with 10 columns and when I re size the browser window everything re sizes fine until the table get to the narrowest it can be due to header names etc.. at which point the toolbars will continue to re size smaller and looks wrong.

I'd like to fix this to match whatever the table currently is.
For clarification I'm saying toolbars and mean the top an bottom bars around the table that contain the show xx entries, search and pagination.

Thanks :)
↧
↧

Cannot get data to display in the table

July 1, 2013, 9:10 am
$
0
0
I do not want to have a duplicate question, but I have been on these forms for hours and hours now and I think it would just be easier to ask this question. First of all I <3 datatables it is boss, thank you Allen for make this awesome plugin. Secondly, my problem. So I started out having problems which turnout to be the format of my JSON code but now I am receiving the message: "DataTables warning (table id = 'airForceDataTable_conn'): Requested unknown parameter 'orig_h' from the data source for row 0." I still think it is related to my JSON but I will let you guys be the judge of that.

Debugger (another really awesome tool :3 thanks also to note that i am having problems with the #airForceDataTable_conn not the other one) : http://debug.datatables.net/iladuc

DataTable js code: http://jsfiddle.net/JEvwz/

JSON: 
 
{
sEcho:3, 
iTotalRecords:10, 
iTotalDisplayRecords:2, 
aaData:[
[{orig_h:"140.175.25.103"}, {orig_p:"61931"}, {resp_h:"140.175.215.36"}, {resp_p:"8080"}, {orig_bytes:"923"}, {resp_bytes:"989"}], 
[{orig_h:"140.175.25.103"}, {orig_p:"61813"}, {resp_h:"140.175.215.36"}, {resp_p:"8080"}, {orig_bytes:"0"}, {resp_bytes:"0"}]
]
}

Thank you for any help you can give me.
↧

PHP Generated Table - 5 Rows shown, only 1 is counted

July 1, 2013, 9:43 pm
$
0
0
Hello, I have installed this and done the basic setup. I have a tables thing where users can submit into a table and it auto generates a table row with what they inputted, even though their are 5 rows, it only wants to count in 1 row, and I don't know what to do :/ Server-Side Processing doesn't work for me either, thanks for the help!
↧

Datatables causing firefox and IE browsers to stop responding.

July 1, 2013, 4:48 am
$
0
0
Hi,

Am using datatables 1.9.4 along with jquery 1.8.3, and when creating a table with around 1100 rows under firefox and ie the browser stops responding and an error dialog appears reporting the script has stopped resonding. Click continue and it will eventually display the table correctly. Chrome works fine.

There are 13 columns of data (2 are blank and purely for spacing) and if reducing these to 9 it works. Jquery is extended for custom sorting. Removing all of that makes no difference. Datatables has been stripped down to the basics with no pagination or other options.

Occasionally the table will appear before the error dialog, however in normal html format. Once clicking on continue it's formatted correctly in datatables.

I understand that without showing all the code here it could be difficult to troubleshoot, but wondering if anyone else has encountered a similar issue or could throw any suggestions my way.

Thanks.
↧
Search

on click on link i am showing Datatable..............

July 2, 2013, 12:03 am
$
0
0
Hi Allen,

I have given one link in ist data table, and on select of that link i am sending id getting some data and showing inside of one more data table.

But the problem is that old data is showing for mean time , finally the correct data is coming only... in 2nd table...

my code is................................

Ist table
..................
definedTypeTable = $("#definedType").dataTable({
"sPaginationType" : "scrolling",
"bProcesing" : true,
"bServerSide" : true,
"bLenthChange" : false,
"iDisplayLength" : 10,
"sScrollY" : "300px",
"sAjaxSource" : "/ECE/getDefinedTypes",
"bSort" : false,
"bFilter" : false,
"aoColumns" : [
{
"bVisible": false,
"mData" : "defTypeID",
},
{
"sTitle" : "Description",
"mData" : "defTypeDesc"
},
{
"sTitle" : "Domain Text",
"mData" : "defTypeText"
},

{
"mData": null,
"sClass": "left",
"sDefaultContent": '<a href="" class="show">View values</a>'

},

{
"mData": null,
"sClass": "right",
"sDefaultContent": '<a href="" class="edit"><img src="images/editnode.JPG" /></a>&nbsp;&nbsp;<a href="" class="editor_remove"><img src="images/delete.png" /></a>'

}

],

"fnServerData" : function(sSource, aoData, fnCallback) {
$.ajax({
"dataType" : 'json',
"type" : "GET",
"url" : sSource,
"data" : aoData,
"success" : function(json)
{
fnCallback(json);

}
});
},
"sPaginationType" : "full_numbers"

});


2nd table
..................
$('#definedType').on('click', 'a.show', function (e){
var sData = definedTypeTable.fnGetData($(this).parents('tr')[0]);
var defTypeID = sData['defTypeID'];
// DataTables init
definedTypeValueTable = $("#definedTypeValue").dataTable({
"sPaginationType": "scrolling",
"bProcesing" : true,
"bServerSide" : true,
"bLenthChange" : false,
"iDisplayLength" : 10,
"sScrollY" : "200px",
"sAjaxSource" : '/ECE/getDefTypValuesById?defTypeID='+defTypeID,
"bDestroy" : true,
"bSort" : false,
"bFilter" : false,
"aoColumns" : [

{
"sTitle" : "Data Type",
"mData" : "defTypeID",
"bVisible": false

},
{
"sTitle" : "Number",
"mData" : "itemID"
},

{
"sTitle" : "Name",
"mData" : "defTypeValDesc"
},

],
"fnServerData" : function(sSource, aoData, fnCallback) {
$.ajax({
"dataType" : 'json',
"type" : "GET",
"url" : sSource,
"data" : aoData,
"success" : function(json)
{
fnCallback(json);

}
});
},

"sPaginationType" : "full_numbers"

});
return false;
});




Thanks In Advance
↧
↧

Sorting problem (row details example)

July 1, 2013, 10:57 am
↧

How to reinitialize dataTable???

July 1, 2013, 5:21 am
$
0
0
Dear Allan,
I am having a problem with jquery dataTable plugin. I am using two text box and a button and onclick event of that button i am calling my dataTable.
After Page load..FIRST time when i clicked on button , dataTables working fine and populates records and performs all its functionality..
but when i change some values in text box and again click on button SECOND time to populate dataTables with new records...Its give me error like "Cannot reinitialize dataTables"...Then to resolve these error i used "fnClearTable" and "fnDestroy" function of dataTables (as i used it in my following code)...But still i am not able to reinitialize dataTable and GETTING OLD VALUES NOT FRESH ONE...

Below is my javascript code to call dataTables and trying to reinitialize it.... please help me to solve these problem...i am waiting for ur reply..
thanks in advance..


            


$('#id_prepack').click(function() {
			
			
				//alert("clicked");
				var button_id=$(this).attr('id');
				alert(button_id);
				
				var str_mtr_from=document.getElementById("id_mtr_from").value;
				var str_mtr_to=document.getElementById("id_mtr_to").value;
				
				var str_cca_from=document.getElementById("id_cca_from").value;
				var str_cca_to=document.getElementById("id_cca_to").value;
				
				if((str_mtr_from!="" && str_mtr_to!="") || (str_cca_from!="" && str_cca_to!=""))
				{
					
					var settings={
								"bDestroy":true,
								"bRetrieve": false,
            						"bJQueryUI": true,
                						"bServerSide": true,
                						"bAutoWidth": true,
                						"sAjaxSource": "/web_trial_one/SourceMeter?button_name="+button_id+"&txt_mtr_from="+str_mtr_from+"&txt_mtr_to="+str_mtr_to,  
                						"bProcessing": true,
                						"sPaginationType": "full_numbers",
                						"sDom": 'T<"clear">lfrtip',   
                						"oTableTools": {
                	       					"aButtons": [ "copy","csv","xls","pdf",
                	         						{
            										"sExtends": "download",
            										"sButtonText": "Download Excel",
            										"sUrl": "/web_trial_one/prepack_download"
         							 		}
                	         
                	          		   		  	 ],
                		   					"sSwfPath": "./table_tool2.0/media/swf/copy_cvs_xls_pdf.swf"
									}
														
							};
						
					
						if(typeof oTable=='undefined')
						{
							oTable = $("#prepack").dataTable(settings);	
						
						}
						else
						{
						            				
            					oTable.fnClearTable();
            					oTable.fnDestroy();
            					oTable=$("#prepack").dataTable();	
            					oTable=$("#prepack").dataTable(settings);
            				            			
						}
								
					
				}
				else
				{
					alert("To Proceed..Please Enter any Search Dimension Field");
				}
				
			});
↧

Submit a form and make the filter in the datatable.

July 2, 2013, 8:12 pm
$
0
0
hi, need some help with a question, i have a page called "search.php" and it has a form, in this form i put all the filter i want and i submit it to a ṕage called "result.php", this page result is the page i have the datatable1.9.4 running.
i have the file "server_proccessing.php" with the information it need and its showing all the results of my table.

my question is, how can i make a filter with the $POST[''] variables i have from the page "search.php", to have a filtered result in "result.php"?
↧

oTable in 1.9.4 has no fnIsOpen? "TypeError: Object [object Object] has no method 'fnIsOpen'"

July 2, 2013, 4:15 pm
$
0
0
I clipped some example code and stuck it into my dataTable like this:

		"fnInitComplete": function(oSettings, json) {
		jQuery('#data tbody tr').click( function () {
		  if ( oTable.fnIsOpen(this) ) {
			oTable.fnClose( this );
		  } else {
			oTable.fnOpen( this, "Temporary row opened", "info_row" );
		  }
		} );
		},

Got this error "TypeError: Object [object Object] has no method 'fnIsOpen'".

Then I cut the snippet down to this, and it worked:

		"fnInitComplete": function(oSettings, json) {
		jQuery('#data tbody tr').click( function () {
			oTable.fnOpen( this, "Temporary row opened", "info_row" );
		} );
		},

Of course it doesn't close the opened row, though. Why is fnIsOpen not recognized here?
↧
↧

Multi Query with different numbers of columns

July 3, 2013, 2:12 am
$
0
0
I have a table element in a div, I used it for multi querys pipeline.

when i click button1, will run the code below:
$('table#table').dataTable( {
				"bJQueryUI": false,
				"bServerSide" : true,
				"bProcessing": true,
				"bDestroy" : true,
				"bPaginate": true,
				"bFilter" : false,
				"bLengthChange" : false,
				"sPaginationType": "full_numbers",
				"sAjaxSource": "/getUserJson/",
				"aoColumns" : [
					{"sTitle" : "s1"},
					{"sTitle" : "s2"},
					{"sTitle" : "s3"},
					{"sTitle" : "s4"},
					{"sTitle" : "s5"},
					{"sTitle" : "s6"},
					{"sTitle" : "s7"}
				],
				"fnServerData" : function (sSource, aoData, fnCallback) {
					fnDataTablesPipeline(sSource, aoData, fnCallback, oPostData)
				},
			} );

and when i click button2, will run the code below
$('table#table').dataTable( {
				"bJQueryUI": false,
				"bServerSide" : true,
				"bProcessing": true,
				"bDestroy" : true,
				"bPaginate": true,
				"bFilter" : false,
				"bLengthChange" : false,
				"sPaginationType": "full_numbers",
				"sAjaxSource": "/getPlayerJson/",
				"aoColumns" : [
					{"sTitle" : "_s1"},
					{"sTitle" : "_s2"},
					{"sTitle" : "_s3"},
					{"sTitle" : "_s4"},
					{"sTitle" : "_s5"}
				],
				"fnServerData" : function (sSource, aoData, fnCallback) {
					fnDataTablesPipeline(sSource, aoData, fnCallback, oPostData)
				},
			} );

the pipeline works fine, but the columns s6, s7 is still there after the _s5 column.

I have tried a lot ways, using fnDestroy, before I run the dataTable function. Destroy the table element, but I don't have a good resolution.

Anyone help~?
↧

oLanguage being ignored when bServerSide = true

July 3, 2013, 7:24 am
$
0
0
Hey all, I tried to google for others with this issue but was unable to find anything.

When I have bServerSide = true, oLanguage values are ignored. If I set it to false the values I set are listened to.

I'm using datatables to help out with the format & display of a huge medical dataset, and I don't want to load all the content for the user's query at once so setting bServerSide to false is not an option.

However, when I try to specify custom oLanguage values, either using oLanguage : { key : value } or oLanguage { sUrl : URL }, the values are ignored entirely.

If I use sUrl I can clearly see that the request is made & returns 200 ok with the JSON object, but the values are still ignored.

Any help or insight would be greatly appreciated.

Parameters:
"aaSorting" : [[0, "desc"]],
"aoColumnDefs" : *omitted*,
"bProcessing" : true,
"bInfo" : 
"oLanguage" : {
    "sUrl" : i18n/dataTables/oLanguage_EN-US.php'
},
"bServerSide": true,
"bRetrieve" : true,
"sServerMethod" : "POST",
"sAjaxSource" : "*omitted*",
"iDisplayLength" : 10,
"bAutoWidth" : false,
"sDom" : '<"class"li<"clear">>rt<"class"p><"clear">',
"aLengthMenu" : [[10, 25], [10, 25]],
"sPaginationType" : "numeric",
"fnInitComplete" : *omitted*,
"fnServerData" : *omitted*

oLanguage Object:
{
"sEmptyTable" : "value",
"sZeroRecords" : "value",
"sLoadingRecords" : "value",
"sProcessing " : "value",
"sInfo" : "Showing _START_ to _END_ of _TOTAL_ records"
}

Thank you.
↧
Search

Language translate.

July 3, 2013, 7:37 am
$
0
0
Hello!

How i can translate language of searchbar text, results, pagination buttons text , etc.. ?

thanks in advance !

p.s. - Awesome script !
↧

sAjaxDataProp

July 3, 2013, 8:22 am
$
0
0
Hello
I am using the following code for dataTables. i am getting aData is undefined error
Pls help...
function populateValueAddTable() {
		valueAddOTable = $('#valueAddTable').dataTable({
			"bDestroy" : true,
			"bServerSide" : false,
			"bProcessing" : true,
			"sAjaxDataProp" : "list.values",
			"sAjaxSource" : "rs/services/json/getValueAdd",
			"sScrollY" : 200,
			"bJQueryUI" : true,
			"sPaginationType" : "full_numbers",
			"aoColumns" : [ {
				"sTitle" : "ID",
				"mDataProp" : "id"
			}]
		});

	}
and JSON is

{
"list": [
{
"values": [
{
"id": 1,
"entryDate": "12/12/12",
"purpose": "yes",
"workStream": "BASIS",
"details": "Details",
"benefits": "Benefits",
"plannedImplementationDate": "12/10/12",
"proposedBy": "bxp8561"
},
{
"id": 14,
"entryDate": "12/12/13",
"purpose": "no",
"workStream": "BASIS",
"details": "New",
"benefits": "money",
"plannedImplementationDate": "12/1/13",
"proposedBy": "bxp8561"
}
]
}
]
}
↧
↧

Multiple column sort with server side

July 3, 2013, 10:39 pm
$
0
0
I'm trying to figure out what I am missing here - setting a multiple column sort initially is easy via aaSorting, but when I click on a column to sort, the only data I get on the server side is for just that one column.
I.e., if I have A, B, C columns I can set up to initially sort like this:

'aaSorting': [[2, 'asc'], [0, 'desc'], [1, 'asc']]


All of which come as iSortCol_# on the server side. But if I click on column B, I only get iSortCol_0 on the server side, with iSortingCols = 1. In this case what I really want is to have B shifted up front so the new sort is [[0, 'desc'], [2, 'asc'], [1, 'asc']].
I just know I'm probably missing some property somewhere :)
Anyone?
↧

captatablility with 1.9.0 and 1.9.4

July 4, 2013, 12:19 am
$
0
0
dear All,
i have been using data table v 1.9.0 and now i am moving to v1.9.4 everything works fine for all listpages
but one of my list page is designed in such way which calls web method on scroll .
at first page load it loads 10 records and when we scroll down then it calls webmethod with ajax call with pageindex as parameter so that again loads the next 10 records and converting in json on success method of ajax call and calling "fnAddData" method to add rows to datatable so calling webmethod on scroll works fine with v 1.9.0 but with v 1.9.4 it keep calling webmethod continuously.

calling webmethod on scroll works fine with v 1.9.0 but with v 1.9.4 it keeps calling webmethod continuously.
↧

How to show date in format "1370055600" to format "dd/mm/YYYY"

July 4, 2013, 6:11 am
$
0
0
Question about date format on datatable 1.9.

I have this "1370055600" from my database and i need this "01/01/2000" in the datatable, how can i do this?

My filter is ok, i just need to show it in format dd/mm/YYYY.

thanks
↧
Viewing all 1817 articles
Browse latest View live
Search