quick form styling question

[Dave S]

Warning: everything I know about BootStrap (BS4) I've learned from the examples, so I Don't Know Much.

I have a form with 2 integer fields, one with a label, and the other uses the input ID for a label.  If I use FORM(), the fields come out appropriately sized for about 6 digits and side by side.  If I use SQLFORM.factory(), the fields come out 100% of a div with class "col-sm-9", which is huge.   I like the look of the FORM() results, but I want autofocus and other support of the factory form.

How can I wrestle the latter to look more like the former?  I can change the width of the whole form (_style = "width:  50%"), but that line doesn't work in the field itself, and the inputs remain as separate divs.  The class defaults to "form-horizontal", so I tried setting it to "form-vertical", but that didn't work ... I was adding a class, not replacing a class.

(And beside,s that raises the question, what are those two classes really doing?)

Thanks for any advice,

Dave S

/dps

[Silvian Cedru]

Can you show me a picture how it looks right now and post the css so I have an idea ?

[Dave S]

On Sunday, September 4, 2022 at 7:51:28 PM UTC-7 silvia...@gmail.com wrote:

Can you show me a picture how it looks right now and post the css so I have an idea ?

It's all in-box stuff,  and with SQLFORM.factory() I set  autofocus by specifying that in the widget option for the appropriate field.

                Field('firstid',
                      requires=[IS_NOT_EMPTY(),IS_INT_IN_RANGE(99900,105000)],
                      label = "Need picture IDs to swap",
                      widget = lambda f, v: SQLFORM.widgets.integer.widget(f, v, _autofocus=True)),

Adding                       

                   _class = "col-sm-3",

does not change the field appearance, because it doesn't override the default class.

Adding 

                    _style = "width: 50%",

to the field does not change it's appearance,  but moving it to the enclosing form definition shrinks the width, but still has two rows stacked.

If I use FORM(), I get the single row picture, but not widgets.

/dps

[Dave S]

On Saturday, September 3, 2022 at 5:19:42 PM UTC-7 Dave S wrote:

Warning: everything I know about BootStrap (BS4) I've learned from the examples, so I Don't Know Much.

Slightly related question:  what is the best widget for a factory form field using IS_IN_SET[ .. several strings ...]?  If I leave it default, I get a pull-down caret on the right, and autocompletion, but no cursor token to show the field is active.  if I use SQLFORM.widgets.strings.widget, I get the curson but no pull-down or autocomplete.

/dps

[Silvian Cedru]

What you actually could do is put the class in the <style></style> section of the page and overwrite it manually . Give it for example class ".A {    width: 50% !important; }"

[Dave S]

On Monday, September 5, 2022 at 11:26:57 PM UTC-7 silvia...@gmail.com wrote:

What you actually could do is put the class in the <style></style> section of the page and overwrite it manually . Give it for example class ".A {    width: 50% !important; }"

Thanks.

/dps