Replies

• allan Posts: 63,395Questions: 1Answers: 10,451 Site admin

  August 2012

  Hi Alex,
  
  I don't see anything obvious that is going to trip that up - it looks like it should work okay. Are you able to give us a link to the page so we can see what is happening please? Are you getting any script errors on the console?
  
  Allan
• dexity Posts: 3Questions: 0Answers: 0

  August 2012

  Hi, Allan.
  
  There is no error in the console. My guess will be be that the problem is because the source has kind of weird format: {"rows": "cell": [...]}. I tried to update the whole row with fnUpdate() using something like:
  
  [code]
  columns = [
  some_id,
  "Some URL",
  "Some title",
  "user1",
  "user2",
  "",
  "Some data",
  some_number,
  "Comment"
  ];
  oTable.fnUpdate(columns);
  [/code]
  But it will throw an error:
  
  [code]
  DataTables warning (table id = 'my_table'): Requested unknown parameter 'cell.2' from the data source for row 2
  [/code]
  
  I was able to get rid of this error by changing the columns structure:
  
  [code]
  columns = {"cell": [
  some_id,
  "Some URL",
  "Some title",
  "user1",
  "user2",
  "",
  "Some data",
  some_number,
  "Comment"
  ]};
  [/code]
  So may be the problem with sorting is because of the weird format?
• dexity Posts: 3Questions: 0Answers: 0

  August 2012 edited August 2012

  I solved this problem. In case someone will have similar issue I will describe the solution.
  
  To format cell I used "fnCreatedCell" callback. Instead I should have used "fnRender" callback. When I updated cell using fnUpdate() I passed link "Some Text" and it updated _aSortData array and set the full link instead of "Some Text". Clearly, "<" character is heigher in sorting order than "a" character and popped it up.
  
  So here is the updated working code:
  
  [code]
  oTable = $('#my_table').dataTable( {
  "sAjaxSource": ajax_url,
  "bDestroy": true,
  "sDom": "rt<'row'<'span3 padding_top_5'l><'span3'i><'span6'p>>",
  "sAjaxDataProp": "rows",
  "sPaginationType": "bootstrap",
  "oLanguage": {
  "sLengthMenu": "_MENU_ records per page"
  },
  "iDisplayLength": 25,
  "fnCreatedRow": function( nRow, aData, iDataIndex ) {
  // Row specific settings
  },
  "fnInitComplete": function(oSettings, json) {
  // Callback when table loading is complete
  },
  "aoColumns": [
  {"mDataProp": "cell.2"},
  {"mDataProp": "cell.3"},
  {"mDataProp": "cell.4"},
  {"mDataProp": "cell.5"},
  {"mDataProp": "cell.6"},
  {"mDataProp": "cell.7", "bSortable": false},
  {"mDataProp": "cell.8"},
  {"mDataProp": null, "sDefaultContent": "", "bSortable": false}
  ],
  // Format cells
  "aoColumnDefs": [ {
  "aTargets": [0],
  "fnRender": function (o, val) {
  return format_column_0();
  },
  "bUseRendered": false
  },
  {
  "aTargets": [1, 2],
  "fnRender": function (o, val) {
  return format_column_2();
  },
  "bUseRendered": false
  },
  {
  "aTargets": [4],
  "fnRender": function (o, val) {
  return format_column_4();
  },
  "bUseRendered": false
  },
  {
  "aTargets": [5],
  "fnRender": function (o, val) {
  return format_column_5();
  },
  "bUseRendered": false
  },
  {
  "aTargets": [7],
  "fnRender": function (o, val) {
  return format_column_7();
  },
  "bUseRendered": false
  }
  ]
  } );
  
  [/code]
  
  [code]
  function update_row(some_id)
  {
  $.get(ajax_url,
  function(data){
  if ("rows" in data && data["rows"].length > 0) {
  cell = data["rows"][0]["cell"];
  row = $("#"+some_id);
  rowPos = oTable.fnGetPosition(row[0]);
  
  oTable.fnUpdate(cell[2], rowPos, 0);
  oTable.fnUpdate(cell[3], rowPos, 1);
  oTable.fnUpdate(cell[4], rowPos, 2);
  oTable.fnUpdate(cell[5], rowPos, 3);
  oTable.fnUpdate(cell[6], rowPos, 4);
  oTable.fnUpdate(cell[8], rowPos, 6);
  }
  });
  }
  [/code]