Forum
What is the Reframing Technique?
Forum
Demo
Demo
Content
[Contnet] is a fragment of HTML code
<!-- outer.html -->
<html>
  <head>
    <title>Reframe With Router</title>
    <style type="text/css">
      body, html {
        margin: 0; padding: 0; height: 100%; overflow: hidden;
      }
    </style>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-url-parser/2.3.1/purl.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/mustache.js/2.1.2/mustache.min.js"></script>
    <script src="https://haversineconsulting.quickbase.com/db/bj3pggjdg?a=dbpage&pagename=QBRouter.js"></script>

    <script>

      window.onbeforeunload = function(e) {
        var msg = "";
        msg += "This page displays QuickBase within an <iframe> in order to provide various ";
        msg += "enhancments to your experience. Navigating away from this page will cancel these ";
        msg += "enhancements are break out of the <iframe>.";
        return msg;
      };

      var dbidApplication = "bj3pggjdg";
      var dbidClients = "bj3pggjd6";
      var apptoken = "brphvebc9qjma2dxhvebqd5f76tm";
      
      $(function(){
        $("<iframe>", {
          id: "myIframe",
          width: "100%",
          height: "100%",
          frameborder: "0",
          src: dbidApplication 
        }).appendTo("body");

        $("#myIframe").on("load", function() {

          var url = this.contentWindow.location.href;
          console.log("url", url);
          var props = $.url(url).param();
          props.dbid = $.url(url).attr("path").split("/")[2];

          var path = $.url(url).attr("relative").slice(4);
          console.log("path", path);

          //props.subdomain = $.url(url).attr("host").split(".")[0];

          history.pushState({}, "Reframe With Router", dbidApplication); 

          //console.log(path);
          //console.log(JSON.stringify(props, null, ""));

          QBRouter.addRoute("bj3pggjd6?a=q&qid=14",  function(props) {
            $("#myIframe").contents().find("#VR_" + props.dbid + "_" + props.qid + " thead tr td:first").fadeOut(3000);
            $("#myIframe").contents().find("#VR_" + props.dbid + "_" + props.qid + " tbody tr td.icr").fadeOut(3000);
          });

          QBRouter.addRoute("bj3pggjd6?a=ViewBuild&newReportType=table", function(props) {
            var promise1 = $.getJSON('https://baconipsum.com/api/?callback=?', { 
              type: "meat-and-filler", 
              "start-with-lorem": "1",
              sentences: "1"
            });
            promise1.then(function(data) {
              $("#myIframe").contents().find("#qdesc").val(data[0]);
              $("#myIframe").contents().find("#VSA_showqdesc").prop("checked", true);
            });
            var promise2 = $.getJSON('https://baconipsum.com/api/?callback=?', { 
              type: "all-meat", 
              sentences: "1"
            });
            promise2.then(function(data) {
              $("#myIframe").contents().find("#qname").val(data[0]);
            });
          });

          QBRouter.dispatch(path);

        });
      });
    </script>
  </head>
  <body>
  </body>
</html>

<!-- inner.html -->
<script>
if ( window.parent == window.top) {
  window.top.location.href = window.top.location.href + "?a=dbpage&pagename=outer.html";
}
</script>
Copy [Content] to Clipboard
Usage Notes
All rights reserved. The code in this page is copyright by Dan Diebolt and may not be used without including my phone number (773-312-8131) and email address (dandiebolt@yahoo.com) in the footer of where you may want to use it. This snippet of code is not a complete solution and only represents the essential code to address the question. You may have to modify the code to suit your specific needs. There is a good chance that this code uses the image onlaod techique which you can read about here: Image Onload Technique The old image onload technique is document here: Old Image Onload Technique Note: pushState() call held off till after <iframe> loads. Apparently there is an issue on FF and IE if pushState() called before <iframe> is loaded/insrted. This pastie will be updated as the underlying technique is improved.
Other & Flags
Yes  
Diebolt, Dan
Created on July  4, 2015 at  9:54 AM (CST). Last updated by Diebolt, Dan on Nov.  5, 2018 at 10:14 AM (CST). Owned by Diebolt, Dan.
Dan Diebolt
Dan Diebolt
Show fields from Show fields from Show fields from a related table
Report Name *
Description
Reports and Charts Panel
Each table has a panel listing its reports and charts, organized in groups.
Please wait while your new report is saved...
Field label
Column heading override
Justification
What does auto mean?
Fields in:

Fields to Extract:

Name for the new table:
Items in the new table are called:

When you bring additional fields into a conversion, Quick Base often finds inconsistencies. For example, say you're converting your Companies column into its own table. One company, Acme Corporation, has offices in New York, Dallas and Portland. So, when you add the City column to the conversion, Quick Base finds three different locations for Acme. A single value in the column you're converting can only match one value in any additional field. Quick Base needs you to clean up the extra cities before it can create your new table. To do so, you have one of two choices:

  • If you want to create three separate Acme records (Acme-New York, Acme-Dallas and Acme-Portland) click the Conform link at the top of the column.
  • If the dissimilar entries are mistakes (say Acme only has one office in New York and the other locations are data-entry errors) go back into your table and correct the inconsistencies—in this case, changing all locations to New York. Then try the conversion again.

Read more about converting a column into a table.

We're glad you're interested in doing more with Quick Base!

Now we need to make you official before you share apps or manage your account.

Verifying your email lets you share Quick Base with others in your company.

Your work email
Your company