Skip to main content
Turan_Elkhan
Turan_Elkhan
Inspiring
November 8, 2023
Answered

OK, Cancel, Next, Back buttons Acro dialog

  • November 8, 2023
  • 3 replies
  • 1362 views

Hi community. Is it possible to get the (OK, Cancel, Next, Back) buttons? I'm a beginner, and I am grateful for any answer. Many thanks in advance.

var oDlg1 = {
	Name: 0,

	initialize: function(dialog) {
		dialog.load({
			"name": this.Name,
		});
	},
	commit: function(dialog) {
		var data = dialog.store();
		this.Name = data["Name"];
	},
	description: {
		name: "",
		align_children: "align_left",
		elements: [{
			type: "view",
			align_children: "align_top",
			elements: [{
				type: "cluster",
				font: "dialog",
				bold: true,
				name: "",
				elements: [{
					name: "Name:",
					type: "static_text",
				}, {
					item_id: "name",
					type: "edit_text",
					font: "dialog",
					bold: true,
					char_width: 25,
					char_height: 2,
				}],
			}],
		},
		{
			type: "ok_cancel",
			ok_name: "Next",
			cancel_name: "Cancel",
		}]
	}
};

oDlg1.Name = this.getField("Name").value;

var oDlg2 = {
	Surname: "",

	initialize: function(dialog) {
		dialog.load({
			"snam": this.Surname,
		});
	},
	commit: function(dialog) {
		var data = dialog.store();
		this.Surname = data["snam"];
	},
	description: {
		name: "Surname:",
		align_children: "align_left",
		elements: [{
			type: "view",
			align_children: "align_top",
			elements: [{
				type: "cluster",
				font: "dialog",
				bold: true,
				name: "",
				elements: [{
					name: "Surname:",
					type: "static_text",
				}, {
					item_id: "snam",
					type: "edit_text",
					font: "dialog",
					bold: true,
					char_width: 25,
					char_height: 2,
				}],
			}],
		},
		{
			type: "ok_cancel_other",
			ok_name: "OK",
			cancel_name: "Cancel",
			other_name: "Back",
		}]
	}
};

oDlg2.Surname = this.getField("Surname").value;

if ("other" == app.execDialog(oDlg1)) {

} else if ("ok" == app.execDialog(oDlg2)) {
	this.getField("Surname").value = oDlg2.Surname;
	this.getField("Name").value = oDlg1.Name;
}

?

    This topic has been closed for replies.
    Correct answer Thom Parker

    No, that's not it.

    Since you have 7 sequential dialogs it would be worth while to adopt a more indirect approach using abstraction and separation of data from function. Right now you are using a brute force approach that works forward only.  This strategy falls apart for the "back" button.  

     

    However, the  first thing to do is to work out the dialog operation, separate from the rest of the script.  Specifically, how to get a return value from pressing the "Other" button, which unlike "Ok" and "Cancel" doesn't automatically close the dialog, and therefore does not generate a return value. 

    Each element on a dialog has an associated trigger. For a button its the MouseUp. Each trigger executes a dialog object member function with the same name as the "item_id" of the element that genterates the trigger.     

    See the "Dialog box handlers" section of "app.execDialog" in the JavaScript reference. 

    In the case of the "ok_cancel_other" button group the "item_id" for the "other" button is "other". You need to create a function for this item_id that forces the dialog to close and return a value. 

    I've already provided the dialog function needed to make this work. Just try out the dialog by itself, with out any other code until the issue solved.  

     

     

    3 replies

    Thom Parker
    Community Expert
    Thom ParkerCommunity Expert
    Community Expert
    November 9, 2023

    The way the dialogs are setup, oDlg1 will never return "other" and oDlg2 will not exit when the "Back" button is pressed.  In fact, no dialog can be setup to return "other", since this word contains 5 characters. Forced exits from a dialog can only return a 4 character string. 

     

    To make this work a dialog member function needs to be created that will trigger when the "other" button is pressed. This function should use the dialog.end() function to exit the dialog and return  a 4 character string, such as "back".  

     

     

    Thom Parker - Software Developer at PDFScriptingUse the Acrobat JavaScript Reference early and often
      Turan_Elkhan
      Turan_ElkhanAuthor
      Inspiring
      November 9, 2023

      Thank you, Thom, also for your reply. Do you mean something like this? But I couldn't get the "Back" button to work with this.

       

      var oDlg1 = {
    Name: 0,

    initialize: function(dialog) {
        dialog.load({
            "name": this.Name,
        });
    },
    commit: function(dialog) {
        var data = dialog.store();
        this.Name = data["name"];
    
    },
    description: {
        name: "",
        align_children: "align_left",
        elements: [
            {
                type: "view",
                align_children: "align_top",
                elements: [
                    {
                        type: "cluster",
                        font: "dialog",
                        bold: true,
                        name: "",
                        elements: [
                            {
                                name: "Name:",
                                type: "static_text",
                            },
                            {
                                item_id: "name",
                                type: "edit_text",
                                font: "dialog",
                                bold: true,
                                char_width: 25,
                                char_height: 2,
                            },
                        ],
                    },
                ],
            },
            {
                type: "ok_cancel",
                ok_name: "Next",
                cancel_name: "Cancel",
                other_name: "Back",
            },
        ],
    },
};

