Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

Change button background fill property

Avatar

Level 2

Hi,

I'm building a dynamic form and I have a requirement to change button background fill style from Linear to Solid using javascript. I'm using Linear style to represent active button and Solid style for inactive buttons. Can someone please help me with sample script?

Thank you,

Sandeep

0 Replies

Avatar

Level 10

Hi Sandeep,

Maybe this post by Stefan Cameron will help, read down in the comments.

Regards

Bruce

Avatar

Level 10

Hi,

Sorry about that, the link is http://forms.stefcameron.com/2008/03/14/field-background-color-fill/

Basically you have to create for the form DOM elements, a bit more code than just setting the colors.

Bruce

Avatar

Level 2

Thanks Bruce!

I used Stefan's code and made a small change to make it work for a button.

// create start color

var startColorNode = xfa.form.model.createNode("color");

startColorNode.value = "255,255,0";

// create end color

var endColorNode = xfa.form.model.createNode("color");

endColorNode.value = "255,255,255";

 

// create linear node for fill type

var linearNode = xfa.form.model.createNode("linear");

linearNode.type = "toTop";                                                                            // start on bottom, end on top

linearNode.nodes.append(endColorNode);                                         // add end color

// create fill node for button

var fillNode = xfa.form.model.createNode("fill");

fillNode.nodes.append(startColorNode);                                                   // add start color

fillNode.oneOfChild = linearNode;                                                             // add fill type

 

buttonName.border.nodes.append(fillNode);                                   //Use this to Apply fill color

buttonName.border.nodes.remove                     //Use this to Remove fill color

    (

               buttonName.border.resolveNode("#fill")

    );

Thanks,
Sandeep