Skip to main content
Turan_Elkhan
Turan_Elkhan
Inspiring
May 14, 2023
Answered

javascript code trouble with dialog box Adobe Acrobat

  • May 14, 2023
  • 2 replies
  • 6642 views

I have a PDF form with a text field named "Documents" and a button named "Button". When the button is clicked, a JavaScript window appears to select some values, click OK, the selected values should be returned to the text field named "Documents". This code works, but it does not return the selected values (Your ID Card,  Your Name) to the text field. Can someone please help me? I am an amateur 😞

var FormRouting =
{
    result:"cancel",
    DoDialog: function(){return app.execDialog(this);},
    bChk1:false,
    bChk2:false,
    initialize: function(dialog)
    {
        var dlgInit = 
        {
            "Chk1": this.bChk1,
            "Chk2": this.bChk2
        };
        dialog.load(dlgInit);
    },
commit: function(dialog)
{
    var thisForm = this.getField(this.name); // Add this line
    var oRslt = dialog.store();
    this.bChk1 = oRslt["Chk1"];
    this.bChk2 = oRslt["Chk2"];

    // Create a list of selected checkboxes
    var selectedValues = [];
    if (this.bChk1) selectedValues.push("Your ID Card");
    if (this.bChk2) selectedValues.push("Your Name");

    // Set the value of the "Documents" text field to the selected values
    var field = thisForm.getField("Documents"); // Modify this line
    if (field) {
        field.value = selectedValues.join(", ");
    }
},

    description:
    {
        name: "Select",
        elements:
        [
            {
                type: "view",
                elements:
                [
                    {
                        type: "view",
                        char_height: 10,
                        elements:
                        [
                            {
                                type: "static_text",
                                item_id: "stat",
                                name: "Select",
                                char_width: 15,
                                alignment: "align_fill",
                                font: "dialog",
                            },
                            {
                                type: "view",
                                char_width: 8,
                                char_height: 8,
                                align_children: "align_top",
                                elements:
                                [
                                    {
                                        type: "view",
                                        char_width: 8,
                                        char_height: 8,
                                        elements:
                                        [
                                            {
                                                type: "check_box",
                                                item_id: "Chk1",
                                                name: "Your ID Card",
                                            },
                                            {
                                                type: "check_box",
                                                item_id: "Chk2",
                                                name: "Your Name",
                                            },
                                        ]
                                    },
                                ]
                            },
                            {
                                type: "ok_cancel",
                            },
                        ]
                    }
                ]
            }
        ]
    }
};

FormRouting.bChk1 = false;
FormRouting.bChk2 = false;
if("ok" == FormRouting.DoDialog())
{
    console.println("Chk1:" + FormRouting.bChk1);
    console.println("Chk2:" + FormRouting.bChk2);
}

 

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

    Following your recommendation, I downloaded the JavaScript for Acrobat® API Reference guide and achieved what I wanted. After setting the item_id 4 character, everything worked like a charm. Thank you very much for your advice. Give me, please 🙏 one last advice or example. How can I change font type, color, size of every checkbox and category elements in dialog window? I have tried but no success.

     

     


    The custom JavaScript dialogs have a limited set of options. The fonts are the fonts that are setup on the OS for dialogs. There are some general variations, such as "dialog" and "palette", which are listed in the reference, and there are others such as "heading" and "title" that are undocumented.  But that's as specific as it gets and there are no color variations, except, for an undocumented function that sets text to red. 

     

    All items on the dialog have height and width properties. But some things are fixed, such as checkboxes. 

     

    So not much to work with. 

     

     

     

    2 replies

    try67
    Community Expert
    try67Community Expert
    Community Expert
    May 15, 2023

    You need to either pass a reference to the Document object to the dialog (or use the parent property), or save the values from the Dialog to variables with a larger scope, and then apply them to the fields outside the Dialog object itself.

    Turan_Elkhan
    Turan_ElkhanAuthor
    Inspiring
    May 15, 2023

    Thank you too for your effort and the time you took to respond to my post. II tried but without success 😞

     

     

     

    var FormSelect = {
  result: "cancel",
  doDialog: function() {
    return app.execDialog(this);
  },
  bChk1: false,
  bChk2: false,
  bChk3: false,
  initialize: function(dialog) {
    dialog.load({
      Chk1: this.bChk1,
      Chk2: this.bChk2,
      Chk3: this.bChk3,
    });
  },
  commit: function(dialog) {
    var oRslt = dialog.store();
    this.bChk1 = oRslt.Chk1;
    this.bChk2 = oRslt.Chk2;
    this.bChk3 = oRslt.Chk3;
  },
};

var description = {
  name: "Your Hobbies!",
  elements: [
    {
      type: "view",
      elements: [
        {
          type: "view",
          char_height: 10,
          elements: [
            {
              type: "static_text",
              item_id: "stat",
              name: "Your Hobbies!",
              char_width: 15,
              alignment: "align_fill",
              font: "dialog",
            },
            {
              type: "view",
              char_width: 8,
              char_height: 8,
              align_children: "align_top",
              elements: [
                {
                  type: "view",
                  char_width: 8,
                  char_height: 8,
                  elements: [
                    {
                      type: "check_box",
                      item_id: "Chk1",
                      name: "☒ Sport",
                    },
                    {
                      type: "check_box",
                      item_id: "Chk2",
                      name: "☒ Cinema",
                    },
                    {
                      type: "check_box",
                      item_id: "Chk3",
                      name: "☒ Swimming",
                    },
                  ],
                },
              ],
            },
            {
              type: "ok_cancel",
            },
          ],
        },
      ],
    },
  ],
};

