Forum Discussion

RH's avatar
RH
Qrew Member
2 years ago

Field value into Code page

Hi Folks, I'm trying to create a landing page for a button. I want to use field values from the table to be displayed in the landing page, How to do that using Code page?  Thanks in advance, ...
ChayceDuncan's avatar
ChayceDuncan
Qrew Captain
2 years ago

You can either query the record from the codepage or pop the data into URL parameters. For example you could do: 

https://yourealm.quickbase.com/db/appdbid?a=dbpage&pageid=your page id&rid=INSERT RECORD ID# here 

and then in your code page you query back to that table and specifically target the RID in the URL param. 

Or you can just shove all the data in the button like: 

https://yourealm.quickbase.com/db/appdbid?a=dbpage&pageid=your page id&field1=info for field 1&field2=info for field 2&field3=info for field 3..... so on and so on

Then you just grab the params and set them as variables to use in your HTML



------------------------------
Chayce Duncan
------------------------------
  • RH's avatar
    RH
    Qrew Member
    2 years ago

    Hi Chayce, Thank you for the input. I have couple more questions
    1. I'm writing code in the code page for the first time. Can  you please share an example of how to query back in code page?? 

    2. Also, When a user clicks publish button from record #1-->code page displays "set of information" and it should have a link to redirect back to the record#1. How to achieve this ?

    Thanks



    ------------------------------
    RH
    ------------------------------
    • ChayceDuncan's avatar
      ChayceDuncan
      Qrew Captain
      2 years ago

      I'll try and answer (1) but ultimately you're the one that will need to be familiar enough with programming to really take it anywhere.

      Accessing the QB API has many options, same as you would with any kind of client-side API call. You can use Axios, jQuery, Fetch, whatever you want. I do it different ways based on need, I've moved more towards using the REST API for various reasons and in codepages I typically have some flavor of the following function that I carry around: 

             const qb = {
                tempToken: (dbid) => {
                  return new Promise((resolve,reject) => {
                    var headers = {
                      'QB-Realm-Hostname': '',
                      'QB-App-Token': '',
                      'Content-Type': 'application/json'
                    }
                    fetch(`https://api.quickbase.com/v1/auth/temporary/${dbid}`,
                      {
                        method: 'GET',
                        headers: headers,
                        credentials: 'include'
                    })
                    .then(res => {
                      if (res.ok) {
                        return res.json().then(res => resolve(res.temporaryAuthorization));
                      }
                      return res.json().then(resBody => reject({status: res.status, ...resBody}));
                    }).catch(err => reject(err))
                  })
                },
                fetchData: (token,body) => {
                  return new Promise((resolve,reject) => {
                    var headers = {
                      'QB-Realm-Hostname': '',
                      'Authorization': `QB-TEMP-TOKEN ${token}`,
                      'Content-Type': 'application/json'
                    }
                    fetch('https://api.quickbase.com/v1/records/query',
                      {
                        method: 'POST',
                        headers: headers,
                        body: JSON.stringify(body)
                      })
                    .then(res => {
                      if (res.ok) {
                        return res.json().then(res => resolve(res));
                      }
                      return res.json().then(resBody => reject({status: res.status, ...resBody}));
                    }).catch(err => reject(err))
                  })
                },
                upsert: (commit,controller) => {
                  return new Promise((resolve,reject) => {
                    var headers = {
                      'QB-Realm-Hostname': '',
                      'Authorization': `QB-TEMP-TOKEN ${controller.token}`,
                      'Content-Type': 'application/json'
                    }
                    var body = {
                      to: controller.dbid,
                      data: commit.data,
                      mergeFieldId: commit.mergeFieldId,
                      fieldsToReturn: commit.fieldsToReturn
                    }
                    fetch('https://api.quickbase.com/v1/records',
                      {
                        method: 'POST',
                        headers: headers,
                        body: JSON.stringify(body)
                      })
                    .then(res => {
                      if (res.ok) {
                        return res.json().then(res => resolve(res));
                      }
                      return res.json().then(resBody => reject({status: res.status, ...resBody}));
                    }).catch(err => reject(err))
                  })
                }
              }
      Again - you don't have to do it that way - you could also use the XML API version and do something like axios.get(doquery url syntax) and then handle the resulting payload. 
      To question (2) - if you want to redirect them back to where they came from that's just a matter of using the window functions of your browser. You could do a history.back() entry or do window.location.replace( enter your url to return to here )


      ------------------------------
      Chayce Duncan
      ------------------------------