Okay
  Public Ticket #3655190
Layout & position of search field/form & hide related table content
Closed

Comments

  •  1
    Felix started the conversation

    Good day,

    two questions regarding the search field/form:

    1. It's possible to change the layout/position of the search field?

    Eg. that the search bar is bigger/wider and centralized. As per standard configuration it's on the top left of the table. I like to change it in a way, that it's bigger/wider and centralized on top of the table.

    5443142776.png

    2. It's possible to hide the table and the content of the table, until someone actually searched within the search field?

    Eg. at the moment depending as per custom configuration, the table shows the first 1, 5, 10, 25, 50, 100, all results of the table content. Depending on the sorting.

    I like to have the table showing nothing or better be hidden, until someone used the search. It would be basically just the search field, which is shown.

    I found similiar questions, but no up to date feedback:

    https://wordpress.org/support/topic/display-search-field-only-without-table-content-2/ (7 years ago, outdated)

    https://wordpress.org/support/topic/show-only-search-field/ (2 month ago, but public question - not support related. Legit, that there is no TMS feedback)

    Thanks a lot for your feedback.

    Best regards

    Felix

  •  1
    Felix replied

    Good day,

    A third search field related question, I forgot in the first place.

    3. It's possible to query 2 different tables at once with the same search field?

    That I can bind two different tables to one search form. If I place eg. the two shortcodes of those tables on the same page and ensure both are queried by the same search form, I can show different results, depending on the table content and which columns I make visible. For sure, they searched key word musst be present in at least one of those 2 tables, to have at least one result for on of those tables.

  •  1,767
    Miloš replied

    Hi Felix

    We will now try to cover multiple questions on the same ticket, but for the future, please note :

    When you have multiple questions or issues which are for different subjects/topics,

     please open a new ticket for each subject, and we will help/advise more effectively. 

    In that way, issues and questions which are related to different subjects will be in separate tickets so other users or our support agents can find them easily. 

    Our policy is to have one issue or question per ticket for the reasons described already.

    Thank you for understanding.


    1. 

    It's possible to change the layout/position of the search field?

    Eg. that the search bar is bigger/wider and centralized. As per standard configuration it's on the top left of the table. I like to change it in a way, that it's bigger/wider and centralized on top of the table.

    -

    We don't have a built-in way to achieve this, but you can try a custom solution with CSS.

    Please be advised that customizations are not covered by our support, but we can help with some basic idea to get you started.

    For example, you can use this CSS selector to manipulate the position of the "search block" of the Table.

    .wpDataTablesWrapper .dataTables_filter {
        left: 589px !important;
        position: relative !important;
        margin-bottom: 30px !important;
    }

    1314479359.png

    By default, the Search bar on this Table skin is at the top left, but with this CSS, I moved it close to the centre and increased the bottom margin to make it 'stand out' a bit more.

    You can, of course add any other styles you need such as width, etc.


    Add this to the table's Customize/Custom CSS if you wish it just for one table;

    or if you wish the same style applied on all tables, add it to the main Plugin settings/Custom Js and CSS/Custom CSS.


    I hope that helps.

    2. To have the table hidden before users search for something :

    You can achieve this with our Powerful Filters Add-on.

    It has a feature "Hide table before filtering" which can be used combined with "search" button;

    Then a user needs to choose one or more filters, and only when they hit Search, the table will load only the filtered data.

    Please check more about this functionality here.

    Before purchase, you can test all Powerful Filters Add-on features on our sandbox site.

    Let me know if you have any questions about that.



    3. It's possible to query 2 different tables at once with the same search field?

    At the moment, we don't have anything for this solution.

    Each table can only have its own search and filters - we can't have one filter/ or search affect multiple tables on same Page.

    The only current way how you can technically affect multiple tables on same page with a filter is via Pre-Filtering URL, but that is if for example two tables have same column name and you pass a parameter for a column filter in the URL, then both tables would be affected.

    Other than that, there is no current other way.


    You can make a development suggestion if you wish.

    Please feel free to search on our suggestions page

     to see if someone may be already suggested this feature. If you can't see it, feel free to add your suggestion there,  and as more people vote, the feature will move higher on the priority list.

    You can certainly follow our changeLog page if you'd like ( it is also available in the plugin dashboard), where we state any changes/new features/bug fixes during updates;

    and our newsletter, so you're informed about new features, bug fixes, freebies, etc.


    Kind Regards, 

    Miloš Jovanović
    [email protected]

    Rate my support

    wpDataTables: FAQ | Facebook | Twitter | InstagramFront-end and back-end demo | Docs

    Amelia: FAQ | Facebook | Twitter | InstagramAmelia demo sites | Docs | Discord Community

    You can try wpDataTables add-ons before purchasing on these sandbox sites:

    Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables