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.
Copy link to clipboard
Copied
This forum is about JavaScript in PDF files created in Adobe Acrobat.
Copy link to clipboard
Copied
So where should I post this question?
Copy link to clipboard
Copied
How about on a forum that is about HTML JavaScript/JQuery