Orbeon Forms community mailing list

Dynamically filter dropdown list based on other dropdown value

Classic

List

Threaded

19 messages Options

mbojja

Dynamically filter dropdown list based on other dropdown value

Hi Alex - I have a service returning an xml below. The form must have 3 dropdowns (Countries - display all countries, States - display all states of the country selected, Cities - display all cities of the state selected ). How do I achieve this using the xpath if the service do not take countries/states as request parameter?

<_ type="object">

<country>Australia</country>

<_ type="object">

<_ type="object">

<city>Perth</city>

</_>

<_ type="object">

<city>Albany</city>

</_>

</cities>

</_>

<_ type="object">

<state>Victoria</state>

<_ type="object">

<city>Melbourne</city>

</_>

<_ type="object">

<city>Geelong</city>

</_>

</cities>

</_>

</states>

</_>

<_ type="object">

<_ type="object">

<state>California</state>

<_ type="object">

<city>San Francisco</city>

</_>

<_ type="object">

<city>Los Angeles</city>

</_>

</cities>

</_>

<_ type="object">

<state>Texas</state>

<_ type="object">

<city>Dallas</city>

</_>

<_ type="object">

<city>Houston</city>

</_>

</cities>

</_>

</states>

</_>

</countries>

</json>

Thanks

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/b343266e-80e3-464d-b80c-9ff9a183b343%40googlegroups.com.

Alessandro Vernet

Re: Dynamically filter dropdown list based on other dropdown value

Administrator

Hi Manish,

I've created a form that shows how you can do this (see `form.xml` linked
below). And you can see what this looks like in the video linked below.

(Updating the list of possible values in dropdowns requires an Ajax request
to the server, so one downside of updating dropdowns this way is that if
users open the State dropdown very quickly after changing their selected
Country, they will still see the list of states of the previously selected
country.)

form.xml <http://discuss.orbeon.com/file/t119778/form.xml>
cascading-dropdowns.mp4
<http://discuss.orbeon.com/file/t119778/cascading-dropdowns.mp4>

You'll let me know if this works for you,

‑Alex

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/1582668069512-0.post%40n4.nabble.com.

--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet

mbojja

Re: Dynamically filter dropdown list based on other dropdown value

Thanks Alex - the form looks different to what I have asked.

On Wednesday, February 26, 2020 at 6:01:04 AM UTC+8, Alessandro Vernet wrote:

Hi Manish,

I've created a form that shows how you can do this (see `form.xml` linked
below). And you can see what this looks like in the video linked below.

(Updating the list of possible values in dropdowns requires an Ajax request
to the server, so one downside of updating dropdowns this way is that if
users open the State dropdown very quickly after changing their selected
Country, they will still see the list of states of the previously selected
country.)

form.xml <<a href="http://discuss.orbeon.com/file/t119778/form.xml" target="_blank" rel="nofollow" onmousedown="this.href='http://www.google.com/url?q\x3dhttp%3A%2F%2Fdiscuss.orbeon.com%2Ffile%2Ft119778%2Fform.xml\x26sa\x3dD\x26sntz\x3d1\x26usg\x3dAFQjCNH-kQq86nRhxmeAHNseu9ucWhj7QQ';return true;" onclick="this.href='http://www.google.com/url?q\x3dhttp%3A%2F%2Fdiscuss.orbeon.com%2Ffile%2Ft119778%2Fform.xml\x26sa\x3dD\x26sntz\x3d1\x26usg\x3dAFQjCNH-kQq86nRhxmeAHNseu9ucWhj7QQ';return true;">http://discuss.orbeon.com/file/t119778/form.xml>
cascading-dropdowns.mp4
<<a href="http://discuss.orbeon.com/file/t119778/cascading-dropdowns.mp4" target="_blank" rel="nofollow" onmousedown="this.href='http://www.google.com/url?q\x3dhttp%3A%2F%2Fdiscuss.orbeon.com%2Ffile%2Ft119778%2Fcascading-dropdowns.mp4\x26sa\x3dD\x26sntz\x3d1\x26usg\x3dAFQjCNEHieMfYbLKXgjmKDz_micQ9ZvNxw';return true;" onclick="this.href='http://www.google.com/url?q\x3dhttp%3A%2F%2Fdiscuss.orbeon.com%2Ffile%2Ft119778%2Fcascading-dropdowns.mp4\x26sa\x3dD\x26sntz\x3d1\x26usg\x3dAFQjCNEHieMfYbLKXgjmKDz_micQ9ZvNxw';return true;">http://discuss.orbeon.com/file/t119778/cascading-dropdowns.mp4>

