Color swatch : The values of color fields are getting overriden after saving the values in dialog

New Here ,
Aug 03, 2018

Copy link to clipboard

Copied

I have an image component which has two color fields "background color" and "border color". Initially when opening the dialog and selecting the value, the color swatch is working fine. But once I have saved the values in dialog, on opening it again the value of background color is overriding the value of border color. I have written a custom colorpicker.js. The code is

$(document).on("click", ".bgColor ul", function(e) {

      var dropdown=$(this).parent().closest('span').find('ul');

      var button=$(this).parent().closest('span').find('button');

       var hexcode =$(this).parent().closest('span').find('select');

       touchDialog.colorDropDown(dropdown,button,hexcode);

});

$(document).on("foundation-contentloaded", function(e) {

     var dropdown = $('.bgColor ul');

     var button = $('.bgColor button');

     var hexcode = $('.bgColor select');

  touchDialog.colorDropDown(dropdown,button,hexcode);

});

var touchDialog = { 
   colorDropDown : function(dropdown,button,hexcode) {

        var hexcode = hexcode;
         var dropdown = dropdown; 
         var button = button;
         if(dropdown != undefined || dropdown != null){
             var childlist = dropdown.children();
             var hexcodelist = hexcode.children();
             if (childlist.length > 1) { 
               for (i = 0; i < childlist.length; i++) { 
                 var attr = hexcodelist.getAttribute("data-hexcode");
                 if (attr) {  
                   $(childlist).css("background-color", attr); 
                   $(childlist).css("border-style", "solid"); 
                 } 
                 if($(childlist).hasClass("is-highlighted")&& attr){ 
                   $(button).css("background-color", attr); 
                 } 
                   if(!attr){
                    var color = hexcode.children('option:selected').data('hexcode') ;
                       $(button).css("background-color", "transparent");
                      $(button).css("background-color", color);
                  }
              }
           }
       }
    }
};

Is there any way on how we can properly save the values of color fields without overriding the other field. Please find the attached snapshot as well.

image_dialog.PNG

TOPICS
Acrobat SDK and JavaScript

Views

171

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Color swatch : The values of color fields are getting overriden after saving the values in dialog

New Here ,
Aug 03, 2018

Copy link to clipboard

Copied

I have an image component which has two color fields "background color" and "border color". Initially when opening the dialog and selecting the value, the color swatch is working fine. But once I have saved the values in dialog, on opening it again the value of background color is overriding the value of border color. I have written a custom colorpicker.js. The code is

$(document).on("click", ".bgColor ul", function(e) {

      var dropdown=$(this).parent().closest('span').find('ul');

      var button=$(this).parent().closest('span').find('button');

       var hexcode =$(this).parent().closest('span').find('select');

       touchDialog.colorDropDown(dropdown,button,hexcode);

});

$(document).on("foundation-contentloaded", function(e) {

     var dropdown = $('.bgColor ul');

     var button = $('.bgColor button');

     var hexcode = $('.bgColor select');

  touchDialog.colorDropDown(dropdown,button,hexcode);

});

var touchDialog = { 
   colorDropDown : function(dropdown,button,hexcode) {

        var hexcode = hexcode;
         var dropdown = dropdown; 
         var button = button;
         if(dropdown != undefined || dropdown != null){
             var childlist = dropdown.children();
             var hexcodelist = hexcode.children();
             if (childlist.length > 1) { 
               for (i = 0; i < childlist.length; i++) { 
                 var attr = hexcodelist.getAttribute("data-hexcode");
                 if (attr) {  
                   $(childlist).css("background-color", attr); 
                   $(childlist).css("border-style", "solid"); 
                 } 
                 if($(childlist).hasClass("is-highlighted")&& attr){ 
                   $(button).css("background-color", attr); 
                 } 
                   if(!attr){
                    var color = hexcode.children('option:selected').data('hexcode') ;
                       $(button).css("background-color", "transparent");
                      $(button).css("background-color", color);
                  }
              }
           }
       }
    }
};

Is there any way on how we can properly save the values of color fields without overriding the other field. Please find the attached snapshot as well.

image_dialog.PNG

TOPICS
Acrobat SDK and JavaScript

Views

172

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Aug 03, 2018 0
Most Valuable Participant ,
Aug 03, 2018

Copy link to clipboard

Copied

This forum is about JavaScript in PDF files created in Adobe Acrobat.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Aug 03, 2018 0
New Here ,
Aug 04, 2018

Copy link to clipboard

Copied

So where should I post this question?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Aug 04, 2018 0
Adobe Community Professional ,
Aug 04, 2018

Copy link to clipboard

Copied

How about on a forum that is about HTML JavaScript/JQuery

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Aug 04, 2018 0