Forum Discussion

ArchiveUser's avatar
ArchiveUser
Qrew Captain
7 years ago

Custom HTML page to submit form -- I want to redirect to an external URL following ""submit

I have a custom HTML page based on the Quickbase Custom Form Wizard. I added some formatting as needed for the users. 

When the users click the Submit button, I want to direct them to a URL outside of Quickbase. Currently, it just reloads the page with new, blank values. 

Is this possible? If not, what are the options of URLs I can direct to within Quickbase? 

Disclosure: I do not know Javascript or other coding languages so my solutions are limited to QB native, basic HTML/CSS, and copy/pasting :P

Here's the existing info I have re: form/code. 

<form name=qdbform method=POST onsubmit='return validateForm(this)' encType='multipart/form-data' action=https://mydatabase.com/db/xxxxx?act=API_AddRecord&apptoken=xxxxxx...;
<input type=hidden name=fform value=1>

.......

<input type="submit" style="font-face: 'Helvetica'; font-size: 24pt; color: white; background-color: #C21734; border: 3px" value="Save">
</form>

APIs and custom code
Ask about Quickbase functionality
Forms
  • QuickBaseJunkie's avatar
    QuickBaseJunkie
    Qrew Commander
    7 years ago
    To redirect to another page, replace what you currently have at the bottom of your code for <input...> with the following and update to where in your app you'd like to redirect the user.

    <input type=hidden name=rdr value='https://yourcompany.quickbase.com/db/yourtableid?a=dbpage&pageID=3'>;
    <input type=submit style="font-face: 'Helvetica'; font-size: 24pt; color: white; background-color: #C21734; border: 3px" value="Save">

    When submitting a form you will only be able to redirect to another page in your app. What I've done in the past is create another code page with a single button that will link to where I need them to go outside the app. Here is the code from my code page:

    <!DOCTYPE html>
    <html>
    <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <base target="_parent">
    <style>
    .button {
      width: 50%;
      font-size: 18px;
      line-height: 1.6;
      margin: 0 auto;
      text-decoration: none;
      text-align: center;
      padding: 0.9rem 1.1rem;
      border-radius: 2px;
      border: 2px solid #FFA6B6;
      background-color: white;
      color: #FFA6B6;
      font-family: Arial;
      font-weight: 300;
    }
    .sub-heading{
      font-size: 20px;
      font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
      color: white;
      text-align: center;
      line-height: 1.6;
    }
    </style>
    </head>    
    <body>
    <p></p>
    <p></p>
    <p></p>
    <div class="sub-heading">Thank You!</div><br>
    <a href="https://www.quickbasejunkie.com/blog"; style="margin:auto; text-align:center; display:block;" class="button">Please Click Here</a>
    </body>
    </html>

  • ArchiveUser's avatar
    ArchiveUser
    Qrew Captain
    7 years ago
    Thank you QB Junkie! Extremely helpful!! 

    RobWhite - thank you too! your code worked exactly as expected.

    Just as an fyi I ended up actually keeping the button option because I liked the "confirmation landing page" experience for the user. 

    Thanks again to you both