Need Help Creating Fillable Form - Using Javascript with List Box and Multiple Selections

New Here ,
Oct 20, 2021 Oct 20, 2021

Copy link to clipboard

Copied

I need help with a form I am creating. I have a "List of Choices" box on my form that has all the Florida Cities. What I am trying to do is, create a button that moves their selection (or selections) to another box. What is the JavaScript for this action? Also, I want to be able to clear the box when the "Clear Form" button is pressed. Is this possible?

Example.png

TOPICS
How to , JavaScript

Views

119

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Adobe Community Professional , Oct 20, 2021 Oct 20, 2021

Hi,

 

gassumed the listbox is names "ListBox" and the text field "TextField" this should do the trick:

var oList = this.getField("ListBox"),
    oField = this.getField("TextField"),
    aSelection = oList.currentValueIndices,
    cOutput = "";
if (typeof aSelection == "number") {
    cOutput += "\n" + oList.getItemAt(aSelection, false);
} else {
    for (var i = 0; i < aSelection.length; i ++) {
        cOutput += "\n" + oList.getItemAt(aSelection[i], false);
    }
}
oField.value = cOutput;

 

Likes

Translate

Translate
Adobe Community Professional ,
Oct 20, 2021 Oct 20, 2021

Copy link to clipboard

Copied

Hi,

 

gassumed the listbox is names "ListBox" and the text field "TextField" this should do the trick:

var oList = this.getField("ListBox"),
    oField = this.getField("TextField"),
    aSelection = oList.currentValueIndices,
    cOutput = "";
if (typeof aSelection == "number") {
    cOutput += "\n" + oList.getItemAt(aSelection, false);
} else {
    for (var i = 0; i < aSelection.length; i ++) {
        cOutput += "\n" + oList.getItemAt(aSelection[i], false);
    }
}
oField.value = cOutput;

 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Oct 21, 2021 Oct 21, 2021

Copy link to clipboard

Copied

I placed the JavaScript into the "Text Box" under the actions tab, and if you press the "Add" button it does move it from the "List Box" to the "Text Box". However, if you select multiple cities and press "Add"  they appear all crammed together in the "Text Box". Is there a way I can fix this?

Screenshot 2021-10-21 151418.png

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Oct 21, 2021 Oct 21, 2021

Copy link to clipboard

Copied

Did you set the text field as Multiline?

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Oct 22, 2021 Oct 22, 2021

Copy link to clipboard

Copied

Yes

Screenshot 2021-10-22 105405.png

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Oct 22, 2021 Oct 22, 2021

Copy link to clipboard

Copied

Nevermind, I found the problem and it's now working PERFECTLY! Thank you so much for your help, I've been searching for over a week for a way to do this. 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Aug 02, 2022 Aug 02, 2022

Copy link to clipboard

Copied

How do you remove the space at the top of  List Box2? I've tried all the formatting tricks I know, but nothing fixes the problem. Even if you only make one selection and hit the "add" button it still puts an empty space at the top. Can this be fixed?

Shanda25495492ozxu_0-1659476103713.png

 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Aug 02, 2022 Aug 02, 2022

Copy link to clipboard

Copied

How are you populating it? If using a script, post the code, please.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Aug 03, 2022 Aug 03, 2022

Copy link to clipboard

Copied

This is the code I am using. I put the code under the action tab for the button.

 

var oList = this.getField("List Box1"),
oField = this.getField("List Box2"),
aSelection = oList.currentValueIndices,
cOutput = "";
if (typeof aSelection == "number") {
cOutput += "\n" + oList.getItemAt(aSelection, false);
} else {
for (var i = 0; i < aSelection.length; i ++) {
cOutput += "\n" + oList.getItemAt(aSelection[i], false);
}
}
oField.value = cOutput;

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Aug 03, 2022 Aug 03, 2022

Copy link to clipboard

Copied

In these lines move the "\n" part to the end:

cOutput += "\n" + oList.getItemAt(aSelection, false);

cOutput += "\n" + oList.getItemAt(aSelection[i], false);

So like this:

cOutput += oList.getItemAt(aSelection, false) + "\n";

cOutput += oList.getItemAt(aSelection[i], false) + "\n";

 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Aug 04, 2022 Aug 04, 2022

Copy link to clipboard

Copied

LATEST

Thank you!

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Oct 20, 2021 Oct 20, 2021

Copy link to clipboard

Copied

You can access the field's value using the value property. Note it will return an Array if multiple items are selected, or a String if only one item. You can then use the insertItemAt method to add new items to the other field. You might want to make sure those items aren't already there, though.

To clear the list of items you can use the clearItems method.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines