Trying too add a button too the Lightbox

Scheduler Javascript
#1

Dear DHtmlx Support,
I have tried to add a button too the lightbox as directed in the following URL:

docs.dhtmlx.com/doku.php?id=dhtm … ion_header

to make thinks simple, I implemented the code as follows:

        scheduler.config.lightbox.sections = [
            { name:"description", map_to:"text", type:"textarea", focus:true, button:"help"},
        scheduler.locale.labels.button_help="Help label";
        
        scheduler.form_blocks.textarea.button_click=function(index, src, sec, data){
                 //called on button click
                 // index - index of section
                 // sec - html element of section header
                 // sec - html element of section editor
                 alert('work');
        }

And within my CSS document, I added the following style:

.dhx_custom_button_help
{
       background-image: url(imgs/help.gif);
}

And I cant get the button too pop up. I tried assigning an absolute URL too the background image, rather than a relative URL, and that made no difference.

Any help would be greatly appreciated.
Kind regards
Greg Goldberg

#2

Hello, Greg Goldberg.

Thank you for pointing our attention to this issue :slight_smile:

And I cant get the button too pop up.

Button should be displayed correctly with the text defined in the scheduler.locale.labels.button_help variable. But indeed icon for it won’t be displayed:
Right now it uses name of the section instead of button in the CSS class:
.dhx_custom_button_description instead of .dhx_custom_button_help

Fix will be included in the upcoming version though you can apply it yourself right now:

  1. Open dhtmlxscheduler.js
  2. Locate
scheduler._get_lightbox=function(){

function declaration.
3. Locate following part (variable names may differ):

if (sns[i].button) button = "<div style='float:right;' class='dhx_custom_button' index='"+i+"'><div class='dhx_custom_button_"+sns[i].button+"'></div>

and change

<div class='dhx_custom_button_"+sns[i].name+"'></div>

with

<div class='dhx_custom_button_"+sns[i].button+"'></div>

Now your CSS class styles will be applied but image still won’t be displayed as you also need to specify it sizes (height, width).

Hope this helps.

Best regards,
Ilya

#3

Hi Ilya,
Thanks for your advice, pointing me to that scope of the code managed to resolve my issue. To do this, I had to make the following change to the code. The code you mentioned is now

            if(E[B].button)
            {
                A="<div style='float:right;'  class='dhx_custom_button' index='"+B+"'><div class='dhx_custom_button_"+E[B].button+"'></div><div>"+this.locale.labels["button_"+E[B].button]+"</div></div>";
            }

however, I also had to change the following code (The next line)

C+="<div id='"+E[B].id+"'  style='display:none' class='dhx_cal_lsection'>"+A+this.locale.labels["section_"+E[B].name]+"</div>"+F.render.call(this,E[B]);

so that it is:

C+="<div id='"+E[B].id+"' class='dhx_cal_lsection'>"+A+this.locale.labels["section_"+E[B].name]+"</div>"+F.render.call(this,E[B]);

Thanks for all your great help, as usual.
Kind regards
Greg Goldberg

P.S. This is probably a fix i implemented too hide the section text.