Replies

• allan Posts: 63,290Questions: 1Answers: 10,428 Site admin

  April 2012

  Is the #schedule table a DataTable as well? If so then this FAQ applies: http://datatables.net/faqs#append
  
  Beyond that, is your Ajax request getting the data you expect back from the server? Which page is it on the site you linked to that shows the tables?
  
  Allan
• energetic_pixels Posts: 9Questions: 0Answers: 0

  April 2012

  Allan,
  
  Ok, this project is not working with an 'active' application server i.e., ASP/PHP. All I have is a .json file stored on the web server.
  Yes, #schedule is a DataTable too. But I am calling that after I have added my table rows to the DOM through a jQuery .append function.
  The user route (click functions) would be from the main web page. Click on any of the Course Catalog menu items -> Click 'next' to get to second page of table data -> Select "Ammo-29 Electrical Explosives Safety for Naval Facilities" row. On that resulting page, I am trying to display the scheduling data to a site user (#schedule).
  According to the FAQs/DOCs, I should not have to mess with any fnAddData or fnUpdate since I am building the DOM before the #schedule datatable is initialized. Should I??
  
  I have uploaded a fresh copy to my testing site that has some console.log installed in it. From that log, I know that datatable() is selecting the right data as far as row data goes.
  
  Since my testing site location is not the final resting place for the application, you can take a peek at my two files in question (besides the exerpt from the .json listed above):
  http://www.serco-hrc.com/crseCatalog/crseCatalog.html -- this has the .datatable for the course catalog listing and also manipulation for the follow-on table in Ammo-29.
  http://www.serco-hrc.com/crseCatalog/catalog/ammo-29.html -- this is where the #schedule datatable is.
  
  
  Tony
• allan Posts: 63,290Questions: 1Answers: 10,428 Site admin

  April 2012

  > According to the FAQs/DOCs, I should not have to mess with any fnAddData or fnUpdate since I am building the DOM before the #schedule datatable is initialized. Should I??
  
  You are absolutely correct - if you are initialising your DataTable after you've set up the HTML, then this method is fine.
  
  > http://www.serco-hrc.com/crseCatalog/crseCatalog.html
  
  404 I'm afraid :-)
  
  So the crseCatalog.html page should have two tables on it - is that correct? One which is dynamically created? Or is it building the second page?
  
  Allan
• energetic_pixels Posts: 9Questions: 0Answers: 0

  April 2012

  no. ('#catList').dataTable() is the only table on the crseCatalog.html page. The .dataTable() function on this page is also used to build the table rows (via adding to the dom) on the second page (ammo-29.html).
  
  Once a user clicks on a row from #catList, it .loads in the appropriate html fragment into a hidden div within index.html (main site wrapper). Then, I add table rows to this loaded html fragment via the .load's callback function. If I change the tr build callback function so that it has static td information [code]"This is dummy information<\/td>This is dummy information<\/td>This is dummy information<\/td><\/tr>"[/code], I get the appropriate display when the table is shown to the user. My problem comes in when I try to use data contained in the .fnGetData function to . My format would look like [code]"" + startDate + "<\/td>" + endDate + "<\/td><\/tr>"[/code]
  
  It looks to me as if I am not referencing/targeting the data correctly. Any pointers or NCIS "Denozo slaps" would greatly be appreciated.
  
  Tony
• energetic_pixels Posts: 9Questions: 0Answers: 0

  April 2012

  Allan,
  
  Think I hit on something. I believe that it is a jQuery targeting problem. I changed my code a little and actually got text back in the console.log. I changed it to read "console.log( aData.sked[0].classNumb );". I actually got '926' being reported back to the console. The change is the "[0]" added to sked. But how do I get the script to loop through the object children of aData.sked??
  
  Please excuse my noobie dumbness, I am usually a flash/away3d animator. I got swindled into this current project due manpower shortages in my day job. I picked your .dataTable application cuz it has lots of options and is themeroller capable (right out of the box). I can see a lot of future implementations, if I can just get my head wrapped around it.
  
  Tony
• allan Posts: 63,290Questions: 1Answers: 10,428 Site admin

  April 2012

  Hi Tony,
  
  > I am usually a flash/away3d animator
  
  Ah! AS3 by any chance? :-). I think that explains why you expected your code to work - it would do in AS3, but not in Javascript. In AS3 functions execute using something like "with(this)", so you can access the properties of the scope without using the this keyword. For example:
  
  [code]
  // JS
  this.hello
  
  // AS3
  hello
  [/code]
  
  Assuming I'm right - what to do is to adjust the code so that it works in Javascript land:
  
  [code]
  $(scheduleData).each(function(i) {
  var html = "";
  html += "" + scheduleData[i].classNumb + "<\/td>";
  html += "<\/tr>"
  $('#schedule tbody').append($(html));
  });
  [/code]
  
  I've added 'i' to the each anon function parameters list to get the index and an array index in for scheduleData.
  
  This would also be the same and is a bit more AS3 like:
  
  [code]
  $(scheduleData).each(function() {
  var html = "";
  html += "" + this.classNumb + "<\/td>";
  html += "<\/tr>"
  $('#schedule tbody').append($(html));
  });
  [/code]
  
  I really love a lot about AS3, but with(this) is one thing I'm not too sure about... :-)
  
  Allan