You'll let me know if this works for you,

‑Alex

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: <a href="http://discuss.orbeon.com/" target="_blank" rel="nofollow" onmousedown="this.href='http://www.google.com/url?q\x3dhttp%3A%2F%2Fdiscuss.orbeon.com%2F\x26sa\x3dD\x26sntz\x3d1\x26usg\x3dAFQjCNF5V5zfD-87RVoalaG4cqO_RzdDcA';return true;" onclick="this.href='http://www.google.com/url?q\x3dhttp%3A%2F%2Fdiscuss.orbeon.com%2F\x26sa\x3dD\x26sntz\x3d1\x26usg\x3dAFQjCNF5V5zfD-87RVoalaG4cqO_RzdDcA';return true;">http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/c7e4ce6a-6025-44d0-910f-0c9eda934425%40googlegroups.com.

Alessandro Vernet

Re: Dynamically filter dropdown list based on other dropdown value

Administrator

Hi Manish, you're welcome, and of course in the case the form I attached is
materially different, in the sense that you can't infer from it how to do
what you need, you'll just let me know in what way that is.

‑Alex

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/1585261810183-0.post%40n4.nabble.com.

--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet

mbojja

Re: Dynamically filter dropdown list based on other dropdown value

Hi Alex - Please see the original question below.

<json type="object">

<success type="boolean">true</success>

<message type="null"/>

<countries type="array">

<_ type="object">

<country>Australia</country>

<states type="array">

<_ type="object">

<state>WA</state>

<cities type="array">

<_ type="object">

<city>Perth</city>

</_>

<_ type="object">

<city>Albany</city>

</_>

</cities>

</_>

<_ type="object">

<state>Victoria</state>

<cities type="array">

<_ type="object">

<city>Melbourne</city>

</_>

<_ type="object">

<city>Geelong</city>

</_>

</cities>

</_>

</states>

</_>

<_ type="object">

<country>USA</country>

<states type="array">

<_ type="object">

<state>California</state>

<cities type="array">

<_ type="object">

<city>San Francisco</city>

</_>

<_ type="object">

<city>Los Angeles</city>

</_>

</cities>

</_>

<_ type="object">

<state>Texas</state>

<cities type="array">

<_ type="object">

<city>Dallas</city>

</_>

<_ type="object">

<city>Houston</city>

</_>

</cities>

</_>

</states>

</_>

</countries>

</json>

Thanks

On Friday, March 27, 2020 at 6:30:14 AM UTC+8, Alessandro Vernet wrote:

Hi Manish, you're welcome, and of course in the case the form I attached is
materially different, in the sense that you can't infer from it how to do
what you need, you'll just let me know in what way that is.

‑Alex

And the form here <http://discuss.orbeon.com/file/t119778/form.xml> has a different solution. Could you please update the solution for the question above. Thanks :)

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: <a href="http://discuss.orbeon.com/" target="_blank" rel="nofollow" onmousedown="this.href='http://www.google.com/url?q\x3dhttp%3A%2F%2Fdiscuss.orbeon.com%2F\x26sa\x3dD\x26sntz\x3d1\x26usg\x3dAFQjCNF5V5zfD-87RVoalaG4cqO_RzdDcA';return true;" onclick="this.href='http://www.google.com/url?q\x3dhttp%3A%2F%2Fdiscuss.orbeon.com%2F\x26sa\x3dD\x26sntz\x3d1\x26usg\x3dAFQjCNF5V5zfD-87RVoalaG4cqO_RzdDcA';return true;">http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/190c4b6f-17a0-4495-9d39-83a78ff8ba1d%40googlegroups.com.

Alessandro Vernet

Re: Dynamically filter dropdown list based on other dropdown value

Administrator

Hi Manish,

I see: I had attached the wrong source! He is the correct one, and you'll
let me know if this works for you.

form.xml <http://discuss.orbeon.com/file/t119778/form.xml>

‑Alex

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/1585335585867-0.post%40n4.nabble.com.

--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet

Alessandro Vernet

Re: Dynamically filter dropdown list based on other dropdown value

Administrator

Hi Manish, did you get a chance to try the "correct" ;) form attached Tony
previous message? Does it do what you were looking for with chained
dropdowns?

‑Alex

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/1585934486167-0.post%40n4.nabble.com.

--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet

mbojja

Re: Dynamically filter dropdown list based on other dropdown value

Thanks Alex. Works perfect :)