// Variables to store the dialog values with larger scope
var dialogResult = null;
var dialogChk1 = false;
var dialogChk2 = false;
var dialogChk3 = false;

FormSelect.bChk1 = false;
FormSelect.bChk2 = false;
FormSelect.bChk3 = false;

// Update the commit function to save the dialog values to variables
FormSelect.commit = function(dialog) {
  var oRslt = dialog.store();
  dialogChk1 = oRslt.Chk1;
  dialogChk2 = oRslt.Chk2;
  dialogChk3 = oRslt.Chk3;
};

if ("ok" == FormSelect.doDialog()) {
  // Save the dialog result
  dialogResult = "ok";

  // Apply the dialog values to fields outside the dialog
  FormSelect.bChk1 = dialogChk1;
  FormSelect.bChk2 = dialogChk2;
  FormSelect.bChk3 = dialogChk3;

  // Code to execute if the dialog result is "ok"
}

     

     

    Thom Parker
    Community Expert
    Thom ParkerCommunity Expert
    Community Expert
    May 15, 2023

    There's no checkbox example in the "Popup Window Part 5" tutorial. And the modification in the original code posted is kinda sophisticated for someone who doesn't know anything about JavaScript.  

     

    However, that example PDF does have a great sample showing how to move data from the dialog, and into a form field. None of your modifications come even close to the pattern shown in that example. I'd strongly suggest you study it. 

     

     

    Thom Parker - Software Developer at PDFScriptingUse the Acrobat JavaScript Reference early and often
    Thom Parker
    Community Expert
    Thom ParkerCommunity Expert
    Community Expert
    May 15, 2023

    Looks like you must have an old copy of the AcroDialogs plug-in. 

    Nice modification of the dialog object code, but there is one major issue with it. In the commit function, the "thisForm" variable does not exist. This error would have been reported in the Console Window. What kind of debug have you done?

    An easy fix is to define this variable before displaying the dialog. 

     

    The real fix is move the added portion of the commit function code outside the dialog object, and into the "if" where the dialog is displayed. 

     

     

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

    Thank you for your effort and the time you took to respond to my post. Unfortunately I am not able to fix it ☹, since I am not a programmer, I can not also to fix it also using Google, search in the forums etc. Actually, I am willing to make a small donation with PayPal if someone would correct this code for me. Next step would be categories and subcategories. The selected Checkbox values should be returned or printed into the text field "Documents".

     

    For Example:

    1. under Personality "Your Name", "Your Country"

    2. under Hobbies "Sport", "Cinema"

    3. and so on...

     

    I'm doing it for my friend, since I promised him I would create this form, even though I'm not able to. He actually has all these items in a list box that can be selected on each line. But I wanted to do it with a dialog box since I downloaded your sample file here https://acrobatusers.com/tutorials/popup_windows_part5/ 

    I have also modified my code a little bit as below and I got errors:

    TypeError: dialog.getField is not a functionMakeChoices.commit@Field:Mouse Up:13
MakeChoices.DoDialog@Field:Mouse Up:30
@Field:Mouse Up:81
TypeError: dialog.getField is not a function
13:Field:Mouse Up

     

    var MakeChoices = {
  result: "cancel",
  bChk1: false,
  bChk2: false,
  initialize: function(dialog) {
    var dlgInit = {
      "Chk1": this.bChk1,
      "Chk2": this.bChk2
    };
    dialog.load(dlgInit);
  },
  commit: function(dialog) {
    var thisForm = dialog.getField(this.name);
    var oRslt = dialog.store();
    this.bChk1 = oRslt["Chk1"];
    this.bChk2 = oRslt["Chk2"];

    // Create a list of selected checkboxes
    var selectedValues = [];
    if (this.bChk1) selectedValues.push("Your ID Card");
    if (this.bChk2) selectedValues.push("Your Name");

    // Set the value of the "Documents" text field to the selected values
    var field = thisForm.getField("Documents");
    if (field) {
      field.value = selectedValues.join(", ");
    }
  },
  DoDialog: function() {
    return app.execDialog(this);
  },
  description: {
    name: "Select",
    elements: [{
      type: "view",
      elements: [{
        type: "view",
        char_height: 10,
        elements: [{
            type: "static_text",
            item_id: "stat",
            name: "Select",
            char_width: 15,
            alignment: "align_fill",
            font: "dialog",
          },
          {
            type: "view",
            char_width: 8,
            char_height: 8,
            align_children: "align_top",
            elements: [{
                type: "view",
                char_width: 8,
                char_height: 8,
                elements: [{
                    type: "check_box",
                    item_id: "Chk1",
                    name: "Your ID Card",
                  },
                  {
                    type: "check_box",
                    item_id: "Chk2",
                    name: "Your Name",
                  },
                ]
              },
            ]
          },
          {
            type: "ok_cancel",
          },
        ]
      }]
    }]
  }
};

MakeChoices.bChk1 = false;
MakeChoices.bChk2 = false;
if ("ok" == MakeChoices.DoDialog()) {
  // Access the value of the "Documents" text field
  var documentsField = this.getField("Documents");
  if (documentsField) {
    documentsField.value = MakeChoices.description.elements[0].elements[1].elements[0].elements[0].name +
      ": " + (MakeChoices.bChk1 ? "Checked" : "Unchecked") + "\n" +
      MakeChoices.description.elements[0].elements[1].elements[0].elements[1].name +
      ": " + (MakeChoices.bChk2 ? "Checked" : "Unchecked");
  }
}

     

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