Multi-check mark checkbox using javascript

Adlance96

26-07-2016

I am looking for a checkbox to create for the client. It will have three possibilities-On/off/neutral.

The On should be a "Check" mark.

The Off should be a "Cross" mark.

Lastly for the NA state, a "blank" selection or "NA" for the third.

I am unable to get any result. Could somebody please provide me with the code or a sample pdf to make this work.

Accepted Solutions (1)

Accepted Solutions (1)

mattiaswallin

01-08-2016

If I understand your question, you want to cycle through the same checkbox and want the icon in the checkbox to change between check, cross and an empty box?

If that is the case I managed to achieve that functionality with this code in the change event of the checkbox.

if (this.ui.oneOfChild.mark === "check" && this.rawValue == 0){
   this.ui.oneOfChild.mark = "cross";
   this.rawValue = 1;

    }

    else if (this.ui.oneOfChild.mark === "cross"){

   this.ui.oneOfChild.mark = "check";
   this.rawValue = 0;

    }

(the checkbox should be setup as a "on/off" checkbox with the "check" Check Style from the start).

This is a bad/ugly way of doing it, but it was the first that came to mind for me. However, this will cause you some extra issues if you have some form dependancies of this checkbox? As you wont have a "rawValue" for each state. But in that case I would rather use the "ui.oneOfChild.mark" property as an identifier of the state (or possibly set up an hidden numeric field that changes into a numeric identifier that changes in the actual change event.

If this answer was helpful, please mark it as correct, and if something is weird or if you just have any questions on the code, please feel free to ask.

Regards, Mattias.

Answers (16)

Answers (16)

mattiaswallin

01-08-2016

Yes, I think it will be easiest if you give me your mail and I will mail the example I have worked on. If you would prefer not to post it, you could just send an PM or something to me with your mail address.

Adlance96

01-08-2016

Nope, it is not working and yes, I have put the script in the change event of the checkbox, and the rest as you mentioned. I also have designer es2, but I am not getting the same output as you.

Can you send me the pdf you worked on??


mattiaswallin

01-08-2016

And just to make sure you have everything set up the same way as I do.

1. Do you have the script on the "change event" of the checkbox?

2. Is the Check Box set up as a on/off check box with the "Check" check style? (field palette)

3. Do you have the "On Value" as 1 and the "Off Value" as 0 ? (binding palette)

mattiaswallin

01-08-2016

Hmm okay, that's strange as it has the correct behaviour for me.. I have no clue as to why it would differ between the versions (I am sitting in Designer ES2). Do you have the possibility to upload your form and share the link here so I can have a look? Otherwise I can try make this code a bit more "rigid" aswell.

Adlance96

27-07-2016

if (this.rawValue === 1) {

   this.ui.oneOfChild.mark = "check";

}

if (this.rawValue === 2) {

   this.ui.oneOfChild.mark = "cross";

}

All I got till now is this, which does not work for me for some reason. Can you take a look at my form.

George_Johnson

26-07-2016

The code is in the file, most of it in document-level JavaScripts. The same thing won't work with LiveCycle Designer form, but there is a forum for it where you should ask about what's possible: LiveCycle Designer

George_Johnson

26-07-2016

There is no type of check box that behaves that way. You can fake it using buttons and JavaScript, as demonstrated in the following sample: http://acroscript.net/pdf/demos/multistate_4.pdf

You'll have to study it to see how it works. Note that you can only rely on this technique working with the desktop versions (Windows/Mac) of Adobe Reader and Acrobat, not other PDF viewers, mobile viewers in particular.