Possible to add "Reset Search" button next to "Search" buton?

[telepet]

I've added a "Reset Search" button in a search page and wonder if it's possible to have the "Reset Search" button be on the same line as the "Search" button.  I'm looking for something like figure A in the attached image.

 

I know how to add an additional "Search" button thanks to this thread and I've come up with this code:

<div align="center">
	<input class="cbSearchButton" id="searchID1" name="searchID" type="submit" value="Search" />

<input class="resetButton" onclick="window.location='[my_URL]'" type="button" value="Reset Search" />
</div>

However, though the above looks like what I'd like, I would then need a way to hide the original "Search" button, which I don't believe would be possible.

[Vitalikssssss]

Hello telepet,

On 11/14/2017 at 2:29 PM, telepet said:

It seems like the cbSearchButton class has a dynamically generated suffix preventing a hard coded script from consistently hiding it.

1

Please note that Search button can be referenced by id "searchID" and this id is not dynamic.

You can use following script to hide the Search button:

<script>
document.getElementById("searchID").style.visibility = "hidden";
</script>

You can find the id for referencing Caspio standard buttons in the following topic.

Hope this helps.

[Franchiser]

You might consider using CSS attributes instead of using javascript.  Can you provide the url and let me see if I can help.

[telepet]

I've been exploring the possibility of adding a script in the header and/or footer that "hides" the Search button but not having much luck yet.  It seems like the cbSearchButton class has a dynamically generated suffix preventing a hard coded script from consistently hiding it.

 

Here's an example of what I've tried so far:

 

<script>
document.getElementById("[cbSearchButton]")[0].style.visibility = "hidden";
</script>

 

 

 

 

[telepet]

Thanks @Franchiser.  I'll explore the CSS code a bit.  Unfortunately the site is behind a login screen, so I'm unable to share that out.

[telepet]

Thanks @Vitalikssssss.  That link is full of very useful information.   I think the JS solution does the trick.  

 

Thanks too to @Franchiser.  I was able to solve this via CSS as well, using this code provided elsewhere in the forum (link):

 

<style>
#searchID 
{
display:none;
}
</style>