Custom buttons and standard buttons

[F.C.]

Quick question. Can someone point me to any guidance on how to change the style of standard form buttons or custom buttons that i added to a form. I want to format them using bootstrap styles. Any help will be appreciated. Also Web2py rocks!!!

[Yi Liu]

They are already in default bootstrap style.

_class='btn btn-primary'

To customize, you can add your own css file, or edit the form constructor to add a new class, or id , or change to different bootstrap class to specific form button. For example:

_class='btn btn-danger'

Your browser's web developer tool will also be handy for such work.

[Francois Barnard]

How do i change the class of a custom and/or standard form button. Is there an example you can reference? Again, thank you for the assistance 

--
Resources:
- http://web2py.com
- http://web2py.com/book (Documentation)
- http://github.com/web2py/web2py (Source code)
- https://code.google.com/p/web2py/issues/list (Report Issues)
---
You received this message because you are subscribed to a topic in the Google Groups "web2py-users" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/web2py/IEWkmxjLqcA/unsubscribe.
To unsubscribe from this group and all its topics, send an email to web2py+un...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Yi Liu]

There is nothing special about form button as one of the html constructors. They all support standard HTML helpers:

http://www.web2py.com/books/default/chapter/29/05/the-views#HTML-helpers

`_class` generates the class tag

You can read more about INPUT here: http://www.web2py.com/books/default/chapter/29/05/the-views#INPUT

[Anthony]

On Saturday, February 17, 2018 at 10:57:08 AM UTC-5, F.C. wrote:

How do i change the class of a custom and/or standard form button. Is there an example you can reference? Again, thank you for the assistance 

To add a class to the submit button:

form.custom.submit.add_class('my_class')

To completely change the class:

form.custom.submit['_class'] = 'my_class'

Similarly, you can access input fields via form.custom.widget.[name of field].

You can also use .element() (as described here) to find and manipulate any DOM element within the form.

Finally, SQLFORM takes a "formstyle" argument, which can be a function that produces the form DOM. For examples of how the function should work, see for example: https://github.com/web2py/web2py/blob/82cf2eb44db907a3ca20c29ee8116f95ef77bb5a/gluon/sqlhtml.py#L991. That might be worth the effort if you want something completely different from the formstyles that are already built in, but if you just want to change the class of a button, the above approach is simpler.

Anthony

[Francois Barnard]

Thank you so much!

On Sat, Feb 17, 2018 at 10:44 AM, Anthony <abas...@gmail.com> wrote:

On Saturday, February 17, 2018 at 10:57:08 AM UTC-5, F.C. wrote:

How do i change the class of a custom and/or standard form button. Is there an example you can reference? Again, thank you for the assistance 

To add a class to the submit button:

form.custom.submit.add_class('my_class')

To completely change the class:

form.custom.submit['_class'] = 'my_class'

You can also use .element() (as described here) to find and manipulate any DOM element within the form.

Finally, SQLFORM takes a "formstyle" argument, which can be a function that produces the form DOM. For examples of how the function should work, see for example: https://github.com/web2py/web2py/blob/82cf2eb44db907a3ca20c29ee8116f95ef77bb5a/gluon/sqlhtml.py#L991.

Anthony

--
Resources:
- http://web2py.com
- http://web2py.com/book (Documentation)
- http://github.com/web2py/web2py (Source code)
- https://code.google.com/p/web2py/issues/list (Report Issues)
---
You received this message because you are subscribed to a topic in the Google Groups "web2py-users" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/web2py/IEWkmxjLqcA/unsubscribe.

To unsubscribe from this group and all its topics, send an email to web2py+unsubscribe@googlegroups.com.