Forum Discussion

Winss's avatar
Winss
Qrew Trainee
3 years ago

Quickbase Code page to query a table and display records

I have created a code page which should query a table and display certain records using API -GenResults table. I am going to embed this code page in forms. Based on value in each record(in field - test temp inventory query) the contents in the table changes. 
Below is the code page code

<html>

<head>

<script src= ~test temp inventory query~ lang="text/javascript">

</script>

<style>

   td.m { font-family:verdana; font-size:70%; }

   td.hd { font-family:verdana; font-size:70%; font-weight:bold;

    color:white;}

</style>

</head>

<body>

<h1>Example</h1>

   <table cellpadding=5 bgcolor=lightgreen>

      <tr>

         <td>

            <script lang="text/javascript">

               qdbWrite();

            </script>

         </td>

      </tr>

   </table>

</body>

</head>

</html>​

The third line, value of src determines the query.  ~test temp inventory query~ is the field where query is created as a formula text .
The value in formula text looks something like this

https://Domain.quickbase.com/db/iddbdbdbid?a=API_GenResultsTable&apptoken=tokn123 t=1&query={'29'.CT.'TYCU700'}OR{'29'.CT.'TYRD60'}OR{'29'.CT.'TYTG8580'}&clist=29.17.7.9.8.38.44.49&slist=17


But the contents are not getting pulled correctly. Which is best way to pass value in field to the QuickBase code page and display the link to code page as embedded in the same form.  ? 

APIs and custom code
Code Page
  • SimonH's avatar
    SimonH
    Qrew Cadet
    3 years ago
    If I am reading this correctly, you are misusing the javascript source tag's src parameter.
    That is where you would put the URL for a valid JS file, not a QuickBase API url

    What you want to do is pass that query URL to the code page as a query parameter, and then have a script on the page make the query and render the table

    ------------------------------
    Simon H
    ------------------------------
    • Winss's avatar
      Winss
      Qrew Trainee
      3 years ago
      Api Query is now passed as a parameter for code page. 
      Like shown below.
      ------------------------------------
      var text embedurl="https://jewelry.quickbase.com/db/be4uqew75?a=dbpage&pageID=151&qrytext=" & URLEncode([test temp inventory query]); //test using parameter passing
      $embedurl
      -------------------------------------
      [test temp inventory query] is the API Genresults API link which looks like

      https://Domain.quickbase.com/db/iddbdbdbid?a=API_GenResultsTable&apptoken=tokn123 t=1&query={'29'.CT.'TYCU700'}OR{'29'.CT.'TYRD60'}OR{'29'.CT.'TYTG8580'}&clist=29.17.7.9.8.38.44.49&slist=17

      Code page is updated like as shown below.
      ------------------------------------------------------------
      <html>
      <head>
      <script lang="text/javascript">

      let urlParams = new URLSearchParams(window.location.search);
      let qrytext = urlParams.get('qrytext');

      </script>
      <style>
      td.m { font-family:verdana; font-size:70%; }
      td.hd { font-family:verdana; font-size:70%; font-weight:bold;
      color:white;}
      </style>
      </head>
      <body>
      <table cellpadding=5 bgcolor=lightgreen>
      <tr>
      <td>
      <script lang="text/javascript">
      qdbWrite();
      </script>
      </td>
      </tr>
      </table>
      </body>
      </head>
      </html>
      ---------------------------------------------------------------------
      Still not working

      ------------------------------
      Aswin Babu
      ------------------------------
      • SimonH's avatar
        SimonH
        Qrew Cadet
        3 years ago
        Heres a bit of a hacky method that should work.
        The page below will manually build and append the script tag after retrieving the src from the query, then call qdbWrite after it has loaded

        <html>
   <head>
      <script>
         let urlParams = new URLSearchParams(window.location.search);
         let qrytext = urlParams.get('qrytext');
         
         var s = document.createElement("script");
         s.type = "text/javascript";
         s.src =qrytext ;
         document.head.appendChild(s);
         
         window.addEventListener("load", function(){
         	qdbWrite();
         });
      </script>
      <style>
         td.m { font-family:verdana; font-size:70%; }
         td.hd { font-family:verdana; font-size:70%; font-weight:bold;
         color:white;}
      </style>
   </head>
   <body></body>
   </head>
</html>​


        ------------------------------
        Simon H
        ------------------------------
    • Winss's avatar
      Winss
      Qrew Trainee
      3 years ago
      Hello Simon,
      If i modify the 3rd line to shown below its going to pull out the records and display in code page.  What I am confused is passing the value in a formula text to the code page and display that code page at a record level using embedding technique of URL fields.  
      <script src= "https://domain.quickbase.com/db/iddbdbdbid?a=API_GenResultsTable&apptoken=tokn123%20t=1&query={%2729%27.CT.%27TYCU700%27}OR{%2729%27.CT.%27TYRD60%27}OR{%2729%27.CT.%a27TYTG8580%27}&clist=29.17.7.9.8.38.44.49&slist=17" lang="text/javascript">


      ------------------------------
      Aswin Babu
      ------------------------------