HTML Elements Forums Window & Popups Window drop down list selection is closing smart-window

This topic contains 4 replies, has 2 voices, and was last updated by Avatar Yavor Dashev 2 weeks ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #101298
    Avatar
    davout
    Participant

    In an earlier forum posting I asked whether the ‘smart-window’ component was a good choice for a floating data entry window in my Angular app.   The answer from you was ‘yes’

    The basic use case is that the main Angular window is showing a list of entries.  When I select an entry,  the ‘smart-window’ component is displayed to show the details of the just selected entry

    I now have a form displaying in the entry details, but I have two problems

    First, the form includes a ‘smart-drop-down-list’ towards the bottom left of the form.  If I click on the select button the drop down list appears but it is clipped by the smart window and a vertical scroll bar appears in the smart window

    However, the more significant lies with the selection of an item from the smart-drop-down-list.   As soon as I select an item the smart-window is closed.  What I want is for the smart window to stay visible at all times,  until either the form ‘save’ button or the form ‘x’ close window button is clicked.

    Any suggestions?

     

    #101299
    Avatar
    Yavor Dashev
    Participant

    Hi davout,

    I have tried to recreate the situation you have described but I was unable to encounter the problem you described.

    I would suggest you to share the code for this particular situation in order to be able to come up with a solution for your case.

    Please, do not hesitate to contact us if you have any additional questions.

    Best regards,
    Yavor Dashev

    Smart UI Team
    https://www.htmlelements.com/

    #101300
    Avatar
    davout
    Participant

    Hi,

    Tracing this further I have found that if a ‘smart-window’ includes a ‘smart-drop-down-list’ inside a form,  then when I change/select a new drop down item then this is generating  ‘smart-window’  level ‘onClosing’ and ‘onClose’ event calls.   Is this a bug?

    (I would attach a screenshot, but I can’t find a way of copy/pasting images into this forum message)

    It’s no clear from your docs how I would stop a window closing via a ‘onClosing’ event handler.  The code below shows my current handler.

    onClosing(event: CustomEvent): void {
      console.log('onclosing ', event);
    }
    
    How would I be able to detect 'onClosing' calls that were generated by the drop-down-list versus the smart window itself?
    
    

     

     

    #101303
    Avatar
    davout
    Participant

    I’ve found that I can use the following code to check what component originated the ‘onClose’ call

    onClose($event, fromWindow: boolean): void {
    if (($event.srcElement as Element).id === ‘smartWindow’) {
    this.taskEditService.hide();
    }
    }

    Is that the best approach?

    Also, how do I block closing inside the ‘onClosing’ event handler?

    #101305
    Avatar
    Yavor Dashev
    Participant

    Hi davout,

    You can use ‘event.target’ to check from where the event is coming from, also you use event.preventDefault() and event.target can be the window or another component that is inside the window that fires the same event.
    For example:

    onClose(event): void {
    const smartWindow = this.smartWindow;
    if (event.target === smartWindow.nativeElement) {
    event.preventDefault()
    }
    }

    Please, do not hesitate to contact us if you have any additional questions.

    Best regards,
    Yavor Dashev

    Smart UI Team
    https://www.htmlelements.com/

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.