B4J Question [ABMaterial] ABMModalSheet (IsDismissible=True) and ABMDateTimePicker ESC handling

Discussion in 'B4J Questions' started by OliverA, Jun 11, 2019.

  1. OliverA

    OliverA Well-Known Member Licensed User

    Case: Using an ABMDateTimePicker control within an ABMModalSheet that has its IsDismissble property set to True

    Issue: When calendar pops up, clicking outside of the calendar does nothing (good). But when one presses the ESC key, the underlying modal sheet closes and the calendar remains.

    Expected/Wanted result: When the calendar is up and a user presses the ESC key, the calendar closes, or, at minimum, nothing else is affected when pressing the ESC key and the user just has to use the close button on the calendar to close the calendar.

    How can the expected/wanted result(s) be achieved?
     
  2. Cableguy

    Cableguy Expert Licensed User

    Try to catch the ModalSheet closing event to close the celendar too
     
    OliverA likes this.
  3. OliverA

    OliverA Well-Known Member Licensed User

    By that time it looks like the component is gone (unless I'm doing it wrong).
    Just before opening the modal sheet I have
    Code:
    Dim startDate As ABMDateTimePicker
    startDate.Initialize(
    page"startDateAUT", ABM.DATETIMEPICKER_TYPE_DATE, aDate, "Start date""")
    'Some more code
    modal.Content.Cell(2,1).AddComponent(startDate)
    'Some more code
    page.ShowModalSheetAbsolute("dataView""5%""5%""90%""90%")
    Page_ModalSheetDismissed code is
    Code:
    Sub page_ModalSheetDismissed(Target As String)
       
    Log("Modal dismissed: " & Target)
       
    If Target.EqualsIgnoreCase("dataview"Then
           
    Dim datePicker As ABMDateTimePicker = page.Component("startDateAUT")
           
    If datePicker <> Null And datePicker.IsInitialized And datePicker.Enabled Then
               
    Log("Trying to close datePicker")
               datePicker.Visibility = 
    False
           
    End If
       
    End If
       isModalOpen = 
    False   
    End Sub
    Note to code above: I have no clue if it is the Visibility that would close the datePicker object
    The log shows
     
  4. Cableguy

    Cableguy Expert Licensed User

    Hugh... Isn't the dataview a ModalSheet component? You are trying to get it from the page, and obviously it doesn't "live" there!
     
    OliverA likes this.
  5. OliverA

    OliverA Well-Known Member Licensed User

    Yes.
    Updated code:
    Code:
    Sub page_ModalSheetDismissed(Target As String)
       
    Log("Modal dismissed: " & Target)
       
    If Target.EqualsIgnoreCase("dataview"Then
           
    Dim model As ABMModalSheet = page.ModalSheet("dataview")
           
    Dim datePicker As ABMDateTimePicker = model.Content.Cell(2,1).Component("startDateAUT")
           
    If datePicker <> Null And datePicker.IsInitialized And datePicker.Enabled Then
               
    Log("Trying to close datePicker")
               datePicker.Visibility = 
    "hidden"
           
    End If
       
    End If
       isModalOpen = 
    False   
    End Sub
    No I at least get the following log entry
    I tried
    datePicker.Visibility = False
    datePicker.Visibility = "none"
    datePicker.Visibility = "hidden"
    datePicker.Enabled = False
    without getting the calendar to close. Hm...
     
  6. Cableguy

    Cableguy Expert Licensed User

    At least now you are getting the dataview correctly...
    I'm not near my computer now so I cannot assist further, but I know for a fact that many times with ABM the solution is simply eluding
     
    OliverA likes this.
  7. alwaysbusy

    alwaysbusy Expert Licensed User

    Maybe after dataPicker.Visibility do a datePicker.Refesh because the browser doesn't know it yet that you changed the setting?
     
    OliverA likes this.
  8. OliverA

    OliverA Well-Known Member Licensed User

    That did not work neither. What does the trick is
    Code:
    model.Content.Cell(2,1).RemoveComponent("startDateAUT")
    The page_ModalSheetDismissed now looks like this
    Code:
    Sub page_ModalSheetDismissed(Target As String)
       
    Log("Modal dismissed: " & Target)
       
    If Target.EqualsIgnoreCase("dataview"Then
           
    Dim model As ABMModalSheet = page.ModalSheet("dataview")
           
    If model.Content.Cell(2,1).Component("startDateAUT") <> Null Then
               model.Content.Cell(
    2,1).RemoveComponent("startDateAUT")
           
    End If
       
    End If
       isModalOpen = 
    False   
    End Sub
    Opinion: I still would like it better that the ESC button would either close the ABMDateTimePicker component or just plain do nothing. I just seems weird that a user opens the calendar, presses escape and the whole behind the calendar modal dialog disappears. Would this be a valid WISH in the feedback app or is there something else that can be done?
     
  9. Cableguy

    Cableguy Expert Licensed User

    Question : how does the dataview behave when you call the ModalSheet again after having dismissed it once, this removing it from the ModalSheet?
     
  10. OliverA

    OliverA Well-Known Member Licensed User

    Currently, when I build the modal sheet, the content portion of the modal sheet is just
    Code:
    modal.Content.AddRowsM2(3False0000,"").AddCells12(1,"")
    modal.Content.BuildGrid
    Before showing the modal sheet, I fill the rows as needed. For example, in this case I use all 3 rows (first row is the header, second row is optional for, well, options, and third row is for content):
    Code:
    modal.Content.Cell(1,1).RemoveAllComponents
    modal.Content.Cell(
    1,1).AddComponent(lbl)
    modal.Content.Cell(
    2,1).RemoveAllComponents
    modal.Content.Cell(
    2,1).AddComponent(startDate)
    modal.Content.Cell(
    2,1).AddComponent(stopDate)
    modal.Content.Cell(
    3,1).RemoveAllComponents
    modal.Content.Cell(
    3,1).AddComponent(tblUsers)
    So, deleting the component in page_ModalSheetDismissed does not affect the next displaying of the modal sheet. Come to think of it, maybe I should use page_ModalSheetDismissed to clear the modal of it's contents instead of doing it in the sub(s) that populate and display the modal sheet (this way there is one place where it gets done).
     
  11. alwaysbusy

    alwaysbusy Expert Licensed User

    This should close the DatePicker:

    Code:
    Sub page_ModalSheetDismissed(Target As String)
       
    Log("Modal dismissed: " & Target)
       
    If Target.EqualsIgnoreCase("dataview"Then
           
    Dim model As ABMModalSheet = page.ModalSheet("dataview")
           
    Dim datePicker As ABMDateTimePicker = model.Content.Cell(2,1).Component("startDateAUT")
           
    If datePicker <> Null And datePicker.IsInitialized And datePicker.Enabled Then
               
    Log("Trying to close datePicker")
               
    page.ws.Eval("$('#" & datePicker.ID  & "').bootstrapMaterialDatePicker('hide', '');"Null)
               
    page.ws.Flush
           
    End If
       
    End If
       isModalOpen = 
    False  
    End Sub
     
    Cableguy and OliverA like this.
Loading...
  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Dismiss Notice