Custom Widget in JSP with the Dojo (Ajax) and JSON

Wed, 08/29/2007 - 07:52 — Srivatsan

Hi,
Actually I am creating the table of data which is created through the response by the dojo (Ajax) request.I have seen the existing example which is using the php for the front end.
Instead of I have to use JSP for the front end.
I have the data ready with my Ajax request using JSON Object.

All I have to do is I have to create the customized Widget so that the data will be rendered in the table format provided the prev, next and etc., link for the page navigation.

Please tell me if any existing example in it or send me any documents.

Thanks and Regards,
R.Srivatsan.

Web Development

Wed, 08/29/2007 - 10:01 — Alex

Widget

Srivatsan,

I suspect there should not be difference in client part (Dojo Widget) except the URL you use to get the data.
You can replace ./data.php?page={page} in the following code:

(from http://www.alexatnet.com/node/14)
with something like ./yourfile.jsp?page={page}.

And then you need to create yourfile.jsp that returns the data in the way the example does:

{
	pages : 10,
	items : [
		// item #0
		{
			columns : [
				"Creating new Dojo Widget",
				"This tutorial demonstrates...",
				"Issued at ..."
			],
			fields : {
				id : 1,
				permalink : "http://www.alex..."
			}
		},
		// item #1
		...
	]
}

Sincerely,
Alex

Wed, 09/05/2007 - 13:58 — Srivatsan

Clarification

Thanks Alex for your reply.
I have the JSONArray object in page as data using following code in JSP.

var bindArgs = { url: "welcome.exampleAction", error: function(type, data, evt){alert(data);}, mimetype: "text/JSON", method: "POST", content: params }; var req = dojo.io.bind(bindArgs); dojo.event.connect(req, "load", this, "populateDoctorList"); }

function populateDoctorList(type, data, evt)
{
if (!data) {
alert("prob with data");
alert("data"+data);
} else {
alert("data is good");
}
}

This is working fine and get the JSONArray content data in alert statement.
Here I need to display the JSONArray content as a table will be having the previous and next button.
Each time the table should have 10 records.

How can I do this? Can I use the Custom widgets.
Please send me the code related to this Issue.
Please help me out in this regard.
Note:
Each time I am getting the data content in alert statement by flushing out the printwiter statement.
welcome.exampleAction will invoke the method in Action using Spring.This functionality is same as calling of welcome .jsp.
In this method only I am getting the String of the JSONarray object by using the jsonArrayObj.toString() method.

Fri, 09/07/2007 - 10:51 — Alex

You can use DataList widget

Hi.

I understand you are trying to get the data from the server user the dojo.io.bind.
So you can accomplish the task by either of the following ways:
1. Use the standard dojo data table. You can read more about it in dojo book at http://dojotoolkit.org/
2. Using my custom widget example (http://www.alexatnet.com/node/14).

Sincerely,
Alex

Alex @ Net