How is span option used in Buttons 2.2.2 ?

How is span option used in Buttons 2.2.2 ?

desperadodesperado Posts: 159Questions: 33Answers: 4
edited January 2022 in Buttons

I don't quite understand the new "span" option. How is this used to limit the size? Do you just designate a fixed number of pixels ?
https://datatables.net/reference/button/collection

I have been using css and hacking a class using the collectionLayout.

Like this.

buttons: [
                {
                    extend: 'savedStatesCreate',
                    collectionLayout: 'rcoi-dt-state-restore-button-group-hack',
...

css

        .rcoi-dt-state-restore-button-group-hack {
            width: 350px !important;
        }

This question has accepted answers - jump to:

Answers

  • allanallan Posts: 61,438Questions: 1Answers: 10,052 Site admin
    Answer ✓

    The span option only has two possible values at the moment:

    • Unset - width of the collection dropdown is defined by the CSS
    • container which will match the width of the dropdown to the DataTables container. That would be useful for a SearchPanes buttons for example.

    Allan

  • desperadodesperado Posts: 159Questions: 33Answers: 4

    @allan Thanks, I can stick with my solution then. I don't plan to use it but curious is "container" just a literal string "container" or is it an identifier for which container it should size to ? If the latter then how do you identify the container. If the former then perhaps you could put quotes around "container" to make that more clear in the documentation.

    I find the wording in the documentation difficult to understand.

    "Specifically set the width of the container: * container - Span its full width of the DataTables' container (good for large content areas)."

    Specifically set the width of the container implies to me that I can provide a value to specify the width of the container. Your wording in your last comment is more clear "Match the width of the dropdown to the datatables container." you might want to change the wording in the documentation.

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    Thanks, @desperado , I'm making that change now. You'll see it when the site is next rebuilt - normally every couple of weeks,

    Colin

  • desperadodesperado Posts: 159Questions: 33Answers: 4

    @colin Thanks! Do you know the answer to my question about should the value be the literal "container" or the name of a container or something else?

  • allanallan Posts: 61,438Questions: 1Answers: 10,052 Site admin
    Answer ✓

    Its a literal string:

    span: 'container'
    

    We might introduce more options in future as they become relevant.

    Allan

Sign In or Register to comment.