Search

Hi, I have DataTables set up correctly and working with a hard-coded JSON source. However, in my real-life application I have to use a JSON feed which I can't control. This JSON feed has the following format: [ { "adminNotificationTypeId" : 11, "customerId" : 0, "dateTime" : "2014-05-15T20:16:00Z", "dateTimeClosed" : "0001-01-01T00:00:00" }, { "adminNotificationTypeId" : 7, "customerId" : 0, "dateTime" : "2014-05-06T11:31:00Z", "dateTimeClosed" : "0001-01-01T00:00:00" }, { "adminNotificationTypeId" : 7, "customerId" : 0, "dateTime" : "2014-05-06T11:31:00Z", "dateTimeClosed" : "0001-01-01T00:00:00" } ] DataTable doesn't seem to like this as it's missing the wrapping 'data' JSON object. I wondered if there's a way to get DataTables to consume this feed? Many thanks folks.

I think I have tried every combination of trying to change the column widths for my table. I would like less padding. I have commented out the /* width: 100%; */ in jquery.dataTables.css. Added "bAutoWidth": false. to the init, tried "sWidth": "10%",in the data sections of the the init. Is it possible to slightly change the column widths?

Hi, I tried to modify the '$('#form').submit( function()' in the example form.html to post submit the marked checkboxes to a database. http://live.datatables.net/qoteqif/2/edit How would it be properly made? As it is now, it works, but I can't show the text of the 'success: function()'. Of course I could use the 'alert' to show it... Thank you Joseph

I have this code: [code] function fnFormatDetails ( oTable, nTr ) { var aData = oTable.fnGetData( nTr ); $.post('php/clientes/clientes.php', {id:'details',ric:aData[2]} , function(respuesta) { console.log(respuesta); data = JSON.parse(respuesta); var sOut = '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">'; sOut += '<tr><td>Razón Social:</td><td>'+data[0]+'</td></tr>'; sOut += '<tr><td>CUIT:</td><td>'+data[1]+'</td></tr>'; sOut += '<tr><td>Dirección:</td><td>' + data[2] + ' ' + data[3] + ', ' + data[6] + ', ' + data[5] + ', ' + data[4] + '.</td></tr>'; sOut += '<tr><td>Codigo Postal:</td><td>'+data[7]+'</td></tr>'; sOut += '<tr><td>Coordenadas GPS:</td><td>Latitud (' + data[8] + ') - Longitud (' + data[9] + ')</td></tr>'; sOut += '</table>'; return sOut; }); } [/code] My problem is, when I press the button "More details" the fnFormatDetails function is call, into the console log I can see information send by my PHP but these extra details is not displayed in my HTML.

What is the best way how to modify row column content, e.g. add a button? Now I am doing it with: "fnRowCallback" : function(nRow, aData, iDisplayIndex, iDisplayIndexFull) { $('td:eq(0)', nRow).html(... $('td:eq(1)', nRow).html(... DataTables load is very slow when I use this way. Is there any better way? I want to be able to add some buttons, input and so on. I'm using "bProcessing" : true, "bDeferRender" : true. Thank you

redacted -- from forum searches, it appears that this is indeed by design

Hello world. Issue is I dynamically add content to a table and force the color using: $("#main_dash tbody tr:nth-child(" + index + ")").css("background-color", item['color']); This works great on the first page but is lost on any other pages. Please let me know what I can do. Code below: HTML: [code] Employee: <br/> Date Type Regarding Submitted By Review Assign [/code] JS: [code] var mainTable = $("#main_dash").dataTable({ "oLanguage": { "sEmptyTable": "There are currently no groom logs to be assigned.", }, "sPaginationType": "full_numbers", "iDisplayLength": 10, "aaSorting": [ [1, "asc"] ], }); $("#dash_view").autocomplete({ source: '/process/get_users.php', minLength: 2, select: function (event, ui) { var name = ui.item.value; var uid = ui.item.id; var query = "func=dash_view&uid=" + uid; ajaxRequest(query, function (data) { $("h3").text(name + "'s Dashboard"); mainTable.fnClearTable(0); mainTable.fnDraw(); data = $.parseJSON(data); $.each(data, function (i, item) { var index = mainTable.fnAddData([ item['flagged'], item['date'], item['type'], item['regarding'], item['submitted'], "<button class='button button-blue review_item'>Review</button>", '<span class="groom_id hidden">' + item['groom_id'] + '</span><input type="text" class="user_list"/>', ]); ++index; $("#main_dash tbody tr:nth-child(" + index + ")").css("background-color", item['color']); }); $("#dashboard_viewer").show("slide", { direction: "up" }, 1000); $(".user_list").autocomplete({ source: '/process/get_users_access.php', minLength: 2, select: function (event, ui) { var row = $(this).closest('tr')[0]; var groom = $(this).parent().children("span:first").text(); var name = ui.item.value; var aid = $("#aid").text(); mainTable.fnDeleteRow(row); var query = "func=assign_groom&groom_id=" + groom + "&name=" + name + "&aid=" + aid; ajaxRequest(query, function (data) { successMsg('Assigned groom ' + groom + ' to ' + name); }); } }); }); }, }); [/code]

[code]$.ajax({ type:'POST', data:$('#form-create').serialize(), [/code] [code] oTable = $('#datatables').dataTable({ "bJQueryUI": true, "sPaginationType": "full_numbers" }); [/code] This is sending only the other form data which are not datatables. I want to send the form data and datatables together for the submission. What is the best way to achieve this?

Hi. Today open my table on Chrome and see... http://radikal.ru/fp/30ec12745af84126898b3a2a9009d878 that width TH not equal width TD Opera, mozzila, IE: all nice!! Chrome: bag...

I am using jquery data table Fixed width pluggin with jax data source.First 4 columns are fixed.My requirement is that if there is no records in the DB,I wont show fixed width grid.It should be normal grid. I am assigning the total records in hidden field. But unfortunately it is not working when FixedColumns is called.plz help! "fnServerData": function (sSource, aoData, fnCallback) { aoData.push({ "name": "CompanyID", "value": MasterRecordID }); $.getJSON(sSource, aoData, function (json) { fnCallback(json) if (json != null) { document.getElementById("hdTot").value = json.iTotalDisplayRecords; if (json.iTotalDisplayRecords == 0) { alert('No Record Found'); } else { //$("#spGetAll").css('display', 'block') } } else { alert('Som problem occured'); } } ); } "fnInitComplete": function () { if (document.getElementById("hdTot").value == "0") { return; } else { new FixedColumns(oTable, { "iLeftColumns": 3, "iLeftWidth": 350 }); }