Skip to main content
dublove
dublove
Legend
June 1, 2026
Answered

How do I add a dialog box that allows input and submission?

  • June 1, 2026
  • 3 replies
  • 40 views

I’m a bit confused about the different ways to implement dialog boxes, so I threw something together but it doesn’t work.
I want there to be a default value in this purple area, but I want users to be able to modify it and submit it.

Thank you.

makeDialog();

var listA;
function makeDialog() {
    //the dialog object
    var theDialog = app.dialogs.add({ name: " CopyToc", canCancel: true });
    with (theDialog.dialogColumns.add()) {
        staticTexts.add({ staticLabel: "OldStyle：" });
        staticTexts.add({ staticLabel: "NewStyle：" });
    }
    with (theDialog.dialogColumns.add()) {
        listA = []
        for (var i = 1; i < app.activeDocument.tocStyles.length; i++) {
            listA.push(app.activeDocument.tocStyles[i].name)
        };
        oldStyle = dropdowns.add({ stringList: listA, selectedIndex: 0, minWidth: 80 });

        //newStyle = inputGroup.add("edittext", undefined, "Index");

    }

    var res = theDialog.show();
    if (res == true) {
        oldStyle = listA[oldStyle.selectedIndex];
        main()
    } else {
        theDialog.destroy();
    }
}

 

    Correct answer rob day

    That would be a textEditBox

     

    makeDialog();

    var t1, t2;   
    function makeDialog(){
        var theDialog = app.dialogs.add({name:"Copy TOC", canCancel:true});
        with(theDialog.dialogColumns.add()){
            staticTexts.add({staticLabel:"Old Style:"});
            staticTexts.add({staticLabel:"New Style Name:"});
        }
        with(theDialog.dialogColumns.add()){
            t1 = dropdowns.add({stringList:app.activeDocument.tocStyles.everyItem().name, selectedIndex:0});
            t2 = textEditboxes.add({editContents:"Hello!", minWidth:150});
        }
        if(theDialog.show() == true){
            t1 = app.activeDocument.tocStyles.item(t1.selectedIndex);
            t2 = t2.editContents
            main();
            theDialog.destroy();
    	}
    }


    function main(){
        alert("\rChosen Old TOC Style: " + t1.name + "\rChosen New TOC Style: " + t2);
        //Do something with the preset here
    }

     

     

    3 replies

    rob day
    Community Expert
    rob dayCommunity Expert
    Community Expert
    June 1, 2026

    The default value is: 'index'

    Like this:

    var newName= inputGroup.add("edittext", undefined, “Index”);

     

     

    It‘s important to note there are two separate classes for constructing dialogs—there’s the ScriptUI Classes (SUI) and the built in Dialog object. The SciptUI (Window object) and Dialog methods can not be used together, so this code: 

    var newName= inputGroup.add("edittext", undefined, “Index”);

    would throw an error and not work with the dialog object I’m using in my example.

    rob day
    Community Expert
    rob dayCommunity ExpertCorrect answer
    Community Expert
    June 1, 2026

    That would be a textEditBox

     

    makeDialog();

    var t1, t2;   
    function makeDialog(){
        var theDialog = app.dialogs.add({name:"Copy TOC", canCancel:true});
        with(theDialog.dialogColumns.add()){
            staticTexts.add({staticLabel:"Old Style:"});
            staticTexts.add({staticLabel:"New Style Name:"});
        }
        with(theDialog.dialogColumns.add()){
            t1 = dropdowns.add({stringList:app.activeDocument.tocStyles.everyItem().name, selectedIndex:0});
            t2 = textEditboxes.add({editContents:"Hello!", minWidth:150});
        }
        if(theDialog.show() == true){
            t1 = app.activeDocument.tocStyles.item(t1.selectedIndex);
            t2 = t2.editContents
            main();
            theDialog.destroy();
    	}
    }


    function main(){
        alert("\rChosen Old TOC Style: " + t1.name + "\rChosen New TOC Style: " + t2);
        //Do something with the preset here
    }

     

     

    rob day
    Community Expert
    rob dayCommunity Expert
    Community Expert
    June 1, 2026

    You can do it like this and avoid arrays and for loops—tocStyles is a Collection not an Array. 

     

    makeDialog();

    var t1, t2;   
    function makeDialog(){
        var theDialog = app.dialogs.add({name:"Copy TOC", canCancel:true});
        with(theDialog.dialogColumns.add()){
            //The labels for the 2 dropdowns
            staticTexts.add({staticLabel:"Old Style:"});
            staticTexts.add({staticLabel:"New Style:"});
        }
        with(theDialog.dialogColumns.add()){
            //dropdown lists containingthe active document’s TOC Style names
            t1 = dropdowns.add({stringList:app.activeDocument.tocStyles.everyItem().name, selectedIndex:0});
            t2 = dropdowns.add({stringList:app.activeDocument.tocStyles.everyItem().name, selectedIndex:0});
        }
        if(theDialog.show() == true){
            //get the chosen TOC Styles and pass them to the main() function
            t1 = app.activeDocument.tocStyles.item(t1.selectedIndex);
            t2 = app.activeDocument.tocStyles.item(t2.selectedIndex);
            main();
            theDialog.destroy();
    	}
    }


    function main(){
        alert("\rChosen Old TOC Style: " + t1.name + "\rChosen New TOC Style: " + t2.name);
        //Do something with the preset here
    }

     

     

    dublove
    dubloveAuthor
    Legend
    June 1, 2026

    Hi ​@rob day 

    My second option is a dialog box that allows input.

    The default value is: 'index'

    Like this:

    var newName= inputGroup.add("edittext", undefined, “Index”);

     

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices