YUILibrary - Open source JavaScript and CSS for building richly interactive software.
Fork YUI on GitHub
  [ 2 posts ]

John

  • Username: JohnInGA
  • Joined: Thu Nov 26, 2009 6:06 am
  • Posts: 8
  • Offline
  • Profile

Correct way to remotely update a DataTable

Post Posted: Sat Nov 28, 2009 1:57 pm
+0-
Due to the way my applications is architected, I prefer to have the server-side controller refresh the DataTable (rather than have the DataSource initiate a request from the client end). When it responds to a request, the server updates several page elements, including the DataTable (whose prior contents are deleted). Because initiating requests from the client end seems to be the natural [i]way to do it with DataSource/DataTable, I prototyped the following:
1. Client sends request to controller
2. Controller retrieves & processes data from database, then updates several page elements (via Rails page.replace, etc) and finally executes a remote call to a Javascript funtion that, in turn calls, myDataSource.sendRequest()
3 Controller retrieves the new DataTable-related data from the database and sends JSON response to refresh the table (with a callback to .

Although this seemed to work fine, I wasn't happy with the 2 round trips to the server, and I prefer to keep all of the page-updating logic in one place (in the controller), so I really want it to work like this:
1. Client sends request to controller
2. Controller retrieves & processes data from database, then updates several page elements (via Rails page.replace, etc). At the same time, controller pushes updated data to the DataSource and DataTable.

Reading the YUI docs, and through some trial-and-error, I got it to work by remotely calling a Javascript function that: 1)initializes the table, 2)re-renders the datatable to get rid of the old rows, and then 3) adds the new rows with a call to DataTable.addRows(), sending a JSON string:

Client-side Javascript:
--------------------------------------------------
this.refreshTable = function(jStr) {
myDataTable.initializeTable();
myDataTable.render();
if (YAHOO.lang.JSON.isSafe(jStr)) {
myDataTable.addRows(eval(jStr));
}
}

I'm not a Javascript wizard, so the only way I knew of to get the JSON string into the object literal form that addRows() expects was to use eval(). This approach works fine, but I'm aware of the risks with using eval(), so I'd like to know if anyone has a better recommendation. Is wrapping it in the call to isSafe(), as above, ample protection from evil-doers?

Satyam

YUI Contributor

  • Username: Satyam
  • Joined: Tue Dec 09, 2008 12:34 am
  • Posts: 692
  • Location: Sitges, Spain
  • GitHub: Satyam
  • Gists: Satyam
  • YUI Developer
  • Offline
  • Profile

Re: Correct way to remotely update a DataTable

Post Posted: Sat Nov 28, 2009 2:41 pm
+0-
method parse will return a reference to the decoded JSON string, basically, the same as you do by calling isSafe and then eval.

You can get the DataSource to fetch the data, decode it, parse it and send it to the DataTable, there is no need for you to do each step separately, see:

http://www.satyam.com.ar/yui/2.6.0/requery.html
  [ 2 posts ]
Display posts from previous:  Sort by  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum