Announcement

Collapse
No announcement yet.

Select2 Fails in Form Application Detail Form

Collapse
X
  • Filter
  • Time
  • Show
Clear All
new posts

  • Select2 Fails in Form Application Detail Form

    Hi,

    I have a form. It has a detail form linked to a grid application where all features are activated. In the grid application, new record would open in modal and this is where im having the problem whenever the select fields use Select2. select field do not show the lists to choose from.

    Screen Shot 2019-02-12 at 06.37.52.png

  • #2
    Yep modal in SC can break Select2 elements.
    If you can, change the grid so that the form is not open as modal.
    Another workaround is to inject JS code to make the form reload once on load. Before doing that, manually test that a reload fix the issue (in Chrome you can right click on the modal form and select "reload frame")

    Comment


    • #3
      Hi, I have the same exact issue (it only happens with chrome)
      can you tell me what JS code to inject in the OnLoad event for the modal?

      Comment


      • #4
        Use this:

        https://stackoverflow.com/a/28479618

        As per any JS code that needs to interact with window elements, it must be executed when the window has finished loading, so you have to put it where the "....." are in the code below

        Code:
        ?>
        <script>
        window.onload = function()
        {
           .......
        }
        </script>
        <?php

        Note that the "reload" string is just an identifier.
        I'm not 100% sure, but I think its' safer if it's unique, so if you use this code in more than one app you can customize it per app; e.g. using or adding the app name in it, instead of just 'reload'.

        Comment


        • #5
          so let me get this straight, if I understood correctly, let's say I have a Grid application called "Grid_Items", and on that grid there is a button that opens a modal to add a new record, the app that gets called in the modal is a Form called "Add_grid_item".

          So in my case, I should edit my "Add_grid_item" Form, which is the one opened in a modal,
          and there add under Events -> OnLoad, this:

          Code:
           ?> <script>
          window.onload = function() {
            if (!localStorage.getItem("Add_grid_item")) {    
                    localStorage.setItem("Add_grid_item", "true");    
                    location.reload();
            } else {    
                    localStorage.removeItem("Add_grid_item");
          }  
            }
          </script>
          <?php
          so instead of "reload" string, I swap it with the name of the Form app that gets loaded in the modal?

          Thank you

          Comment


          • #6
            The string can be whatever you like, my suggestion is to use a unique string per app so that's why I'm using the app name.
            E.g. you coud use "reload_Add_grid_item". Or just the app name as you did.

            Also note that what makes the JS code work at the right moment is the embedding in the JS window.onload event, so you could add that JS code event is the onScriptInit SC event instead of the SC onLoad event and it would still work

            If you don't want this reload event to occur when the form is not run as modal, you could embed all your code above in a check for a passed var and act accordingly.
            E.g. pass "force_reload" = 1 when open as modal and pass nothing when open not as modal
            Code:
            if ([force_reload])
            {
                ?>
                <script>
                   ......
                </script>
                <?php
                sc_reset_global([force_reload]);
            }

            Comment

            Working...
            X