You are viewing limited content. For full access, please sign in.

Question

Question

Custom HTML Button to Fill Form Fields

asked on November 16, 2022 Show version history

Hello! I found a post that explained how to create a custom HTML button using the following HTML: 

<div style="text-align: middle;">
<input type="button" value="Report an Issue">
</div>

 

I'm wondering 2 things:

1) What can I add to center the button on the page?

2) Is it possible to add any additional code to the form to, upon clicking the button, populate a text field with a specific value? Basically I'm just wanting a fancier button to click to then cause some additional fields to appear (which I plan to handle through field rules) rather than just using a radio button or checkbox.

 

Any help would be appreciated. Thanks!!!

0 0

Answer

SELECTED ANSWER
replied on November 17, 2022 Show version history

Hi Dylan, I've gotten used to creating custom buttons that are tied to JS. In the button below you can see onclick="PerformSubmit()", which calls a JS function: PerformSubmit() when the button is clicked

<button style="color:white; background-color:green; border-color:gray;width:150px;height:50px;" onclick="PerformSubmit()" type="button">Process Document</button>

JS

function PerformSubmit() {
    $('.Submit').click();
};

In this case, when you click the green button the function clicks the built in Submit button which is hidden, but you could also assign a field value, open a link, or whatever else you come up with in JS

1 0
replied on November 18, 2022

Thank you very much, Steve!

This is a fantastic resource! I've got that button working exactly how I expected it to now! Sounds like I need to do some research into what all functions can be performed, as that sounds quite useful. Thank you again and have a great rest of your day, sir!

0 0

Replies

replied on November 16, 2022

For the button, try this:

<div align="center"><input type="button" value="Report an Issue"></div>

1 0
replied on November 16, 2022

Thank you Susan! That worked for the centering of the button. I'm incredibly new to HTML so I appreciate the assist!

0 0
You are not allowed to follow up in this post.

Sign in to reply to this post.