nightowl
-
Posts
55 -
Joined
-
Last visited
-
Days Won
5
1 Follower
nightowl's Achievements
-
William reacted to an answer to a question:
Calculate Week Number in Formula Field
-
vikovs reacted to an answer to a question:
Calculate Week Number in Formula Field
-
Hi NeoInJS, Please put the following code in the Header section of your DataPage (with Source button enabled): <style> tr > td:nth-of-type(2) { text-align: left; } </style> Hope this helps.
-
Auto-resize iframes containing report DataPages
nightowl replied to dspolyglot's topic in User JavaScript and CSS Discussions
Hi dspolyglot, You can also try the following: [RECOMMENDED] Create an external HTML file in your web hosting provider. [OR] you can also create an HTML DataPage. Use this code inside the <body> element: <!-- iframe container --> <div id="cb-iframe-container"></div> <!-- REFERENCE: http://stackoverflow.com/questions/9249680/how-to-check-if-iframe-is-loaded-or-it-has-a-content --> <script type="text/javascript"> function checkIframeLoaded() { // Get a handle to the iframe element var iframe = document.getElementById('cb-iframe-1'); var iframeDoc = iframe.contentDocument || iframe.contentWindow.document; // Check if loading is complete if (iframeDoc.readyState === 'complete') { // The loading is complete. Call the function we want executed once the iframe is loaded setIframeDimensions(iframe); return; } // If we are here, it is not loaded. Set things up so we check the status again in 100 milliseconds window.setTimeout('checkIframeLoaded();', 100); } </script> <script type="text/javascript"> var previousHeight = '0px'; var previousWidth = '0px'; </script> <!-- REFERENCE: http://www.dyn-web.com/tutorials/iframes/height/demo.php --> <script type="text/javascript"> function setIframeDimensions(iframe) { var doc = iframe.contentDocument ? iframe.contentDocument : iframe.contentWindow.document; // Reset to minimal height and width iframe.style.height = '10px'; iframe.style.width = '10px'; iframe.style.visibility = 'hidden'; // IE opt. for Bing/MSN needs a bit added or scrollbar appears iframe.style.height = getDocHeight(doc) + 4 + 'px'; iframe.style.width = getDocWidth(doc) + 4 + 'px'; iframe.style.visibility = 'visible'; // Detect height and/or width changes previousHeight = (iframe.style.height === previousHeight) ? previousHeight : iframe.style.height; previousWidth = (iframe.style.width === previousWidth) ? previousWidth : iframe.style.width; } function getDocHeight(doc) { doc = doc || document; // REFERENCE: https://stackoverflow.com/questions/1145850/ var body = doc.body, html = doc.documentElement; var height = Math.max( body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight, 600 ); return height; } function getDocWidth(doc) { doc = doc || document; // REFERENCE: https://stackoverflow.com/questions/1145850/ var body = doc.body, html = doc.documentElement; var width = Math.max( body.scrollWidth, body.offsetWidth, html.clientWidth, html.scrollWidth, html.offsetWidth, 1024 ); return width; } </script> <!-- REFERENCE: http://stackoverflow.com/questions/10418644/creating-an-iframe-with-given-html-dynamically --> <script type="text/javascript"> // TODO: Change the site and appkey as necessary --> var site = 'YOUR_SITE.caspio.com'; // EXAMPLE: c5gaf330.caspio.com var appkey = 'YOUR_APPKEY'; window.onload = function () { parent.createIframe(site, appkey); } function createIframe(site, appkey) { var iframe = document.createElement('iframe'); iframe.id = 'cb-iframe-1'; iframe.style.borderStyle = 'none'; var customContent = document.getElementById('cb-iframe-container'); var oldIframe = document.getElementById('cb-iframe-1'); if (oldIframe) { customContent.removeChild(oldIframe); } customContent.appendChild(iframe); var link = 'https://' + site + '/dp.asp?AppKey=' + appkey; var id = 'cb' + appkey; var html = '<scr' + 'ipt type="text/javascript" src="https://' + site + '/scripts/embed.js"></scr' + 'ipt><scr' + 'ipt type="text/javascript">try{f_cbload(true, "' + site + '", "' + appkey + '");}catch(v_e){;}</scr' + 'ipt><div id="cxkg"><a href="' + link + '">Click here</a> to load this Caspio <a href="http://www.caspio.com" target="_blank" title="Cloud Database">Cloud Database</a></div><div id="' + id + '"><a href="https://www.caspio.com" target="_blank">Cloud Database</a> by Caspio</div>'; iframe.contentWindow.document.open(); iframe.contentWindow.document.write(html); iframe.contentWindow.document.close(); checkIframeLoaded(); } </script> Don't forget to update these two lines: // TODO: Change the site and appkey as necessary --> var site = 'YOUR_SITE.caspio.com'; // EXAMPLE: c5gaf330.caspio.com var appkey = 'YOUR_APPKEY'; Hope this helps. -nightowl -
Render a calculated field as HTML
nightowl replied to dspolyglot's topic in User JavaScript and CSS Discussions
Hi dspolyglot, Assuming that all of your fields have non-empty labels, you can try this trick: Add a Header/Footer section to your Details DataPage. Go to the Footer section. On the header section's Advanced tab, disable the HTML editor as mentioned in this article: http://howto.caspio.com/faq/web-forms/how-to-disable-html-editor-in-datapage-headerfooter-and-html-blocks/ Then add this code: <script src="https://cdnjs.cloudflare.com/ajax/libs/he/1.1.1/he.min.js"></script> <script> // EXAMPLE 1: Calculated field is on position 2, with one field before it that has no label calcFieldAsHtml(2, 1); // EXAMPLE 2: Another calculated field is on position 6, with two fields before it that have no label. // The two fields mentioned here includes the no-label field from EXAMPLE 1 calcFieldAsHtml(6, 2); function calcFieldAsHtml(index, noLabelsBefore) { var childPos = (index * 2) - noLabelsBefore; var selector = 'span[class^="cbResultSetData"]:nth-of-type(' + childPos + ')'; var calcFields = document.querySelectorAll(selector); for (var calcField of calcFields) { // STEP 1: Align left inside the flex column calcField.style.display = 'inline-flex'; // STEP 2: Setup he.js options var options = { 'allowUnsafeSymbols': true, }; // STEP 3: Decode once calcField.innerHTML = he.decode(calcField.innerHTML, options); // STEP 4: Decode once more calcField.innerHTML = he.decode(calcField.innerHTML, options); } } </script> Hope this helps. -nightowl -
details datapage print multiple records
nightowl replied to DesiLogi's question in General Questions
Hi DesiLogi, For Details page, it's not possible since the next/previous page is not yet available to the browser until you hit the pagination controls. On the other hand, if you're worried about incorrect page breaks on tabular/list reports, you can try wrapping the entire report in a <div> container using the Header/Footer section. And then try if the CSS page-break-after property will work for you: https://developer.mozilla.org/en-US/docs/Web/CSS/page-break-after Hope this helps. -nightowl -
Hi Alwayslost, Yes. We only need to change the second line of the script. Here's the fully revised script: <script> var sortingControl = document.getElementById('asorting'); sortingControl.innerHTML = '<option value="|">No Sort</option>' + sortingControl.innerHTML; </script> Hope this helps. -nightowl
-
HI dspolyglot, I tried this a long time ago and I was able to create a workaround. You can try the following and see if this still works: Add a Header/Footer section to your Gallery/List DataPage. Go to the Footer section. On the footer section's Advanced tab, disable the HTML editor as mentioned in this article: http://howto.caspio.com/faq/web-forms/how-to-disable-html-editor-in-datapage-headerfooter-and-html-blocks/ Then add this code: <script> var sortingControl = document.getElementById('asorting'); sortingControl.innerHTML += '<option value="|">No Sort</option>'; </script> [OPTIONAL] Then go to Search and Report Wizard - Results Page Options and disable AJAX: Hope this helps. -nightowl
-
Hi NeoInJS, Sending an HTTP POST request comes to mind, but this method requires a back-end server to fetch the posted data. Here are the alternatives: Cookies Browser locationStorage or sessionStorage For the first option, cookies must be enabled in your browser. For the second option, you can take a look at my old forum post: Hope this helps. -nightowl
-
Extract Data to Populate Table Columns
nightowl replied to Sheila's question in Tables, Views and Relationships
Hi Sheila, This can be done in multiple ways: JavaScript: You might take a look at my other forum post below, although you might need to tweak the JavaScript a bit. See the REFERENCES section below for the link. Triggers: This is a new feature in the 9.9 release. See below for the link. REFERENCES: Multiple Values Separated by Commas Input: https://forums.caspio.com/topic/6770-multiple-values-separated-by-commas-input/?do=findComment&comment=21222 Triggered Actions (aka Triggers Feature): https://howto.caspio.com/tables-and-views/triggered-actions/ Hope this helps. -nightowl -
Hi dspolyglot, You can try this script inside an HTML block: <script> document.getElementById('EditRecordFIELD_NAME').value = '[@cbTimestamp]'; </script> Hope this helps.
-
Hi oceaim, You can try this revised code: <script> var signatureField = [@field:Signature!]; $(document).ready( function () { var api = $('.sigPad').signaturePad({ displayOnly: true }); api.regenerate(signatureField); } ); </script> Hope this helps.
-
Hi spazz1421, You can check out my forum post: Hope this helps.
-
Hide a row from a tabular report based on the result of a calculated field
nightowl replied to NeoInJS's question in General Questions
Hi NeoInJS, You can try something like this: <div id="row-marker-[@field:Teacher_ID]"></div> <script> var marker = document.getElementById('row-marker-[@field:Teacher_ID]'); var column = marker.parentNode; if ('[@calcfield:1]' === 'Alice') { var row = column.parentNode; row.style.display = 'none'; } </script> Hope this helps. -
Hi EveryPlace, I can that, as per MayMusic's solution, you do have the correct revision for your use case. But since you said that neither method works, i.e. MayMusic's solution or mine, can you please explain a bit further why is that so? -nightowl
-
Check a checkbox when another checkbox is checked
nightowl replied to Mylene's topic in User JavaScript and CSS Discussions
Hi Mylene, You can also try this script: <script> var checkboxesToCheck = [ // TODO: Add here the HTML IDs of checkboxes to check --> 'InsertRecordPublished', 'InsertRecordSubscribed', 'cbParamVirtual2', 'cbParamVirtual3', ]; var vfield = document.getElementById('cbParamVirtual1'); vfield.onchange = function () { checkboxesToCheck.forEach( function (id, index) { document.getElementById(id).checked = vfield.checked; } ); } </script> -
Multiple values separated by commas input
nightowl replied to NeoInJS's question in General Questions
Hi NikkiC, Thanks for the comment. I just noticed that the script is meant to save the CSV values into separate columns (horizontally) and not into separate rows (vertically), as you wish. I need to correct the original reply. Going back to your question, this might need either: a custom trigger, or repeated submission via JavaScript Let me see if I can come up with a different script.
