You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by hok <iv...@gmail.com> on 2010/12/20 23:26:09 UTC

DropDownChoice, AjaxFormComponentUpdatingBehavior and dijit.form.FilteringSelect

Hello,
I'm using the following test code:

public class TestPage extends WebPage {

	private DropDownChoice<String> combo;
	public TestPage() {
	}

	@Override
	protected void onInitialize() {
		super.onInitialize();

		Form<Void> f = new Form<Void>("form");
		add(f);

		List<String> choices = new ArrayList<String>();
		choices.add("1");
		choices.add("2");
		choices.add("3");
		choices.add("4");

		combo = new DropDownChoice<String>("combo", new Model<String>(""),
choices);
		combo.setOutputMarkupId(true);
		combo.setNullValid(false);
		combo.setRequired(false);
		combo.add(new AjaxFormComponentUpdatingBehavior("onchange") {
			private static final long serialVersionUID = 8796893689873687205L;

			@Override
            protected void onUpdate(AjaxRequestTarget target) {
				String s = combo.getRawInput();
				target.appendJavascript("alert('" + s + "')");
			}

			@Override
            protected void onError(AjaxRequestTarget target,
RuntimeException e) {
				target.appendJavascript("alert('error')");
			}

		});
		f.add(combo);
	}
}


and for the markup:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:wicket="http://wicket.apache.org/" xml:lang="en" lang="en">
<head>
	<style type="text/css">
	body,html {
		font-family: helvetica, arial, sans-serif;
		font-size: 90%;
	}
	</style>
	<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/dojo.xd.js" 
djConfig="isDebug: true, parseOnLoad: true"></script>
    <link rel="stylesheet" type="text/css"
href="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dijit/themes/claro/claro.css"
/>
   	<link rel="stylesheet" type="text/css"
href="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dijit/themes/dijit.css"
/>
	<script type="text/javascript">
        dojo.require("dijit.form.FilteringSelect");
	</script>
</head>

<body class="claro">
	<form wicket:id="form">
		<select wicket:id="combo" dojoType="dijit.form.FilteringSelect"
required="false"></select>
	</form>
</body>

</html>

When combo's value is changed the ajax request is sent to the server.
However I can see that the input value of "combo" is null. 
After some debugging I can see that FormComponent.getInputAsArray() and
specifically:
List<StringValue> list =
getRequest().getRequestParameters().getParameterValues(getInputName());
returns null.

If i remove dojoType="dijit.form.FilteringSelect" (make it normal combo box)
the value is successfully transfered to the server. 

As far as I can read in the info form FilteringSelect -
http://docs.dojocampus.org/dijit/form/FilteringSelect - it should behave as
a regular combo box.

Could you provide some help on where the problem comes from ? Thanks in
advance.


-- 
View this message in context: http://apache-wicket.1842946.n4.nabble.com/DropDownChoice-AjaxFormComponentUpdatingBehavior-and-dijit-form-FilteringSelect-tp3102241p3102241.html
Sent from the Users forum 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: DropDownChoice, AjaxFormComponentUpdatingBehavior and dijit.form.FilteringSelect

Posted by Martin Grigorov <ma...@gmail.com>.
3rd person for today with that problem...

Use ajaxformchoicecomponentbehavior instead

"hok" <iv...@gmail.com> wrote:

>
>Hello,
>I'm using the following test code:
>
>public class TestPage extends WebPage {
>
>	private DropDownChoice<String> combo;
>	public TestPage() {
>	}
>
>	@Override
>	protected void onInitialize() {
>		super.onInitialize();
>
>		Form<Void> f = new Form<Void>("form");
>		add(f);
>
>		List<String> choices = new ArrayList<String>();
>		choices.add("1");
>		choices.add("2");
>		choices.add("3");
>		choices.add("4");
>
>		combo = new DropDownChoice<String>("combo", new Model<String>(""),
>choices);
>		combo.setOutputMarkupId(true);
>		combo.setNullValid(false);
>		combo.setRequired(false);
>		combo.add(new AjaxFormComponentUpdatingBehavior("onchange") {
>			private static final long serialVersionUID = 8796893689873687205L;
>
>			@Override
>            protected void onUpdate(AjaxRequestTarget target) {
>				String s = combo.getRawInput();
>				target.appendJavascript("alert('" + s + "')");
>			}
>
>			@Override
>            protected void onError(AjaxRequestTarget target,
>RuntimeException e) {
>				target.appendJavascript("alert('error')");
>			}
>
>		});
>		f.add(combo);
>	}
>}
>
>
>and for the markup:
>
>
><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
>     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
><html xmlns="http://www.w3.org/1999/xhtml"
>	xmlns:wicket="http://wicket.apache.org/" xml:lang="en" lang="en">
><head>
>	<style type="text/css">
>	body,html {
>		font-family: helvetica, arial, sans-serif;
>		font-size: 90%;
>	}
>	</style>
>	<script type="text/javascript"
>src="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/dojo.xd.js" 
>djConfig="isDebug: true, parseOnLoad: true"></script>
>    <link rel="stylesheet" type="text/css"
>href="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dijit/themes/claro/claro.css"
>/>
>   	<link rel="stylesheet" type="text/css"
>href="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dijit/themes/dijit.css"
>/>
>	<script type="text/javascript">
>        dojo.require("dijit.form.FilteringSelect");
>	</script>
></head>
>
><body class="claro">
>	<form wicket:id="form">
>		<select wicket:id="combo" dojoType="dijit.form.FilteringSelect"
>required="false"></select>
>	</form>
></body>
>
></html>
>
>When combo's value is changed the ajax request is sent to the server.
>However I can see that the input value of "combo" is null. 
>After some debugging I can see that FormComponent.getInputAsArray() and
>specifically:
>List<StringValue> list =
>getRequest().getRequestParameters().getParameterValues(getInputName());
>returns null.
>
>If i remove dojoType="dijit.form.FilteringSelect" (make it normal combo
>box)
>the value is successfully transfered to the server. 
>
>As far as I can read in the info form FilteringSelect -
>http://docs.dojocampus.org/dijit/form/FilteringSelect - it should
>behave as
>a regular combo box.
>
>Could you provide some help on where the problem comes from ? Thanks in
>advance.
>
>
>-- 
>View this message in context:
>http://apache-wicket.1842946.n4.nabble.com/DropDownChoice-AjaxFormComponentUpdatingBehavior-and-dijit-form-FilteringSelect-tp3102241p3102241.html
>Sent from the Users forum 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