Just a quick question. I'm using a repeated grid with 4 columns. If I have more than two columns in a repeated grid it looks terrible on a mobile device i.e. the label of those fields. What do you recommend in these cases if the user would like to fill the form using a mobile device?

On Sat, 4 Apr 2020, 01:21 Alessandro Vernet, <[hidden email]> wrote:

Hi Manish, did you get a chance to try the "correct" ;) form attached Tony
previous message? Does it do what you were looking for with chained
dropdowns?

‑Alex

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/1585934486167-0.post%40n4.nabble.com.

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/CAN39TsMiJansYNPsmzj6KqVgqWHMY_-6fmB7DvVi10MLtYEFxQ%40mail.gmail.com.

Alessandro Vernet

Re: Dynamically filter dropdown list based on other dropdown value

Administrator

Hi Manish,

I'm glad you got the chained dropdowns to work the way you wanted. Regular
grids are shown differently when you're on a screen with a narrow device,
but Orbeon Forms doesn't yet "reflow" repeated grids (because the situation
is more complicated in that case). I've created a request for enhancement
for this with a +1 from you (see link below), but I don't really have a
workaround for you, other than trying to make the table narrow enough if
mobile is important for this form ;).

https://github.com/orbeon/orbeon-forms/issues/4491

‑Alex

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/1586302054911-0.post%40n4.nabble.com.

--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet

mbojja

Re: Dynamically filter dropdown list based on other dropdown value

Thanks Alex - I will also raise this using our basecamp to keep track of it.

Cheers

On Wednesday, April 8, 2020 at 7:28:11 AM UTC+8, Alessandro Vernet wrote:

Hi Manish,

I'm glad you got the chained dropdowns to work the way you wanted. Regular
grids are shown differently when you're on a screen with a narrow device,
but Orbeon Forms doesn't yet "reflow" repeated grids (because the situation
is more complicated in that case). I've created a request for enhancement
for this with a +1 from you (see link below), but I don't really have a
workaround for you, other than trying to make the table narrow enough if
mobile is important for this form ;).

<a href="https://github.com/orbeon/orbeon-forms/issues/4491" target="_blank" rel="nofollow" onmousedown="this.href='https://www.google.com/url?q\x3dhttps%3A%2F%2Fgithub.com%2Forbeon%2Forbeon-forms%2Fissues%2F4491\x26sa\x3dD\x26sntz\x3d1\x26usg\x3dAFQjCNE87IqESf_W00dageW5QpX2k3250Q';return true;" onclick="this.href='https://www.google.com/url?q\x3dhttps%3A%2F%2Fgithub.com%2Forbeon%2Forbeon-forms%2Fissues%2F4491\x26sa\x3dD\x26sntz\x3d1\x26usg\x3dAFQjCNE87IqESf_W00dageW5QpX2k3250Q';return true;">https://github.com/orbeon/orbeon-forms/issues/4491

‑Alex

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: <a href="http://discuss.orbeon.com/" target="_blank" rel="nofollow" onmousedown="this.href='http://www.google.com/url?q\x3dhttp%3A%2F%2Fdiscuss.orbeon.com%2F\x26sa\x3dD\x26sntz\x3d1\x26usg\x3dAFQjCNF5V5zfD-87RVoalaG4cqO_RzdDcA';return true;" onclick="this.href='http://www.google.com/url?q\x3dhttp%3A%2F%2Fdiscuss.orbeon.com%2F\x26sa\x3dD\x26sntz\x3d1\x26usg\x3dAFQjCNF5V5zfD-87RVoalaG4cqO_RzdDcA';return true;">http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/f1cecded-994d-43e0-b01f-05e04be7401e%40googlegroups.com.

Alessandro Vernet

Re: Dynamically filter dropdown list based on other dropdown value

Administrator

👍

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/1586394080744-0.post%40n4.nabble.com.

--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet

Leo7

Re: Dynamically filter dropdown list based on other dropdown value

Hi Alex,

I tested in repeated grid.

If rows add, this errors happened.

Could you please update the solution for the problem :).

On Thursday, April 9, 2020 at 7:31:22 AM UTC+6:30, Alessandro Vernet wrote:

