Hi I followed the tutorial "Changing the detail view form layout" and made 2 columns in the detailed view. I now have 2 columns but the text fields are all different widths depending on the type. See attached
the date picker takes up the full 48%
the dropdowns lists (from the parent tables) are about 5%
multiple selection the full 48%
the blank fields are autofill
is there a way to make the form even, or have I missed something
Changing the detail view form layout
- baudwalker
- Veteran Member
- Posts: 188
- Joined: 2015-02-03 08:08
- Location: Bellingen NSW Australia
Changing the detail view form layout
- Attachments
-
- Capture.PNG (23.29 KiB) Viewed 3338 times
Re: Changing the detail view form layout
Hi,
see the code I used, it works fine for me.
ob_start(); ?>
<script>
$j(function(){
$j('fieldset.form-horizontal').removeClass('form-horizontal').addClass('form-inline');
/* Fix for a bug with lookup drop-downs to set their correct width */
// $j('.select2-container').addClass('option_list').css({ 'max-width': 'unset', 'width': 'unset' }).parents('.row').css({ 'width': '200%' });
})
</script>
<style>
@media (min-width: 768px){
/* new code*/
.form-inline .form-control {
width: 95%; /* !important; */
} /*end new code*/
.form-inline .form-control-static {
width: 100%; /* !important; */
} /*end new code*/
.form-inline .form-group{
width: 48%;
margin-bottom: 0.75em;
vertical-align: top;
}
}
</style>
<?php
$new_layout = ob_get_contents();
ob_end_clean();
$html .= $new_layout;
see the code I used, it works fine for me.
ob_start(); ?>
<script>
$j(function(){
$j('fieldset.form-horizontal').removeClass('form-horizontal').addClass('form-inline');
/* Fix for a bug with lookup drop-downs to set their correct width */
// $j('.select2-container').addClass('option_list').css({ 'max-width': 'unset', 'width': 'unset' }).parents('.row').css({ 'width': '200%' });
})
</script>
<style>
@media (min-width: 768px){
/* new code*/
.form-inline .form-control {
width: 95%; /* !important; */
} /*end new code*/
.form-inline .form-control-static {
width: 100%; /* !important; */
} /*end new code*/
.form-inline .form-group{
width: 48%;
margin-bottom: 0.75em;
vertical-align: top;
}
}
</style>
<?php
$new_layout = ob_get_contents();
ob_end_clean();
$html .= $new_layout;
Any help offered comes with the best of intentions. Use it at your own risk. In any case, please make a backup of your existing environment before applying any changes.
- baudwalker
- Veteran Member
- Posts: 188
- Joined: 2015-02-03 08:08
- Location: Bellingen NSW Australia
Re: Changing the detail view form layout
Thank you for your reply.
I applied you code and it fixed the dropdowns but the other textboxes remain the same as if the are taking 48% 0f the 48%, if you know what I mean. See attached
I applied you code and it fixed the dropdowns but the other textboxes remain the same as if the are taking 48% 0f the 48%, if you know what I mean. See attached
- Attachments
-
- Capture.PNG (57.09 KiB) Viewed 3319 times
Re: Changing the detail view form layout
Hi,
sorry, you need to change the dynamic.css.php.
Replace
.form-inline .form-control{ width: auto !important; }
with
.form-inline .form-control{ width: auto }
that should do the trick.
sorry, you need to change the dynamic.css.php.
Replace
.form-inline .form-control{ width: auto !important; }
with
.form-inline .form-control{ width: auto }
that should do the trick.
Any help offered comes with the best of intentions. Use it at your own risk. In any case, please make a backup of your existing environment before applying any changes.
Re: Changing the detail view form layout
Hi, where is the tutorial ? i cannot find it
please help
please help
- baudwalker
- Veteran Member
- Posts: 188
- Joined: 2015-02-03 08:08
- Location: Bellingen NSW Australia
Re: Changing the detail view form layout
Appgini has a ydeme.com section you have to pay a one off payment to join.
https://www.udemy.com/course/customizin ... lications/
https://www.udemy.com/course/customizin ... lications/