Datatable modal custom editor

Hi,

I'm struggling to make my custom editor modal. The screen opacity changes behind the popup but a user can still click outside the popup to close it.

The following snippet shows the issue.

https://webix.com/snippet/b59b8463

Any help would be great.

Thanks,

Chris

Comments

  • edited August 2017

    Hey,
    you can try this -

    webix.ui({ 
            view:"window",
            id:"editWindow",
            head:'Edit',
            modal:true,
            height:500,
            width:500,
            body:{
                view:"form",
                id:"form", 
                scroll:false,
                elements:[
                          { view:"text"},
                          {
                              view:"button",
                              value:"Close", 
                              click : function(){
                                  $$('editWindow').hide();
                              } 
                          } 
                          ],
            }
        });
    
    webix.ui({
      rows:[
        { type:"header", template:"Preview" },
        { view:"resizer" },
        { view:"datatable",
         id:'grid1',
         select:true,
         editaction:"dblclick",
         columns:[{id:"name", header:"name", editor:"popup"}],
         data:[{id:1,name:"John"}],
        on : {
                                "onItemDblClick" : function(id, ev){
                                    $$("editWindow").show(ev);
                                    $$("editWindow").getBody().focus();
                                }, 
        },
        "onAfterSelect" : function(data, preserve){
                                    $('form').bind('grid1');
                                }}
      ]
    });
    
  • Hi Meera,

    Thanks for your reply. I wanted to avoid show(ev) because I didn't like the window/popup jumping to the 'click' - I never realised the importance of bind().

    Thanks very much for pointing me in the right direction!

    Chris

Sign In or Register to comment.

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!