Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

SOLVED

How to change text field size by drop-down list value

Avatar

Level 5

Hi All.

I have drop-down list and text field in the form and Iwould like to change high and width by selecting value in drop-down list. If that is possible how to do that?

Thanks.

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Hi,

you can get value from dropdown and applied to text field.

(function(document, $) {

    "use strict";

$(document).on("selected", "#dropdownId", function(e) {

    var selectVal = $(this).val();

    $("#textFieldId").attr("size", selectVal);

  });

})(document, Granite.$);

View solution in original post

3 Replies

Avatar

Level 4

You could do that by executing JS code on submitting the Touch UI dialog. The JS code can pick the values from JCR and modify HTML DOM accordingly

Here's some example to handle touch UI dialog events.

Adobe Experience Manager Help | Using Event Handlers in Adobe Experience Manager Touch UI Components

Avatar

Level 5

Hi Bharath. Thanks for replay.

Yes, I need JS code in event change of drop-down list with IF statement. It should be look like:

if(xfa.event.newText == "Other")

   TextField.presence.w = "2 in";

   DropDownList.w = "1 in";

else

   TextField.presence.w = "1 in";

   DropDownList,w = "2 in";

But that code doesn't work. My problem how correct to specify width in the JS code. How to fix it?

Thanks.

Avatar

Correct answer by
Community Advisor

Hi,

you can get value from dropdown and applied to text field.

(function(document, $) {

    "use strict";

$(document).on("selected", "#dropdownId", function(e) {

    var selectVal = $(this).val();

    $("#textFieldId").attr("size", selectVal);

  });

})(document, Granite.$);