Jump to content

Hastur

Caspio Guru
  • Content Count

    129
  • Joined

  • Last visited

  • Days Won

    10

Everything posted by Hastur

  1. Hello @KevinCeres You can achieve this using standard features. You can add the Virtual field to your form with 2 option: stay at form after submission or go next. The values of these radio buttons should be links. Based on the choice, your user will be redirected to the same page (reload) or to a new one. Check the print screens:
  2. @guardmetrics The calculated field should look like this in: CAST((( DATEDIFF(minute, [@field:Patrol_Activity_Database_Date], [@field:Patrol_Activity_Database_1_Date]) - (DATEDIFF(minute, [@field:Patrol_Activity_Database_Date], [@field:Patrol_Activity_Database_1_Date]) % 60) ) / 60) AS nvarchar) + ':' + CAST((DATEDIFF(minute, [@field:Patrol_Activity_Database_Date], [@field:Patrol_Activity_Database_1_Date]) % 60) AS nvarchar) Also you may find other examples here -
  3. @Vipul There are two ways to implement such a workflow. 1. You can create triggered action to update to Total price of the order when the users submits new item. It most cases, it requires 3 triggers on each event (insert, update, delete) and it is not the easiest thing to implement. 2. The second approach is to create the calculated field on the DataPage level to sum prices of all items per order ID. Example: SELECT SUM(Item_Price) FROM Order_tbl WHERE Order_ID = [@field:Order_ID] You need to change the names of the fields and tables according to your local names.
  4. @DesiLogi Hello! To implement Such a iframe, your files should do the following: 1. Place PDF files in some folder 2. Enable the CDN FileStore Also, the code should look like this: <script type="text/javascript"> document.addEventListener('DataPageReady', embed_pdf); function embed_pdf(){ var pdf_link = "[@field:PDF_File/]"; if(pdf_link === "") { return null; } var google_link= "https://docs.google.com/gview?url="; var google_param = "&embedded=true"; var encoded_pdf_link = encodeURIComponent(pdf_link); var iframe_window = document.getElementById("iframe_pdf"); iframe_window.style.display = "block"; iframe_window.src=google_link + encoded_pdf_link + google_param; document.removeEventListener('DataPageReady', embed_pdf); } </script> You can place the code with iframe in any place of your DataPage. <iframe id="iframe_pdf" style="width:80%; height: 1100px; display: none;" align="middle" frameborder="0"></iframe>
  5. @rush360 The script you use now does not make any sense as it sets the .onload listener at the moment when DataPage is ready. It is like you trying to go home when you are already at home... You may create function to check each parameter and then hide the appropriate block. Example: <script type="text/javascript"> function hideBlocks() { var zipValue = '[@field:Zip3]'; if(zipValue === '') { document.getElementById('box1').style.display = 'none'; } document.removeEventListener('DataPageReady', hideBlocks); } document.addEventListener('DataPageReady', hideBlocks); </script> <!-- Your HTML code --> <div id="box1" style="background:#eee;border:1px solid #ccc;padding:5px 10px;"> <p>[@field:Address3_Type] [@field:Verb3]</p> <br /> <p>[@field:Address3_Time@] [@field:Address3_Time*]</p> <hr /> <p>Address:</p> <br /> <p>[@field:Address3]</p> <br /> <p>[@field:City3], [@field:State3]</p> <br /> <p>[@field:Country3], [@field:Zip3]</p> </div>
  6. Hello @HughOD You may add the wrapper to your DataPage using header and footer. Here is the example for responsive DataPages: <!-- Code in the Header starts --> </header> <div class="YOUR_CUSTOM_CLASS"> <header> <!-- Code in the Header ends --> DATAPAGE <!-- Code in the Footer starts --> </footer> </div> <footer> <!-- Code in the Footer ends --> And for the non-responsive DataPages: <!-- Code in the Header starts --> </div> <div class="YOUR_CUSTOM_CLASS"> <div> <!-- Code in the Header ends --> DATAPAGE <!-- Code in the Footer starts --> </div> </div> <div> <!-- Code in the Footer ends --> Also, you may find a lot of information about CSS selectors here - https://www.w3schools.com/cssref/css_selectors.asp
  7. @HughOD I cannot replicate the issue. May you try to open the page again?
  8. @steven9 In Caspio you need third table to create many-to-many relationship. Here is the video about this thing -
  9. @roattw You may try using the Section to group these 3 field and set the amount of columns as 3.
  10. @roattw Do you use Sections of "Continue next element on the same line" checkbox to place fields in this way?
  11. Hello @Alwayslost You may change the style of the Calendar in the Style section. You even can upload your custom images. See the example:
  12. Hello @gregbovenkerk! You may use the JS code to update the chart with custom Values for each week number of the year. I have found one web site to get the values for each week number - https://www.epochconverter.com/weeks/2020 Obviously, you will need to update the Array of custom values each year, but it works perfectly! See the example of the code: <script type="text/javascript"> var myVar = setInterval(myTimer, 1000); function myTimer() { if(Highcharts) { const customMonths = [ 'December 30, 2019', 'January 6, 2020', 'January 13, 2020', 'January 20, 2020', 'January 27, 2020', 'February 3, 2020', 'February 10, 2020', 'February 17, 2020', 'February 24, 2020', 'March 2, 2020', 'March 9, 2020', 'March 16, 2020', 'March 23, 2020', 'March 30, 2020', 'April 6, 2020', 'April 13, 2020', 'April 20, 2020', 'April 27, 2020', 'May 4, 2020', 'May 11, 2020', 'May 18, 2020', 'May 25, 2020', 'June 1, 2020', 'June 8, 2020', 'June 15, 2020', 'June 22, 2020', 'June 29, 2020', 'July 6, 2020', 'July 13, 2020', 'July 20, 2020', 'July 27, 2020', 'August 3, 2020', 'August 10, 2020', 'August 17, 2020', 'August 24, 2020', 'August 31, 2020', 'September 7, 2020', 'September 14, 2020', 'September 21, 2020', 'September 28, 2020', 'October 5, 2020', 'October 12, 2020', 'October 19, 2020', 'October 26, 2020', 'November 2, 2020', 'November 9, 2020', 'November 16, 2020', 'November 23, 2020', 'November 30, 2020', 'December 7, 2020', 'December 14, 2020', 'December 21, 2020', 'December 28, 2020' ]; Highcharts.charts[0].update({ xAxis: { categories: customMonths } }); myStopFunction(); } return null; } function myStopFunction() { clearInterval(myVar); } </script> You should insert this code into the header of the Chart page. Do not forget to disable the HTML editor before you insert the code!
  13. Hello @CMorris, You can try to add the "TOP 1" closure to the #inserted SELECT. Example:
  14. Hello @roattw I think this solution will not work with responsive. If you leave the open HTML tag in the HTML block with the responsive enabled, the tag will be closed automatically. But without responsive it still can work perfectly.
  15. Hello @mhand To implement such a workflow you may use JavaScript. Paste this code into the Header of the Submission form: <script type="text/javascript"> function inputHandler() { document.getElementById('InsertRecordTrxnType').value = document.getElementById('cbParamVirtual1').value //cbParamVirtual1 needs to be changed according to the name of the Virtual field you have in your DataPage } document.addEventListener('BeforeFormSubmit', inputHandler); </script> Note that cbParamVirtual1 needs to be changed according to the name of the Virtual field you have in your DataPage. Also, do not forget to Disable the HTML editor of the header in the advanced section.
  16. @Ed727 Hi! You may use the Grouping feature to group the repeating values and show them just once. Just check this article - https://howto.caspio.com/datapages/reports/advanced-reporting/data-grouping/ Hope this helps!!
  17. Hello @deemuss It is possible using additional JS code. You need to insert the following code into the Header of the Chart result section: <script type="text/javascript"> document.addEventListener('DataPageReady', chartUpdateHandler) function chartUpdateHandler(event) { var cleaner = function(interv) { clearInterval(interv); } let interv = setInterval(() => { if (!!Highcharts.charts[0]) { console.log(Highcharts.charts[0]); Highcharts.charts[0].update({ xAxis: { title: { margin: 100 //change this value to change the space } }, yAxis: { title: { margin: 100 //change this value to change the space } } }); cleaner(interv); } }, 200); } </script> Note that you need to disable the HTML editor of the Header in the Advanced section.
  18. Hi @deemuss You may use this code to implement such a workflow: <script type="text/javascript"> function inputHandler(event) { console.log(event); var options = event.target.childNodes var selectedOptions = ''; for(let i = 0; i < options.length; i++) { if (options[i].selected) { selectedOptions += `${options[i].value}, `; } } document.getElementById('cbParamVirtual1').value = selectedOptions.substring(0, selectedOptions.length - 2); // Here you may change the ID (cbParamVirtual) of needed input to insert the value of the choosen elements } function assignEvent() { var elem = document.getElementById('InsertRecordtext'); elem.multiple = true; elem.addEventListener('input', inputHandler); document.removeEventListener('DataPageReady', assignEvent); } document.addEventListener('DataPageReady', assignEvent); </script> You will have the option to multi-select elements from list box with ctrl button pressed. The only thing you need to change is the input to insert the chosen values. This code needs to be inserted into the header of the submission form. Do not forget to disable the HTML editor in the advanced section.
  19. I have the up to date version of this code which is friendly with AJAX loading of the datapages: <script type="text/javascript"> function customAlert() { alert ('Form was submitted'); } document.addEventListener('BeforeFormSubmit', customAlert); </script>
  20. @Leon13 I think that the best approach is to let your users to either expand all the groups or use the default option. To make it works, you need to add this code to the Footer of the Result set: <script type="text/javascript"> function customClick() { var elems = document.getElementsByClassName('cbResultSetShowHideGroupText'); for(let i = 0; i < elems.length; i++) { if(elems[i].children[0].alt === "expand icon") { elems[i].click(); } } } function assignEvent() { document.getElementById('expandAll').addEventListener('click', customClick); document.removeEventListener('DataPageReady', assignEvent); } document.addEventListener('DataPageReady', assignEvent); </script> And this code to the Header of the result set: <button id="expandAll">Expand All</button> Please note that you need to disable the HTML editor of the Header/Footer. You can make this in the Advanced section.
  21. @Thewf If you want to make API calls and not disclose the credentials, you should make this calls on the server side. So you need to have your own server with all the code related to the REST API calls. At the moment, there is no option to make calls directly from Caspio. The only exception is making calls using JS but it opens your credentials, which is unacceptable.
  22. @guardmetrics The only way to create the authentication using Caspio REST API is to store the passwords as the text data type, but not in the password data type In this case, you will be able to compare the values and set up the logic to authenticate the users. The biggest disadvantage is that the text data type is not encrypted as the Password field.
  23. @mgredmond Can you send me the Deploy URL of this datapage? You can send in private messages. I will check if it can be done using CSS
  24. @NickO I think, it is only possible using approach with 3 datapages
×
×
  • Create New...