pcattani asked 3 years ago
I have three datepickers I’m using in a modal edit form. The first two datepickers work fine, but the third one doesn’t work.
When I try to use the third datepicker, I can browse a new date normally, but when I click on the date, the form scrolls to the top of the screen and the new date is not selected.
I think this may have something to do with it being a field which is offscreen and you have to scroll down to use it.
I am styling the form grid heights manually using:
.FormGrid {
height: 800px !important;
}
So that the scroll bars appear. This is the only relevant information I can think of at this time.
Any ideas how to fix?
pcattani answered 3 years ago
Update: I changed another field after the first two dates to a datepicker, and it behaves normally. So this lends more credence to the idea that it has something to do with the form being scrolled down. One other thing: I was wrong, the date on the weird datepicker *does* update when it is selected. It\\\’s just that the form scrolls to the top for some reason.
Abu Ghufran Staff answered 3 years ago
Hi,
This is a known issue and a quick fix is to set dialog modal to false:
$opt["add_options"]["modal"] = false; $opt["edit_options"]["modal"] = false; ... $g->set_options($opt);
Update: New solution retains modal dialog behavior and enable datepickers:
$opt["add_options"]["jqModal"] = false; $opt["edit_options"]["jqModal"] = false; ... $g->set_options($opt);
pcattani answered 3 years ago
Hi Abu, Thanks for the reply. Yes, that does fix the problem. Unfortunately, it\’s not a great idea to have a click outside the form cancel the form. Users could have entered a lot of information in that area. Is there any javascript hack you\’re aware of that would prevent a click from closing the form? Thanks again, pcattani
Abu Ghufran Staff answered 3 years ago
After your request, i reviewed the solution further and found a better solution.
Instead of above said “modal” property, if you set “jqModal” following to false, it will still behave as modal with working datepickers.
$opt["add_options"]["jqModal"] = false; $opt["edit_options"]["jqModal"] = false; // ... $g->set_options($opt);
This change is incorporated in latest build now as well.
pcattani answered 3 years ago
That works perfectly! Thanks for looking in to this and thanks for the update. Very much appeciated!
pcattani answered 3 years ago
Just another note in case this helps anyone else.
I had the same problem with the form jumping to the top when I used the Autocomplete feature for fields and then clicked on a selection to select it. I solved the problem the same way as above:
$opt[“edit_options”][“modal”] = false;
Saurabh Arora answered 3 years ago
But it’s not working me ,on click datepicker ,I have tried both way
(a) form is closing without filling other fields.
$grid["edit_options"]["modal"] = false;
(b) while after putting
$opt["edit_options"]["jqModal"] = false;
bottom fields have been invisible due to missed scrolling as showing image
Hi. I also had this problem.
You need to do two things:
On your edit settings, you need to set the height to ‘auto’. For example:
$edit_settings = array(‘width’=>’600’, ‘height’=>’auto’,’resize’=>false,’position’=>’center’,’closeAfterEdit’=>true,’jqModal’=>false);
Then you need to style the FormGrid to a sufficient heigh. For example:
//You need this so scroll bars are activated on the modal edit forms
.FormGrid {
height: 800px !important;
}
