Displaying the Submit or Search Button Inline

2 minutes to read

In this article, we will guide you on how to display the Submit or Search button in the same row with other form fields.

Steps:

Edit your Submission Form or Report DataPage.
Proceed to the Configure fields screen.
Add an HTML block below all the fields.
Disable the HTML Editor.
For the Submit button, copy and paste the following code in the HTML block:
For the Search button, copy and paste the following code in the HTML block:
Note: Margin should be adjusted to the number of pixels based on your form and style. The example above is provided for the Caspian Style, the Label position default set to Top, and the Number of columns set to 3 with left to right Fill order.
Select the Continue next element on the same line checkbox in the Advanced tab of the previous field.
Save the DataPage.

Note: This article uses external HTML, CSS, or third-party solutions to add functionality outside of Caspio standard feature set. These solutions are provided “as is” without warranty, support or guarantee. The code within this article is provided as a sample to assist you in the customization of your web applications. You may need a basic understanding of HTML and CSS to implement it successfully.
For assistance with further customization based on your specific application requirements, please contact our Professional Services team.

code1

<style>
.cbSubmitButtonContainer {
display: none !important;
}
</style>

<input class="cbSubmitButton"  id="SubmitBtn" name="SubmitBtn" style="margin: 25px 0px;" type="submit" value="Submit" />

code2

<input type="submit" name="searchID" style="margin: 25px 0px;" value="Suchen" class="cbSearchButton">