Group with 2 Columns - new group.php

Discussion in 'Fabrik 3.x Testing' started by s6930064, Apr 27, 2012.

  1. s6930064 Member

    Level: Community
    Form template = labels-above
    Group with 2 Columns and 6 element (3 of them hidden)

    In frontend first column element is like
    <li style="float:left;width:44%;" class="fabrikElementContainer field fabrikDataEmpty">…..

    And second column element is like
    <li style="float:left;width:44%;clear:both;" class="fabrikElementContainer field fabrikDataEmpty">….

    Second column shouldn’t have “clear:both”.
    The problem is in group.php new code
  2. s6930064 Member

    Level: Community
    problem continues with new
  3. s6930064 Member

    Level: Community
    If a replace line 217 in models/group.php with
    $element->column .= "";

    then thinks are better, except elements with dropdown...
  4. rob Administrator

    Level: Community
    can you update now please? I think I have fixed this
  5. s6930064 Member

    Level: Community
    Last update

    Ok, but :

    1. if you have set width 40%,40% in group you get 44%,40% in frontend
    2. if you have a dropdown element, select tag has padding = 3px and the result is a big gap from element beneath
  6. s6930064 Member

    Level: Community
    Here are some pictures for the second problem (dropdown / css)

    Attached Files:

  7. cheesegrits Support Gopher

    Level: Community
    Are you sure that's to do with the 3px padding? We apply that to all 'input', 'select' and 'textarea' tags on all forms.

    Can you point us at the page?

    -- hugh
  8. s6930064 Member

    Level: Community
    2. If I reorder elements from backend, and put first ‘birth date’ and second ‘gender’ then everything is ok. Maybe there is something wrong with date element….

    3. Also, elements go from left to right column if there is error message from validation
  9. cheesegrits Support Gopher

    Level: Community
    Again, I'd have to see your page to give you any kind of answer, as I'd need to inspect the CSS with Firebug to see what is causing it.

    -- hugh
  10. s6930064 Member

    Level: Community
    Sorry, it is intranet with no outside access...

    CSS seems ok and if I add with firebug ‘clear:both’ to problematic elements

    <li style="float:left;width:45%;" class="fabrikElementContainer dropdown">.....

    <li style="float:left;width:45%;clear:both;" class="fabrikElementContainer dropdown">.....

    it fixes the problem.
  11. troester Well-Known Member

    Level: Standard
    What is your Joomla template?
    There are some threads about issues with date CSS with Gantry/RockTheme templates;
    It seems fabrik and gantry are using .date class.
  12. s6930064 Member

    Level: Community
    i use default joomla 2.5 template (Beez2-Default Beez_20) without changes
  13. s6930064 Member

    Level: Community, labels above form template, chrome, firefox,IE

    I took 2 print screens before save and after save. As you can see form does not save because there are error but ‘Phone’ field was moved to right from left and alter all fields after. If I add clear:both to phone field everything is good

    Also I have set 45% for both columns in group but in frontend the width is 44%,45%

    Attached Files:

  14. cheesegrits Support Gopher

    Level: Community
    There's really not much I can do without being able to access the page. I can't seem to replicate this here, and the "clear: both" thing you suggested causes issues elsewhere.

    -- hugh
  15. s6930064 Member

    Level: Community
    Some more clues :

    If I use DEFAULT form template then
    - elements alignment is OK
    - validation error message is not showing!
    - first column width is always 44% regardless my setting

    If I use LABELS-ABOVE form template then
    - I have the problem with elements alignment (post #13)
    - validation error message is showing
    - first column width is always 44% regardless my setting
  16. rob Administrator

    Level: Community
    as hugh said we dont see this on our sites, so without seeing an actual page where we can observe the css its impossible to help you
  17. s6930064 Member

    Level: Community
    I think I found the problem. As you see in second image in post #13,

    left element is ‘Driver id’ (text field) with validation error message (give a number) and right element dropdown ‘Position’ without validation error message

    If ‘Position’ had error message everything would align correct, I try it and it worked

    So if one column element have error message and element to the other column does not then you get mix elements…….. do you think it could be solved ?
  18. troester Well-Known Member

    Level: Standard
    You are right:
    the labels-above template displays the error message as tooltip + text (and has -compared with the default template- some "tip" code missing).
    Additionally the error image (small triangle) is shifting the input field one pixel.

    Work around (until this is fixed):
    in labels-above/default_group.php delete lines 21-24 (those displaying the error text below the input field)

    .fabrikErrorMessage .fabrikTip img {margin-top:-1px}
    to custom_css.php

    Column width: it seems nor default nor labels-above are respecting the first width setting (2nd is ok)
  19. s6930064 Member

    Level: Community
    here is my test site :
    you can access the form from top menu ‘FABRIK-FORM’

    Problems with LABELS-ABOVE form template :
    - elements alignment when validation error message is showing (just click submit)
    - first column width is always 44% regardless group setting
  20. s6930064 Member

    Level: Community
    1) i fixed "first column width is always 44% regardless group setting" by changing file group.php, line 212 :
    $w = JArrayHelper::getValue($widths, $elCount % $colcount +1 , $w);
    $w = JArrayHelper::getValue($widths, $elCount % $colcount , $w);

    2) problem with elements alignment and validation in labels above tmpl remains.

Share This Page