Jump to content
  • 0

Remodeling the way the search layout is on a tabluar report


MarkMayhrai
 Share

Question

3 answers to this question

Recommended Posts

  • 0

This can be added using an HTML block. Caspio has this article for displaying the search button inline. https://howto.caspio.com/tech-tips-and-articles/advanced-customizations/display-the-submit-or-search-button-inline/

You will just need to tinker with it a bit to make it a magnifying glass picture instead a normal "Search" button.


image.png.2935292c603af91abbaec2d12873538b.png
Try using this code below inside the source of an HTML block:

<style>
.cbSearchButtonContainer {
display: none !important;
}
.cbHTMLBlockContainer{
padding: 35px 15px 0px 15px !important;
}
</style>
<input type="image" src="https://img.icons8.com/color/48/000000/search--v1.png" alt="Submit" width="24" height="24" id="SearchBtn" name="SearchBtn" />

The first style hides the button while the other style overrides the default padding to make the image align with the textboxes since you have the labels on top.

Edit what needs to be edited to fit your setup. BTW that icon is just an online icon that I found.

Hope that helps^

Link to comment
Share on other sites

  • 0

Hi guys! I'm adding these useful links the tips and tricks if you would like to customize the styles of your DataPages. Here are the links for your reference:
https://www.youtube.com/watch?v=DQJscbV5prE

https://www.youtube.com/watch?v=Fzf0efn_B5s

https://www.youtube.com/watch?v=KxcEHFzk2o0

https://www.youtube.com/watch?v=cRyuCY_uCc4

 

https://howto.caspio.com/styles/styles/

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

×
×
  • Create New...