You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by Pen <du...@yahoo.com> on 2007/11/24 08:34:58 UTC

howto JSON Wicket works?

Greetings,

I want to know how to handle the Jquery, JSon data in the wicket. What is
the best way to do it.
I have created simple form which sends the json data across to server and
replies back to the form.
I am not sure how to handle the request and response in wicket. I am using
Json-lib 2.1 for jdk1.5
Can anybody analyze the below program and suggest me what is wrong.

demo.html
<head>
	<script src="scripts/jquery-1.2.1.js" type="text/javascript"
charset="utf-8"></script>	
	<script type="text/javascript" charset="utf-8">
		$(document).ready(function() {
			$("#testForm").submit(sendForm);
		});
		
		function sendForm(e) {
			e.preventDefault();
			var data = {
				field1: $("#field1").val(),
				field2: $("#field2").val(),
				field3: $("#field3").val(),
			};
			
			$("#sent .content").html(data.toSource());
			$.post("demo", "message=[" + data.toSource() + "];", receiveForm,
"json");
		};		
	
	         function receiveForm(data) {
			$("#field1").val(data.field1);
			$("#field2").val(data.field2);
			$("#field3").val(data.field3);
			
			$("#received .content").html(data.toSource());
		};
	</script>
	
</head>
<body>

<form wicket:id="testForm"  >
	<h1 id="form">Form</h1>
	
	<label for="field1">Field One:</label>
	<input type="text" id="field1" />
	
	<label for="field2">Field Two:</label>
	<input type="text" id="field2" />
	
	<label for="field3">Field Three:</label>
	<input type="text" id="field3" />
	
	<input type="submit" id="submitter" value="Post the data" />
</form>

<div id="sent" class="readout">
	<h1 id="sent_data:">Sent Data:</h1>
	<div class="content">
		
	</div>
</div>
<div id="received" class="readout">

	<h1 id="received_data">Received Data:</h1>
	<div class="content">
		
	</div>
</div>
</body>
</html>

Here is the wicket program to handle this 

demo.java
public class Demo extends BasePage {
	public Demo() {
		
		Form form = new Form("testForm",new CompoundPropertyModel(this));
		add(form);
		form.add(new AjaxFormSubmitBehavior(form,"onsubmit"){
			private static final long serialVersionUID = 1L;			

			protected void onSubmit(AjaxRequestTarget target) {
				Request request = getRequest();
				String data = request.getParameter("data");			
				try {
					JSONObject jsonData = new JSONObject();
					JSONObject selectedNode = jsonData.getJSONObject(data);					
				} catch (Exception e) {
					throw new RuntimeException("Failed to parse selected node from reply: "
+ data);
				} 
				//target.addComponent(received)// Add to the response data
			}
		});
	}
}


~Pen
-- 
View this message in context: http://www.nabble.com/howto-JSON-Wicket-works--tf4865188.html#a13922782
Sent from the Wicket - User mailing list archive at Nabble.com.


---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: howto JSON Wicket works?

Posted by Alex Objelean <al...@isdc.ro>.
When form is submitted, wicket performs a request which looks something like
this:
"?wicket:interface=:0:body:panel:IFormSubmitListener::". This ensures that
the onSubmit method is called. But what you did with your example, is wrong,
because your request is not a normal wicket request:
$.post("demo", "message=[" + data.toSource() + "];", receiveForm, "json");
That is why, your onSubmit method will never be called.

I don't understand, why are you trying to do something simple, in such a
complicated way. I recommend you, to have a look at examples in order to
learn thinking in wicket way and understand basic principles.

Alex.