👍

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: <a href="http://discuss.orbeon.com/" target="_blank" rel="nofollow" onmousedown="this.href='http://www.google.com/url?q\x3dhttp%3A%2F%2Fdiscuss.orbeon.com%2F\x26sa\x3dD\x26sntz\x3d1\x26usg\x3dAFQjCNF5V5zfD-87RVoalaG4cqO_RzdDcA';return true;" onclick="this.href='http://www.google.com/url?q\x3dhttp%3A%2F%2Fdiscuss.orbeon.com%2F\x26sa\x3dD\x26sntz\x3d1\x26usg\x3dAFQjCNF5V5zfD-87RVoalaG4cqO_RzdDcA';return true;">http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/ab81a103-a53d-44e3-bdc0-45398176bc7ao%40googlegroups.com.

Alessandro Vernet

Re: Dynamically filter dropdown list based on other dropdown value

Administrator

Hi Leo7,

I am not seeing an error in the 2 screenshots you attached. Am I missing
something?

‑Alex

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/1592625499030-0.post%40n4.nabble.com.

--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet

Leo7

Re: Dynamically filter dropdown list based on other dropdown value

Hi Alex,

By json value, states are WA and Victoria if country is Australia . And,
states are California and Texas if country is USA.
First row, when I choose Australia , states appear correctly.
Second row, when I choose that country again, states appear correctly.
But at third row, when I choose USA, states appear wrongly.
First row is always correct, any country I choose.
In next rows, when I choose country different from upper row, states are
mixing with states of first row.
Can you help me slove this problem :)?

--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/1592710191046-0.post%40n4.nabble.com.

Alessandro Vernet

Re: Dynamically filter dropdown list based on other dropdown value

Administrator

Hi Leo7,

Got it, but I am not sure why that would be. Could you create a minimal
example that reproduces the problem on demo.orbeon.com, and share the source
with us, so we can look at it in detail?

‑Alex

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/1592884278196-0.post%40n4.nabble.com.

--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet

Leo7

Re: Dynamically filter dropdown list based on other dropdown value

Hi Alex,

Thanks for your reply.
This is my sample form.

https://demo.orbeon.com/demo/fr/orbeon/builder/edit/3b1ebd5340007f245b34ccd468c36c188b376bd6
<https://demo.orbeon.com/demo/fr/orbeon/builder/edit/3b1ebd5340007f245b34ccd468c36c188b376bd6>

--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/1592884975105-0.post%40n4.nabble.com.

Joel Oates

Re: Dynamically filter dropdown list based on other dropdown value

Hi Leo

It seems that you need to filter your `City` dropdown like you have done
with your `State` dropdown

in your state xpath expression you have
xxf:instance('fr-dataset-geo')/countries/_[country =
xxf:instance('fr-form-instance')//country]/states/_/state

this is filtering the `State` dropdown depending on the selected county,
then we need to do the same for the city
So What you need in the `City` xpath expression is the following

xxf:instance('fr-dataset-geo')/countries/_[country =
xxf:instance('fr-form-instance')//country]/states/_[state =
xxf:instance('fr-form-instance')//state]/cities/_/city

So then the city filters from the `country` and the `state`

Hope this helps!
Joel.

--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/1592962866803-0.post%40n4.nabble.com.

Leo7

Re: Dynamically filter dropdown list based on other dropdown value

Hi Joel,

This error occurred in 'State' dropdown.

in my state xpath expression i have
xxf:instance('fr-dataset-geo')/countries/_[country =
xxf:instance('fr-form-instance')//country]/states/_/state

By my above two replies,
First row is always correct, any country I choose.
In next rows, when I choose country different from upper row, states are
mixing with states of first row.

Thank for your advice.

--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/1592964632848-0.post%40n4.nabble.com.

Joel Oates

Re: Dynamically filter dropdown list based on other dropdown value

Hi Leo,

Sorry I misunderstood your issue!

I didn't notice that you were using a repeating grid, apologizes there..

So your issue is with the part

xxf:instance('fr-form-instance')//country]/states/_/state

when you insert another row into your repeating grid this xpath will find
all the matches to this expression, so what you need to do is make sure this
xpath only applies to the current iteration of your repeating grid. We can
use the `xxf:repeat-position()` function to get this!

So your xpath would look something like the following for your State

xxf:instance('fr-dataset-geo')/countries/_[country =
xxf:instance('fr-form-instance')//grid-2-iteration[xxf:repeat-position()]//country]/states/_/state

And for your city

xxf:instance('fr-dataset-geo')/countries/_[country =
xxf:instance('fr-form-instance')//grid-2-iteration[xxf:repeat-position()]/country]/states/_[state
=
xxf:instance('fr-form-instance')//grid-2-iteration[xxf:repeat-position()]/state]/cities/_/city

Hope that helps

Joel.

--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/orbeon/1592966416105-0.post%40n4.nabble.com.