-- 
Sent from my Android phone with K-9 Mail. Please excuse my brevity.

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


Re: DropDownChoice, AjaxFormComponentUpdatingBehavior and dijit.form.FilteringSelect

Posted by Martin Grigorov <mg...@apache.org>.
On Mon, Dec 20, 2010 at 11:47 PM, Jeremy Thomerson <
jeremy@wickettraining.com> wrote:

> On Mon, Dec 20, 2010 at 4:41 PM, hok <iv...@gmail.com> wrote:
> >
> > Jeremy, thanks for the fast response. However my problem is not the same
> as
> > described in the other topic.
> > I'm using DropDownChoice, so I cannot use
> > AjaxFormChoiceComponentUpdatingBehavior (it throws an exception that it's
> > supposed to be used with
> RadioChoice/CheckboxChoice/RadioGroup/CheckGroup).
> > When I use the regular AjaxFormComponentUpdatingBehavior without dojo
> > FilteringSelect the behavior works normal and the value is transferred.
> The
> > problem occurs when I use FilteringSelect.
>
> Sorry, both Martin and I had our quick trigger fingers ready with the
> (almost auto-) reply.  :)
>
> Although I am not familiar with dojo, from your description of the
> problem I would suspect that Dojo is modifying the this.value of the
> select box.  Looking at the description that you linked to, this seems
> correct.  It mentions immediately that it works with an input box and
> a hidden text value.  I suspect that there is a hidden field that
> contains the value of your select box.  The description of the
> filtering select using a native select box confirms this: "the
> OPTION's child text node is used as the displayed value and the
> OPTION's value attribute is used as *the hidden submit value*".
>
> You'll need to write some custom JS (probably as an
> IAjaxCallDecorator) that sets the value of the select input to the
> value of the hidden field before Wicket does its thing, or else that
> does custom submission altogether.
>
> --
> Jeremy Thomerson
> http://wickettraining.com
> Need a CMS for Wicket?  Use Brix! http://brixcms.org
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>
Here is a custom behavior that I wrote once for Dojo's form components
(dijit.form.**):
http://pastie.org/1394480

The usage is: dropDownChoice.add(new
DojoFormComponentUpdatingBehavior("dijit.form.FilteringSelect",
true));

The idea is that dijit.form.** components must have "onChange" attribute and
the new value comes in "arguments[0]"

Re: DropDownChoice, AjaxFormComponentUpdatingBehavior and dijit.form.FilteringSelect

Posted by Jeremy Thomerson <je...@wickettraining.com>.
On Mon, Dec 20, 2010 at 4:41 PM, hok <iv...@gmail.com> wrote:
>
> Jeremy, thanks for the fast response. However my problem is not the same as
> described in the other topic.
> I'm using DropDownChoice, so I cannot use
> AjaxFormChoiceComponentUpdatingBehavior (it throws an exception that it's
> supposed to be used with RadioChoice/CheckboxChoice/RadioGroup/CheckGroup).
> When I use the regular AjaxFormComponentUpdatingBehavior without dojo
> FilteringSelect the behavior works normal and the value is transferred. The
> problem occurs when I use FilteringSelect.

Sorry, both Martin and I had our quick trigger fingers ready with the
(almost auto-) reply.  :)

Although I am not familiar with dojo, from your description of the
problem I would suspect that Dojo is modifying the this.value of the
select box.  Looking at the description that you linked to, this seems
correct.  It mentions immediately that it works with an input box and
a hidden text value.  I suspect that there is a hidden field that
contains the value of your select box.  The description of the
filtering select using a native select box confirms this: "the
OPTION's child text node is used as the displayed value and the
OPTION's value attribute is used as *the hidden submit value*".

