DWR addRows () with Element ID
Calling all DWR gurus!
I am currently using reverse Ajax to dynamically add data to a table in a web page.
When I run the following method:
public static void addRows(String tableBdId, String[][] data) {
Util dwrUtil = new Util(getSessionForPage()); // Get all page sessions
dwrUtil.addRows(tableBdId, data);
}
A new row is created as required in my web page.
However, in order to update these newly generated values later on, the tags must have an item ID to access.
I looked at the DWR javadoc and you can specify some additional options, see http://directwebremoting.org/dwr/browser/addRows but it doesn't make much sense to me, the documentation is very sparse.
If anyone can give me a clue as to how I can specify the item id for the created td items, I would be very grateful. Alternatively, if anyone knows of an alternative approach that I would like to know about.
Yours faithfully
Charles
a source to share
The closest I could get was passing some arguments to give the element an id. See below:
public static void addRows(String tableBdId, String[] data, String rowId) {
Util dwrUtil = new Util(getSessionForPage()); // Get all page sessions
// Create the options, which is needed to add a row ID
String options = "{" +
" rowCreator:function(options) {" +
" var row = document.createElement(\"tr\");" +
" row.setAttribute('id','" + rowId + "'); " +
" return row;" +
" }," +
" cellCreator:function(options) {" +
" var td = document.createElement(\"td\");" +
" return td;" +
" }," +
" escapeHtml:true\"}";
// Wrap the supplied row into an array to match the API
String[][] args1 = new String[][] { data };
dwrUtil.addRows(tableBdId, args1, options);
a source to share
Does this line of your code actually work?
The DWR addRows method requires at least 3 parameters 4 to work , they are:
- id : id of the table element (preferably the tbody element);
- array : an array (or object from DWR 1.1) containing one record for each row in the updated table;
- cellfuncs : an array of functions (one per column) to extract data from the passed string data;
- parameters : an object containing various parameters.
id , array and cellfuncs are required and in your case you will have to pass parameters also because you want to customize row creation and set TD id . check it out:
Inside the options argument, you need to use one parameter called "cellCreator" to tell you your own way to create the html td element. Check it:
// Use the cellFuncs var to set the values you want to display inside the table rows
// the syntax is object.property
// use one function(data) for each property you need to show on your table.
var cellFuncs = [
function(data) { return data.name_of_the_first_object_property ,
function(data) { return data.name_of_the_second_object_property; }
];
DWRUtil.addRows(
tableBdId,
data,
cellFuncs,
{
// This function is used for you customize the generated td element
cellCreator:function(options) {
var td = document.createElement("td");
// setting the td element id using the rowIndex
// just implement your own id bellow
td.id = options.rowIndex;
return td;
}
});
a source to share