How to change text field size by drop-down list value | Community
Skip to main content
E
eugzl
Level 5
September 13, 2019
Solved

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

  • September 13, 2019
  • 3 replies
  • 3611 views

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.

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by arunpatidar

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.$);

3 replies

Bharath_valse
Bharath_valse
Level 4
September 13, 2019

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

    E
    eugzlAuthor
    Level 5
    September 14, 2019

    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.

    arunpatidar
    Community Advisor
    arunpatidarCommunity AdvisorAccepted solution
    Community Advisor
    September 14, 2019

    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.$);

    Arun Patidar
    Terms & ConditionsAccessibility statement

    Loading footer...