oDlg1.Name = this.getField("Name").value;

var oDlg2 = {
    Surname: "",

    initialize: function(dialog) {
        dialog.load({
            "snam": this.Surname,
        });
    },
    commit: function(dialog) {
        var data = dialog.store();
        this.Surname = data["snam"];
    
    },
    description: {
        name: "Surname:",
        align_children: "align_left",
        elements: [
            {
                type: "view",
                align_children: "align_top",
                elements: [
                    {
                        type: "cluster",
                        font: "dialog",
                        bold: true,
                        name: "",
                        elements: [
                            {
                                name: "Surname:",
                                type: "static_text",
                            },
                            {
                                item_id: "snam",
                                type: "edit_text",
                                font: "dialog",
                                bold: true,
                                char_width: 25,
                                char_height: 2,
                            },
                        ],
                    },
                ],
            },
            {
                type: "ok_cancel_other",
                ok_name: "OK",
                cancel_name: "Cancel",
                other_name: "Back",
            },
        ],
    },
};

oDlg2.Surname = this.getField("Surname").value;

var result1, result2;

do {
    result1 = app.execDialog(oDlg1);

    result2 = app.execDialog(oDlg2);

    if (result2 === "back") {
        result1 = app.execDialog(oDlg1);
    } else if (result2 === "ok") {
        this.getField("Surname").value = oDlg2.Surname;
        this.getField("Name").value = oDlg1.Name;
    }
} while (result1 === "back" || result2 === "back");

       

      Thom Parker
      Community Expert
      Thom ParkerCommunity ExpertCorrect answer
      Community Expert
      November 9, 2023

      No, that's not it.

      Since you have 7 sequential dialogs it would be worth while to adopt a more indirect approach using abstraction and separation of data from function. Right now you are using a brute force approach that works forward only.  This strategy falls apart for the "back" button.  

       

      However, the  first thing to do is to work out the dialog operation, separate from the rest of the script.  Specifically, how to get a return value from pressing the "Other" button, which unlike "Ok" and "Cancel" doesn't automatically close the dialog, and therefore does not generate a return value. 

      Each element on a dialog has an associated trigger. For a button its the MouseUp. Each trigger executes a dialog object member function with the same name as the "item_id" of the element that genterates the trigger.     

      See the "Dialog box handlers" section of "app.execDialog" in the JavaScript reference. 

      In the case of the "ok_cancel_other" button group the "item_id" for the "other" button is "other". You need to create a function for this item_id that forces the dialog to close and return a value. 

      I've already provided the dialog function needed to make this work. Just try out the dialog by itself, with out any other code until the issue solved.  

       

       

      Thom Parker - Software Developer at PDFScriptingUse the Acrobat JavaScript Reference early and often
        try67
        Community Expert
        try67Community Expert
        Community Expert
        November 8, 2023

        It works fine for me, except for the Back button, which I assume you want to cause the first dialog to open again, right? You will need to add a condition to handle that, possible inside an endless loop, so that the user could go back and forth as much as they wish, until pressing OK or Cancel.

         

        I think this is very clunky, though. Why not use a single dialog for this?

        Turan_Elkhan
        Turan_ElkhanAuthor
        Inspiring
        November 9, 2023

        Firstly, thank you for your reply. Actually, the short example serves to explain my goal. The code which I have, is actually very complicated and too long (more than 1330 lines, so 7 dialogs).

         

        This is exactly what I need, as you described. I have already created several PDF forms, but with a single button, with several dialog boxes that appear one after the other. But to get to the first dialog, you have to click through everything and then click the button again to get to the first dialog. This is exactly what I want to avoid, so that I can go back (loop) if necessary and, no matter how much I want to change something, move on and click OK. After confirming "OK", the values from all dialogs should be applied as the users have typed the information.

         

        If you could give an example with my short code, I would be very grateful. 🙂

        A
        Asim123
        Inspiring
        November 8, 2023

        If you are a beginner, a custom dialog box is not an easy task to do, even for more experienced developers.

        What exactly you want next and back buttons to do?

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