Pen wrote:
> 
> Greetings,
> 
> I want to know how to handle the Jquery, JSon data in the wicket. What is
> the best way to do it.
> I have created simple form which sends the json data across to server and
> replies back to the form.
> I am not sure how to handle the request and response in wicket. I am using
> Json-lib 2.1 for jdk1.5
> Can anybody analyze the below program and suggest me what is wrong.
> 
> demo.html
> <head>
> 	<script src="scripts/jquery-1.2.1.js" type="text/javascript"
> charset="utf-8"></script>	
> 	<script type="text/javascript" charset="utf-8">
> 		$(document).ready(function() {
> 			$("#testForm").submit(sendForm);
> 		});
> 		
> 		function sendForm(e) {
> 			e.preventDefault();
> 			var data = {
> 				field1: $("#field1").val(),
> 				field2: $("#field2").val(),
> 				field3: $("#field3").val(),
> 			};
> 			
> 			$("#sent .content").html(data.toSource());
> 			$.post("demo", "message=[" + data.toSource() + "];", receiveForm,
> "json");
> 		};		
> 	
> 	         function receiveForm(data) {
> 			$("#field1").val(data.field1);
> 			$("#field2").val(data.field2);
> 			$("#field3").val(data.field3);
> 			
> 			$("#received .content").html(data.toSource());
> 		};
> 	</script>
> 	
> </head>
> <body>
> 
> <form wicket:id="testForm"  >
> 	<h1 id="form">Form</h1>
> 	
> 	<label for="field1">Field One:</label>
> 	<input type="text" id="field1" />
> 	
> 	<label for="field2">Field Two:</label>
> 	<input type="text" id="field2" />
> 	
> 	<label for="field3">Field Three:</label>
> 	<input type="text" id="field3" />
> 	
> 	<input type="submit" id="submitter" value="Post the data" />
> </form>
> 
> <div id="sent" class="readout">
> 	<h1 id="sent_data:">Sent Data:</h1>
> 	<div class="content">
> 		
> 	</div>
> </div>
> <div id="received" class="readout">
> 
> 	<h1 id="received_data">Received Data:</h1>
> 	<div class="content">
> 		
> 	</div>
> </div>
> </body>
> </html>
> 
> Here is the wicket program to handle this 
> 
> demo.java
> public class Demo extends BasePage {
> 	public Demo() {
> 		
> 		Form form = new Form("testForm",new CompoundPropertyModel(this));
> 		add(form);
> 		form.add(new AjaxFormSubmitBehavior(form,"onsubmit"){
> 			private static final long serialVersionUID = 1L;			
> 
> 			protected void onSubmit(AjaxRequestTarget target) {
> 				Request request = getRequest();
> 				String data = request.getParameter("data");			
> 				try {
> 					JSONObject jsonData = new JSONObject();
> 					JSONObject selectedNode = jsonData.getJSONObject(data);					
> 				} catch (Exception e) {
> 					throw new RuntimeException("Failed to parse selected node from reply:
> " + data);
> 				} 
> 				//target.addComponent(received)// Add to the response data
> 			}
> 		});
> 	}
> }
> 
> 
> ~Pen
> 

-- 
View this message in context: http://www.nabble.com/howto-JSON-Wicket-works--tf4865188.html#a13967492
Sent from the Wicket - User mailing list archive at Nabble.com.


---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: howto JSON Wicket works?

Posted by Martijn Dashorst <ma...@gmail.com>.
Please look in the wicket examples to learn about Ajax forms in Wicket. You
can also look at the example online:
http://wicketstuff.org/wicket13/ajax/form.1

(sourcecode browser is in the top right corner)

Martijn


On Nov 27, 2007 8:39 AM, Pen <du...@yahoo.com> wrote:

>
>
> I am not really understanding your question? we are not creating any json
> object in browser. I believe that 's what we want to do in the normal form
> submit create the json object.
> This is just a simple example to demonstrate the Ajax round trip. Here
> bascially you get the updated data back. This can happen if we have form
> submit and a grid which gets updated on the form submit.
>
> Can you please look into the below example and provide some solution. I
> have
> copied both the html and java code. If you can tell me how to handle the
> data in wicket and send it back in the below example that would be great.
> I
> am not receving the form post data in the request object in wicket.
>
> Thanks
> ~Pen
>
>
> Johan Compagner wrote:
> >
> > Again, why do you try to generate a json object in the browser??
> > Why not create a normal wicket form that you post to the server and
> > then in the form submit method you create the json object
> >
> > On 11/24/07, Pen <du...@yahoo.com> wrote:
> >>
> >>
> >> I don't know how to get the postdata from the request object in wicket.
> I
> >> do
> >> see the request being sent. As you see from the example I am struck
> >> there, I
> >> don't know how to proceed further.
> >> This is just a basic example of round trip using Json, AJax and wicket
> >> through form submit. You get the Json data modify it update back the
> >> form.
> >> There will be more complicated of this like grid update.
> >> Also there can be normal form submit of Json object. In either case I
> >> don't
> >> know how to handle on the server in wicket. I have done lot using JSP,
> it
> >> looks bit different here. And no good documentation.
> >> If you can provide some coding example or some pointer it would be
> great.
> >>
> >> ~Pen
> >>
> >>
> >>
> >>
> >>
> >> Johan Compagner wrote:
> >> >
> >> > Which part goes wrong?
> >> > Do you see the request being send?
> >> > Why do this though json? If you need json objects on the server why
> >> > not using  a normal form post and create the json object on the
> >> > server?
> >> >
> >> > 2007/11/24, Pen <du...@yahoo.com>:
> >> >>
> >> >> Greetings,
> >> >>
> >> >> I want to know how to handle the Jquery, JSon data in the wicket.
> What
> >> is
> >> >> the best way to do it.
> >> >> I have created simple form which sends the json data across to
> server
> >> and
> >> >> replies back to the form.
> >> >> I am not sure how to handle the request and response in wicket. I am
> >> >> using
> >> >> Json-lib 2.1 for jdk1.5
> >> >> Can anybody analyze the below program and suggest me what is wrong.
> >> >>
> >> >> demo.html
> >> >> <head>
> >> >>   <script src="scripts/jquery-1.2.1.js" type="text/javascript"
> >> >> charset="utf-8"></script>
> >> >>   <script type="text/javascript" charset="utf-8">
> >> >>           $(document).ready(function() {
> >> >>                   $("#testForm").submit(sendForm);
> >> >>           });
> >> >>
> >> >>           function sendForm(e) {
> >> >>                   e.preventDefault();
> >> >>                   var data = {
> >> >>                           field1: $("#field1").val(),
> >> >>                           field2: $("#field2").val(),
> >> >>                           field3: $("#field3").val(),
> >> >>                   };
> >> >>
> >> >>                   $("#sent .content").html(data.toSource());
> >> >>                   $.post("demo", "message=[" + data.toSource() +
> "];", receiveForm,
> >> >> "json");
> >> >>           };
> >> >>
> >> >>            function receiveForm(data) {
> >> >>                   $("#field1").val(data.field1);
> >> >>                   $("#field2").val(data.field2);
> >> >>                   $("#field3").val(data.field3);
> >> >>
> >> >>                   $("#received .content").html(data.toSource());
> >> >>           };
> >> >>   </script>
> >> >>
> >> >> </head>
> >> >> <body>
> >> >>
> >> >> <form wicket:id="testForm"  >
> >> >>   <h1 id="form">Form</h1>
> >> >>
> >> >>   <label for="field1">Field One:</label>
> >> >>   <input type="text" id="field1" />
> >> >>
> >> >>   <label for="field2">Field Two:</label>
> >> >>   <input type="text" id="field2" />
> >> >>
> >> >>   <label for="field3">Field Three:</label>
> >> >>   <input type="text" id="field3" />
> >> >>
> >> >>   <input type="submit" id="submitter" value="Post the data" />
> >> >> </form>
> >> >>
> >> >> <div id="sent" class="readout">
> >> >>   <h1 id="sent_data:">Sent Data:</h1>
> >> >>   <div class="content">
> >> >>
> >> >>   </div>
> >> >> </div>
> >> >> <div id="received" class="readout">
> >> >>
> >> >>   <h1 id="received_data">Received Data:</h1>
> >> >>   <div class="content">
> >> >>
> >> >>   </div>
> >> >> </div>
> >> >> </body>
> >> >> </html>
> >> >>
> >> >> Here is the wicket program to handle this
> >> >>
> >> >> demo.java
> >> >> public class Demo extends BasePage {
> >> >>   public Demo() {
> >> >>
> >> >>           Form form = new Form("testForm",new
> CompoundPropertyModel(this));
> >> >>           add(form);
> >> >>           form.add(new AjaxFormSubmitBehavior(form,"onsubmit"){
> >> >>                   private static final long serialVersionUID = 1L;
> >> >>
> >> >>                   protected void onSubmit(AjaxRequestTarget target)
> {
> >> >>                           Request request = getRequest();
> >> >>                           String data = request.getParameter
> ("data");
> >> >>                           try {
> >> >>                                   JSONObject jsonData = new
> JSONObject();
> >> >>                                   JSONObject selectedNode =
> jsonData.getJSONObject(data);
> >> >>                           } catch (Exception e) {
> >> >>                                   throw new RuntimeException("Failed
> to parse selected node from
> >> >> reply: "
> >> >> + data);
> >> >>                           }
> >> >>                           //target.addComponent(received)// Add to
> the response data
> >> >>                   }
> >> >>           });
> >> >>   }
> >> >> }
> >> >>
> >> >>
> >> >> ~Pen
> >> >> --
> >> >> View this message in context:
> >> >>
> >> http://www.nabble.com/howto-JSON-Wicket-works--tf4865188.html#a13922782
> >> >> Sent from the Wicket - User mailing list archive at Nabble.com.
> >> >>
> >> >>
> >> >>
> ---------------------------------------------------------------------
> >> >> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> >> >> For additional commands, e-mail: users-help@wicket.apache.org
> >> >>
> >> >>
> >> >
> >> > ---------------------------------------------------------------------
> >> > To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> >> > For additional commands, e-mail: users-help@wicket.apache.org
> >> >
> >> >
> >> >
> >>
> >> --
> >> View this message in context:
> >> http://www.nabble.com/howto-JSON-Wicket-works--tf4865188.html#a13928701
> >> Sent from the Wicket - User mailing list archive at Nabble.com.
> >>
> >>
> >> ---------------------------------------------------------------------
> >> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> >> For additional commands, e-mail: users-help@wicket.apache.org
> >>
> >>
> >
> > ---------------------------------------------------------------------
> > To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> > For additional commands, e-mail: users-help@wicket.apache.org
> >
> >
> >
>
> --
> View this message in context:
> http://www.nabble.com/howto-JSON-Wicket-works--tf4865188.html#a13966013
> Sent from the Wicket - User mailing list archive at Nabble.com.
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>


-- 
Buy Wicket in Action: http://manning.com/dashorst
Apache Wicket 1.3.0-rc1 is released
Get it now: http://www.apache.org/dyn/closer.cgi/wicket/1.3.0-rc1/

Re: howto JSON Wicket works?

Posted by Pen <du...@yahoo.com>.

I am not really understanding your question? we are not creating any json
object in browser. I believe that 's what we want to do in the normal form 
submit create the json object. 
This is just a simple example to demonstrate the Ajax round trip. Here
bascially you get the updated data back. This can happen if we have form
submit and a grid which gets updated on the form submit.

Can you please look into the below example and provide some solution. I have
copied both the html and java code. If you can tell me how to handle the
data in wicket and send it back in the below example that would be great. I
am not receving the form post data in the request object in wicket.

Thanks
~Pen


Johan Compagner wrote:
> 
> Again, why do you try to generate a json object in the browser??
> Why not create a normal wicket form that you post to the server and
> then in the form submit method you create the json object
> 
> On 11/24/07, Pen <du...@yahoo.com> wrote:
>>
>>
>> I don't know how to get the postdata from the request object in wicket. I
>> do
>> see the request being sent. As you see from the example I am struck
>> there, I
>> don't know how to proceed further.
>> This is just a basic example of round trip using Json, AJax and wicket
>> through form submit. You get the Json data modify it update back the
>> form.
>> There will be more complicated of this like grid update.
>> Also there can be normal form submit of Json object. In either case I
>> don't
>> know how to handle on the server in wicket. I have done lot using JSP, it
>> looks bit different here. And no good documentation.
>> If you can provide some coding example or some pointer it would be great.
>>
>> ~Pen
>>
>>
>>
>>
>>
>> Johan Compagner wrote:
>> >
>> > Which part goes wrong?
>> > Do you see the request being send?
>> > Why do this though json? If you need json objects on the server why
>> > not using  a normal form post and create the json object on the
>> > server?
>> >
>> > 2007/11/24, Pen <du...@yahoo.com>:
>> >>
>> >> Greetings,
>> >>
>> >> I want to know how to handle the Jquery, JSon data in the wicket. What
>> is
>> >> the best way to do it.
>> >> I have created simple form which sends the json data across to server
>> and
>> >> replies back to the form.
>> >> I am not sure how to handle the request and response in wicket. I am
>> >> using
>> >> Json-lib 2.1 for jdk1.5
>> >> Can anybody analyze the below program and suggest me what is wrong.
>> >>
>> >> demo.html
>> >> <head>
>> >> 	<script src="scripts/jquery-1.2.1.js" type="text/javascript"
>> >> charset="utf-8"></script>	
>> >> 	<script type="text/javascript" charset="utf-8">
>> >> 		$(document).ready(function() {
>> >> 			$("#testForm").submit(sendForm);
>> >> 		});
>> >> 		
>> >> 		function sendForm(e) {
>> >> 			e.preventDefault();
>> >> 			var data = {
>> >> 				field1: $("#field1").val(),
>> >> 				field2: $("#field2").val(),
>> >> 				field3: $("#field3").val(),
>> >> 			};
>> >> 			
>> >> 			$("#sent .content").html(data.toSource());
>> >> 			$.post("demo", "message=[" + data.toSource() + "];", receiveForm,
>> >> "json");
>> >> 		};		
>> >> 	
>> >> 	         function receiveForm(data) {
>> >> 			$("#field1").val(data.field1);
>> >> 			$("#field2").val(data.field2);
>> >> 			$("#field3").val(data.field3);
>> >> 			
>> >> 			$("#received .content").html(data.toSource());
>> >> 		};
>> >> 	</script>
>> >> 	
>> >> </head>
>> >> <body>
>> >>
>> >> <form wicket:id="testForm"  >
>> >> 	<h1 id="form">Form</h1>
>> >> 	
>> >> 	<label for="field1">Field One:</label>
>> >> 	<input type="text" id="field1" />
>> >> 	
>> >> 	<label for="field2">Field Two:</label>
>> >> 	<input type="text" id="field2" />
>> >> 	
>> >> 	<label for="field3">Field Three:</label>
>> >> 	<input type="text" id="field3" />
>> >> 	
>> >> 	<input type="submit" id="submitter" value="Post the data" />
>> >> </form>
>> >>
>> >> <div id="sent" class="readout">
>> >> 	<h1 id="sent_data:">Sent Data:</h1>
>> >> 	<div class="content">
>> >> 		
>> >> 	</div>
>> >> </div>
>> >> <div id="received" class="readout">
>> >>
>> >> 	<h1 id="received_data">Received Data:</h1>
>> >> 	<div class="content">
>> >> 		
>> >> 	</div>
>> >> </div>
>> >> </body>
>> >> </html>
>> >>
>> >> Here is the wicket program to handle this
>> >>
>> >> demo.java
>> >> public class Demo extends BasePage {
>> >> 	public Demo() {
>> >> 		
>> >> 		Form form = new Form("testForm",new CompoundPropertyModel(this));
>> >> 		add(form);
>> >> 		form.add(new AjaxFormSubmitBehavior(form,"onsubmit"){
>> >> 			private static final long serialVersionUID = 1L;			
>> >>
>> >> 			protected void onSubmit(AjaxRequestTarget target) {
>> >> 				Request request = getRequest();
>> >> 				String data = request.getParameter("data");			
>> >> 				try {
>> >> 					JSONObject jsonData = new JSONObject();
>> >> 					JSONObject selectedNode = jsonData.getJSONObject(data);					
>> >> 				} catch (Exception e) {
>> >> 					throw new RuntimeException("Failed to parse selected node from
>> >> reply: "
>> >> + data);
>> >> 				}
>> >> 				//target.addComponent(received)// Add to the response data
>> >> 			}
>> >> 		});
>> >> 	}
>> >> }
>> >>
>> >>
>> >> ~Pen
>> >> --
>> >> View this message in context:
>> >>
>> http://www.nabble.com/howto-JSON-Wicket-works--tf4865188.html#a13922782
>> >> Sent from the Wicket - User mailing list archive at Nabble.com.
>> >>
>> >>
>> >> ---------------------------------------------------------------------
>> >> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
>> >> For additional commands, e-mail: users-help@wicket.apache.org
>> >>
>> >>
>> >
>> > ---------------------------------------------------------------------
>> > To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
>> > For additional commands, e-mail: users-help@wicket.apache.org
>> >
>> >
>> >
>>
>> --
>> View this message in context:
>> http://www.nabble.com/howto-JSON-Wicket-works--tf4865188.html#a13928701
>> Sent from the Wicket - User mailing list archive at Nabble.com.
>>
>>
>> ---------------------------------------------------------------------
>> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
>> For additional commands, e-mail: users-help@wicket.apache.org
>>
>>
> 
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
> 
> 
> 

-- 
View this message in context: http://www.nabble.com/howto-JSON-Wicket-works--tf4865188.html#a13966013
Sent from the Wicket - User mailing list archive at Nabble.com.


---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: howto JSON Wicket works?

Posted by Johan Compagner <jc...@gmail.com>.
Again, why do you try to generate a json object in the browser??
Why not create a normal wicket form that you post to the server and
then in the form submit method you create the json object

On 11/24/07, Pen <du...@yahoo.com> wrote:
>
>
> I don't know how to get the postdata from the request object in wicket. I do
> see the request being sent. As you see from the example I am struck there, I
> don't know how to proceed further.
> This is just a basic example of round trip using Json, AJax and wicket
> through form submit. You get the Json data modify it update back the form.
> There will be more complicated of this like grid update.
> Also there can be normal form submit of Json object. In either case I don't
> know how to handle on the server in wicket. I have done lot using JSP, it
> looks bit different here. And no good documentation.
> If you can provide some coding example or some pointer it would be great.
>
> ~Pen
>
>
>
>
>
> Johan Compagner wrote:
> >
> > Which part goes wrong?
> > Do you see the request being send?
> > Why do this though json? If you need json objects on the server why
> > not using  a normal form post and create the json object on the
> > server?
> >
> > 2007/11/24, Pen <du...@yahoo.com>:
> >>
> >> Greetings,
> >>
> >> I want to know how to handle the Jquery, JSon data in the wicket. What is
> >> the best way to do it.
> >> I have created simple form which sends the json data across to server and
> >> replies back to the form.
> >> I am not sure how to handle the request and response in wicket. I am
> >> using
> >> Json-lib 2.1 for jdk1.5
> >> Can anybody analyze the below program and suggest me what is wrong.
> >>
> >> demo.html
> >> <head>
> >> 	<script src="scripts/jquery-1.2.1.js" type="text/javascript"
> >> charset="utf-8"></script>	
> >> 	<script type="text/javascript" charset="utf-8">
> >> 		$(document).ready(function() {
> >> 			$("#testForm").submit(sendForm);
> >> 		});
> >> 		
> >> 		function sendForm(e) {
> >> 			e.preventDefault();
> >> 			var data = {
> >> 				field1: $("#field1").val(),
> >> 				field2: $("#field2").val(),
> >> 				field3: $("#field3").val(),
> >> 			};
> >> 			
> >> 			$("#sent .content").html(data.toSource());
> >> 			$.post("demo", "message=[" + data.toSource() + "];", receiveForm,
> >> "json");
> >> 		};		
> >> 	
> >> 	         function receiveForm(data) {
> >> 			$("#field1").val(data.field1);
> >> 			$("#field2").val(data.field2);
> >> 			$("#field3").val(data.field3);
> >> 			
> >> 			$("#received .content").html(data.toSource());
> >> 		};
> >> 	</script>
> >> 	
> >> </head>
> >> <body>
> >>
> >> <form wicket:id="testForm"  >
> >> 	<h1 id="form">Form</h1>
> >> 	
> >> 	<label for="field1">Field One:</label>
> >> 	<input type="text" id="field1" />
> >> 	
> >> 	<label for="field2">Field Two:</label>
> >> 	<input type="text" id="field2" />
> >> 	
> >> 	<label for="field3">Field Three:</label>
> >> 	<input type="text" id="field3" />
> >> 	
> >> 	<input type="submit" id="submitter" value="Post the data" />
> >> </form>
> >>
> >> <div id="sent" class="readout">
> >> 	<h1 id="sent_data:">Sent Data:</h1>
> >> 	<div class="content">
> >> 		
> >> 	</div>
> >> </div>
> >> <div id="received" class="readout">
> >>
> >> 	<h1 id="received_data">Received Data:</h1>
> >> 	<div class="content">
> >> 		
> >> 	</div>
> >> </div>
> >> </body>
> >> </html>
> >>
> >> Here is the wicket program to handle this
> >>
> >> demo.java
> >> public class Demo extends BasePage {
> >> 	public Demo() {
> >> 		
> >> 		Form form = new Form("testForm",new CompoundPropertyModel(this));
> >> 		add(form);
> >> 		form.add(new AjaxFormSubmitBehavior(form,"onsubmit"){
> >> 			private static final long serialVersionUID = 1L;			
> >>
> >> 			protected void onSubmit(AjaxRequestTarget target) {
> >> 				Request request = getRequest();
> >> 				String data = request.getParameter("data");			
> >> 				try {
> >> 					JSONObject jsonData = new JSONObject();
> >> 					JSONObject selectedNode = jsonData.getJSONObject(data);					
> >> 				} catch (Exception e) {
> >> 					throw new RuntimeException("Failed to parse selected node from
> >> reply: "
> >> + data);
> >> 				}
> >> 				//target.addComponent(received)// Add to the response data
> >> 			}
> >> 		});
> >> 	}
> >> }
> >>
> >>
> >> ~Pen
> >> --
> >> View this message in context:
> >> http://www.nabble.com/howto-JSON-Wicket-works--tf4865188.html#a13922782
> >> Sent from the Wicket - User mailing list archive at Nabble.com.
> >>
> >>
> >> ---------------------------------------------------------------------
> >> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> >> For additional commands, e-mail: users-help@wicket.apache.org
> >>
> >>
> >
> > ---------------------------------------------------------------------
> > To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> > For additional commands, e-mail: users-help@wicket.apache.org
> >
> >
> >
>
> --
> View this message in context:
> http://www.nabble.com/howto-JSON-Wicket-works--tf4865188.html#a13928701
> Sent from the Wicket - User mailing list archive at Nabble.com.
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: howto JSON Wicket works?

Posted by Pen <du...@yahoo.com>.

I don't know how to get the postdata from the request object in wicket. I do
see the request being sent. As you see from the example I am struck there, I
don't know how to proceed further. 
This is just a basic example of round trip using Json, AJax and wicket
through form submit. You get the Json data modify it update back the form.
There will be more complicated of this like grid update.
Also there can be normal form submit of Json object. In either case I don't
know how to handle on the server in wicket. I have done lot using JSP, it
looks bit different here. And no good documentation.
If you can provide some coding example or some pointer it would be great.

~Pen





Johan Compagner wrote:
> 
> Which part goes wrong?
> Do you see the request being send?
> Why do this though json? If you need json objects on the server why
> not using  a normal form post and create the json object on the
> server?
> 
> 2007/11/24, Pen <du...@yahoo.com>:
>>
>> Greetings,
>>
>> I want to know how to handle the Jquery, JSon data in the wicket. What is
>> the best way to do it.
>> I have created simple form which sends the json data across to server and
>> replies back to the form.
>> I am not sure how to handle the request and response in wicket. I am
>> using
>> Json-lib 2.1 for jdk1.5
>> Can anybody analyze the below program and suggest me what is wrong.
>>
>> demo.html
>> <head>
>> 	<script src="scripts/jquery-1.2.1.js" type="text/javascript"
>> charset="utf-8"></script>	
>> 	<script type="text/javascript" charset="utf-8">
>> 		$(document).ready(function() {
>> 			$("#testForm").submit(sendForm);
>> 		});
>> 		
>> 		function sendForm(e) {
>> 			e.preventDefault();
>> 			var data = {
>> 				field1: $("#field1").val(),
>> 				field2: $("#field2").val(),
>> 				field3: $("#field3").val(),
>> 			};
>> 			
>> 			$("#sent .content").html(data.toSource());
>> 			$.post("demo", "message=[" + data.toSource() + "];", receiveForm,
>> "json");
>> 		};		
>> 	
>> 	         function receiveForm(data) {
>> 			$("#field1").val(data.field1);
>> 			$("#field2").val(data.field2);
>> 			$("#field3").val(data.field3);
>> 			
>> 			$("#received .content").html(data.toSource());
>> 		};
>> 	</script>
>> 	
>> </head>
>> <body>
>>
>> <form wicket:id="testForm"  >
>> 	<h1 id="form">Form</h1>
>> 	
>> 	<label for="field1">Field One:</label>
>> 	<input type="text" id="field1" />
>> 	
>> 	<label for="field2">Field Two:</label>
>> 	<input type="text" id="field2" />
>> 	
>> 	<label for="field3">Field Three:</label>
>> 	<input type="text" id="field3" />
>> 	
>> 	<input type="submit" id="submitter" value="Post the data" />
>> </form>
>>
>> <div id="sent" class="readout">
>> 	<h1 id="sent_data:">Sent Data:</h1>
>> 	<div class="content">
>> 		
>> 	</div>
>> </div>
>> <div id="received" class="readout">
>>
>> 	<h1 id="received_data">Received Data:</h1>
>> 	<div class="content">
>> 		
>> 	</div>
>> </div>
>> </body>
>> </html>
>>
>> Here is the wicket program to handle this
>>
>> demo.java
>> public class Demo extends BasePage {
>> 	public Demo() {
>> 		
>> 		Form form = new Form("testForm",new CompoundPropertyModel(this));
>> 		add(form);
>> 		form.add(new AjaxFormSubmitBehavior(form,"onsubmit"){
>> 			private static final long serialVersionUID = 1L;			
>>
>> 			protected void onSubmit(AjaxRequestTarget target) {
>> 				Request request = getRequest();
>> 				String data = request.getParameter("data");			
>> 				try {
>> 					JSONObject jsonData = new JSONObject();
>> 					JSONObject selectedNode = jsonData.getJSONObject(data);					
>> 				} catch (Exception e) {
>> 					throw new RuntimeException("Failed to parse selected node from
>> reply: "
>> + data);
>> 				}
>> 				//target.addComponent(received)// Add to the response data
>> 			}
>> 		});
>> 	}
>> }
>>
>>
>> ~Pen
>> --
>> View this message in context:
>> http://www.nabble.com/howto-JSON-Wicket-works--tf4865188.html#a13922782
>> Sent from the Wicket - User mailing list archive at Nabble.com.
>>
>>
>> ---------------------------------------------------------------------
>> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
>> For additional commands, e-mail: users-help@wicket.apache.org
>>
>>
> 
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
> 
> 
> 

-- 
View this message in context: http://www.nabble.com/howto-JSON-Wicket-works--tf4865188.html#a13928701
Sent from the Wicket - User mailing list archive at Nabble.com.


---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: howto JSON Wicket works?

Posted by Johan Compagner <jc...@gmail.com>.
Which part goes wrong?
Do you see the request being send?
Why do this though json? If you need json objects on the server why
not using  a normal form post and create the json object on the
server?

2007/11/24, Pen <du...@yahoo.com>:
>
> Greetings,
>
> I want to know how to handle the Jquery, JSon data in the wicket. What is
> the best way to do it.
> I have created simple form which sends the json data across to server and
> replies back to the form.
> I am not sure how to handle the request and response in wicket. I am using
> Json-lib 2.1 for jdk1.5
> Can anybody analyze the below program and suggest me what is wrong.
>
> demo.html
> <head>
> 	<script src="scripts/jquery-1.2.1.js" type="text/javascript"
> charset="utf-8"></script>	
> 	<script type="text/javascript" charset="utf-8">
> 		$(document).ready(function() {
> 			$("#testForm").submit(sendForm);
> 		});
> 		
> 		function sendForm(e) {
> 			e.preventDefault();
> 			var data = {
> 				field1: $("#field1").val(),
> 				field2: $("#field2").val(),
> 				field3: $("#field3").val(),
> 			};
> 			
> 			$("#sent .content").html(data.toSource());
> 			$.post("demo", "message=[" + data.toSource() + "];", receiveForm,
> "json");
> 		};		
> 	
> 	         function receiveForm(data) {
> 			$("#field1").val(data.field1);
> 			$("#field2").val(data.field2);
> 			$("#field3").val(data.field3);
> 			
> 			$("#received .content").html(data.toSource());
> 		};
> 	</script>
> 	
> </head>
> <body>
>
> <form wicket:id="testForm"  >
> 	<h1 id="form">Form</h1>
> 	
> 	<label for="field1">Field One:</label>
> 	<input type="text" id="field1" />
> 	
> 	<label for="field2">Field Two:</label>
> 	<input type="text" id="field2" />
> 	
> 	<label for="field3">Field Three:</label>
> 	<input type="text" id="field3" />
> 	
> 	<input type="submit" id="submitter" value="Post the data" />
> </form>
>
> <div id="sent" class="readout">
> 	<h1 id="sent_data:">Sent Data:</h1>
> 	<div class="content">
> 		
> 	</div>
> </div>
> <div id="received" class="readout">
>
> 	<h1 id="received_data">Received Data:</h1>
> 	<div class="content">
> 		
> 	</div>
> </div>
> </body>
> </html>
>
> Here is the wicket program to handle this
>
> demo.java
> public class Demo extends BasePage {
> 	public Demo() {
> 		
> 		Form form = new Form("testForm",new CompoundPropertyModel(this));
> 		add(form);
> 		form.add(new AjaxFormSubmitBehavior(form,"onsubmit"){
> 			private static final long serialVersionUID = 1L;			
>
> 			protected void onSubmit(AjaxRequestTarget target) {
> 				Request request = getRequest();
> 				String data = request.getParameter("data");			
> 				try {
> 					JSONObject jsonData = new JSONObject();
> 					JSONObject selectedNode = jsonData.getJSONObject(data);					
> 				} catch (Exception e) {
> 					throw new RuntimeException("Failed to parse selected node from reply: "
> + data);
> 				}
> 				//target.addComponent(received)// Add to the response data
> 			}
> 		});
> 	}
> }
>
>
> ~Pen
> --
> View this message in context:
> http://www.nabble.com/howto-JSON-Wicket-works--tf4865188.html#a13922782
> Sent from the Wicket - User mailing list archive at Nabble.com.
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org