You'll need to write some custom JS (probably as an
IAjaxCallDecorator) that sets the value of the select input to the
value of the hidden field before Wicket does its thing, or else that
does custom submission altogether.

-- 
Jeremy Thomerson
http://wickettraining.com
Need a CMS for Wicket?  Use Brix! http://brixcms.org

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


Re: DropDownChoice, AjaxFormComponentUpdatingBehavior and dijit.form.FilteringSelect

Posted by hok <iv...@gmail.com>.
Jeremy, thanks for the fast response. However my problem is not the same as
described in the other topic.
I'm using DropDownChoice, so I cannot use
AjaxFormChoiceComponentUpdatingBehavior (it throws an exception that it's
supposed to be used with RadioChoice/CheckboxChoice/RadioGroup/CheckGroup).
When I use the regular AjaxFormComponentUpdatingBehavior without dojo
FilteringSelect the behavior works normal and the value is transferred. The
problem occurs when I use FilteringSelect. 
-- 
View this message in context: http://apache-wicket.1842946.n4.nabble.com/DropDownChoice-AjaxFormComponentUpdatingBehavior-and-dijit-form-FilteringSelect-tp3102241p3104029.html
Sent from the Users forum 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: DropDownChoice, AjaxFormComponentUpdatingBehavior and dijit.form.FilteringSelect

Posted by Jeremy Thomerson <je...@wickettraining.com>.
On Mon, Dec 20, 2010 at 4:26 PM, hok <iv...@gmail.com> wrote:
>
> Hello,
> I'm using the following test code:
>
> public class TestPage extends WebPage {
>
>        private DropDownChoice<String> combo;
>        public TestPage() {
>        }
>
>        @Override
>        protected void onInitialize() {
>                super.onInitialize();
>
>                Form<Void> f = new Form<Void>("form");
>                add(f);
>
>                List<String> choices = new ArrayList<String>();
>                choices.add("1");
>                choices.add("2");
>                choices.add("3");
>                choices.add("4");
>
>                combo = new DropDownChoice<String>("combo", new Model<String>(""),
> choices);
>                combo.setOutputMarkupId(true);
>                combo.setNullValid(false);
>                combo.setRequired(false);
>                combo.add(new AjaxFormComponentUpdatingBehavior("onchange") {
>                        private static final long serialVersionUID = 8796893689873687205L;
>
>                        @Override
>            protected void onUpdate(AjaxRequestTarget target) {
>                                String s = combo.getRawInput();
>                                target.appendJavascript("alert('" + s + "')");
>                        }
>
>                        @Override
>            protected void onError(AjaxRequestTarget target,
> RuntimeException e) {
>                                target.appendJavascript("alert('error')");
>                        }
>
>                });
>                f.add(combo);
>        }
> }
>
>
> and for the markup:
>
>
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
>     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
> <html xmlns="http://www.w3.org/1999/xhtml"
>        xmlns:wicket="http://wicket.apache.org/" xml:lang="en" lang="en">
> <head>
>        <style type="text/css">
>        body,html {
>                font-family: helvetica, arial, sans-serif;
>                font-size: 90%;
>        }
>        </style>
>        <script type="text/javascript"
> src="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/dojo.xd.js"
> djConfig="isDebug: true, parseOnLoad: true"></script>
>    <link rel="stylesheet" type="text/css"
> href="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dijit/themes/claro/claro.css"
> />
>        <link rel="stylesheet" type="text/css"
> href="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dijit/themes/dijit.css"
> />
>        <script type="text/javascript">
>        dojo.require("dijit.form.FilteringSelect");
>        </script>
> </head>
>
> <body class="claro">
>        <form wicket:id="form">
>                <select wicket:id="combo" dojoType="dijit.form.FilteringSelect"
> required="false"></select>
>        </form>
> </body>
>
> </html>
>
> When combo's value is changed the ajax request is sent to the server.
> However I can see that the input value of "combo" is null.
> After some debugging I can see that FormComponent.getInputAsArray() and
> specifically:
> List<StringValue> list =
> getRequest().getRequestParameters().getParameterValues(getInputName());
> returns null.
>
> If i remove dojoType="dijit.form.FilteringSelect" (make it normal combo box)
> the value is successfully transfered to the server.
>
> As far as I can read in the info form FilteringSelect -
> http://docs.dojocampus.org/dijit/form/FilteringSelect - it should behave as
> a regular combo box.
>
> Could you provide some help on where the problem comes from ? Thanks in
> advance.

Absolutely amazing!  There was another thread about this no more than
twenty minutes ago, with a commit no more than five hours ago that
logged a warning when this was done.  See this reply for your answer:

http://apache-wicket.1842946.n4.nabble.com/AjaxFormComponentUpdatingBehaviour-on-CheckBoxMultipleChoice-component-tp3097163p3097402.html

-- 
Jeremy Thomerson
http://wickettraining.com
Need a CMS for Wicket?  Use Brix! http://brixcms.org

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