Quantcast
Channel: DataTables 1.9 — DataTables forums
Viewing all articles
Browse latest Browse all 1816

wordpress + row details

$
0
0
Hi everyone,
I would like to ask you for help in an issue that I try to deal with. I've created a simple web portal for clients that are able to see data from database and details about them(using: https://datatables.net/release-datatables/examples/server_side/row_details.html example) It works great in browser: http://i.imgur.com/2lIxzXN.png with this code:
		<script type="text/javascript" charset="utf-8">
			var oTable;
			
			/* Formating function for row details */
			function fnFormatDetails ( nTr )
			{
				var aData = oTable.fnGetData( nTr );
				var sOut = '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">';
				sOut += '<tr><td>Book and Author:</td><td>'+aData[1]+' '+aData[2]+'</td></tr>';
				sOut += '<tr><td>Link to source:</td><td><a HREF="http://localhost:8080/DataTables-1.9.4/examples   /details_for_row.php?bookname='+aData[1]+'&lastname='+aData[2]+'">Show Details</a></td></tr>';
				sOut += '</table>';
				
				return sOut;
			}
			
			$(document).ready(function() {
				oTable = $('#BOOKS').dataTable( {
					"bProcessing": true,
					"bServerSide": true,
					"sAjaxSource": "function_retrieve_data_details_php_script.php",
      				"fnServerParams": function ( aoData ) {
            				aoData.push( { "name": "bookname", "value": "<?php echo $bookname ?>" } );
            				aoData.push( { "name": "lastname", "value": "<?php echo $lastname ?>" } );
            				aoData.push( { "name": "period", "value": "<?php echo $period ?>" } );
					},
					"aoColumns": [
						{ "sClass": "center", "bSortable": false },
						null,
						null,
						null,
						null,
					],
					"aaSorting": [[1, 'asc']]
				} );
				
				$('#BOOKS tbody td img').live( 'click', function () {
					var nTr = this.parentNode.parentNode;
					if ( this.src.match('details_close') )
					{
						/* This row is already open - close it */
						this.src = "examples_support/details_open.png";
						oTable.fnClose( nTr );
					}
					else
					{
						/* Open this row */
						this.src = "examples_support/details_close.png";
						oTable.fnOpen( nTr, fnFormatDetails(nTr), 'details' );
					}
				} );
			} );
		</script>
However when I insert it into wordpress I encounter problems: http://i.imgur.com/6hgxsS4.png I changed all paths and I think it should work. I noticed that I can show data at least when I remove this function from the code:
			/* Formating function for row details */
			function fnFormatDetails ( nTr )
			{
				var aData = oTable.fnGetData( nTr );
				var sOut = '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">';
				sOut += '<tr><td>Book and Author:</td><td>'+aData[1]+' '+aData[2]+'</td></tr>';
				sOut += '<tr><td>Link to source:</td><td><a HREF="http://localhost:8080/DataTables-1.9.4/examples/details_for_row.php?bookname='+aData[1]+'&lastname='+aData[2]+'">Show Details</a></td></tr>';
				sOut += '</table>';
				
				return sOut;
			}
But I don't have the functionality, it looks like this: http://i.imgur.com/PpNGOjs.png
I've spent a lot of time on this, I tried to change php plugins in wordpress etc, but nothing helped. Is there anybody who could come up with the solution?

Viewing all articles
Browse latest Browse all 1816

Latest Images

Trending Articles



Latest Images