[Resolved] Modal display of post form parent selection not working

[Author]

Posts

[tony]

Hi Luo

The video does not show the modal extending down the screen so that you need to scroll down to see the model footer.

Please can you have another look - just zoom your screen so that it does not fit like the example image.

If the modal is contained within the screen it works fine. If not contained the select choice is limited to the 10 displayed items.

Many thanks
Tony

PS I tested my other website and it has the same problem. Both are on the same server under different accounts.

[Luo Yang]

I have tested it again, but can not see the same problem as your description:
- scroll down to see the model footer.
- zoom your screen so that it does not fit like the example image
see the new video capture:
hidden link
File:
testpage – Teesdale Local - Mozilla Firefox 2019-12-26 10-45-55

if you need more assistance for it, please provide a test site with the same problem. thanks

[tony]

Hi Luo

The modal is still contained within the screen depth in the video.

Please can you add 5 or 6 extra fields so that the form is very long and try again.

Sorry but I am not sure we are looking at the same thing.

If that works. Try the live website with the same login credentials - it is only in test mode at present and so feel free to alter things.

KInd regards
Tony

[Luo Yang]

I was using the duplicator package you provided above, did not add any more fields in it.
https://toolset.com/forums/topic/modal-display-of-post-form-parent-selection-not-working/#post-1422575

I have tried it again, with below steps, please correct me if there is any missing:
1) Edit post form "Add Org-Venue TEST", add 10 more fields into the form content
2) Test it in front-end:
hidden link
3) Resize the browser window to small size(414 *736)
4) test it in field "Places Organisation-Venues", it works just fine

So please provide the duplicator package with the same problem, also provide the detail steps to reproduce problem. thanks

[tony]

Hi Luo and sorry about this - it is looking like a local problem here.

If you log into our live site hidden link using the same login details as in the duplicator.

Then go to test page as before and see if the form is working for you in Firefox. The form is long and so there is no need to change the screen size. All above in Firefox.

Many thanks
Tony

[Luo Yang]

Thanks for the details, you are right, it is the same probelm as the select2 document:
hidden link

I have done below modifications in your website:
1) Edit the post form "Add Org-Venue TEST":
in JS editor, add below JS codes:

jQuery(document).on( 'cred_form_ready', function($) {  
        // ALL YOUR CRED form JS code goes here. Add your JS code here
    jQuery.fn.modal.Constructor.prototype.enforceFocus = function() {}
});

2) Test it in front-end:
hidden link
click button "Add Organisation-Venue"

I can see that select2 field works fine. can you confirm it? thanks

[tony]

Hi Luo

Many thanks - the fix has worked fine so we got there inthe end.

I do appreciate your support and willingness to see things through to a good conclusion.

Kind regards
Tony

[tony]

What a star! Your support is much appreciated.
Tony

[Christian Cox]

Note that in Bootstrap 4 modals, the enforceFocus function has an underscore prefix:

jQuery.fn.modal.Constructor.prototype._enforceFocus = function() {};

[tony]

Thank you Christian

It is good to know the code is different for bootstrap 4.

I am using bootstrap 3 so all is well.

Kind regards
Tony