Queso

Hello @Flowers4Algernon,
Correct! You can also refer to this article for accessing the file with FileStor CDN enabled: 

https://howto.caspio.com/files-and-images/filestor-cdn/

Hi @wimtracking2!
You can also look into this Caspio HowTo article that I've found. When a user reaches the indicated limit, the remaining checkboxes are disabled:
https://howto.caspio.com/tech-tips-and-articles/setting-the-maximum-number-of-listbox-selections-in-forms/

Hi! It seems better if you export the table used for dropdown and do the re-ordering of the list/adding more entries via excel. Then, import it back to the table using Replace action. This is because it is faster to do the re-ordering/adding more entries there, and you have also created a backup of your old list dropdown table.

This sounds like an interesting feature and I was curious so I asked chatGPT.  I didn't continue asking for the code because its not something I need right now, but thought I'd paste the high level guidance. If you do code this and get the functionality working, I'd love to see what you did.
 
To add the capability for a user to tag a comment in a notes field in Caspio and then send an email to the tagged user with the comment, you can follow these steps:
Set up the Notes Field:
In Caspio, create a table with a notes field where users can enter their comments. Add an additional field to store the tagged user's email address. Modify the Notes Field to Include Tagging:
Use a Rich Text Editor or a Text Area with HTML support for the notes field. Implement a tagging system where users can mention other users by typing "@" followed by their username or email address. This can be achieved by using JavaScript and HTML/CSS. Capture the Tagged User's Email:
Implement JavaScript functionality to detect when a user is mentioned/tagged in the notes field. Extract the tagged user's email address from the database or from a user list, based on the username provided. Store the email address in the additional field you created in step 1. Submit the Form:
When the form is submitted, store the comments and the tagged user's email address in the Caspio table. Send Email Notifications:
Utilize Caspio's Email Notifications feature or an external email service (e.g., SMTP, API) to send email notifications. Configure the email notification to be triggered whenever a new entry is submitted. Customize the email content to include the comment and other relevant details. Use the tagged user's email address stored in the table to send the notification specifically to them.

Hi @KG360, you may check this another Caspio forum post for a related JS code: 
 
 

Hi @MariaT,
 
Just to confirm, on the records displayed on your results page, do you want to display the record of who has the highest integer number in a field in the header of your results page?

 

Hi @biota,

Just to add more information regarding ParkLoey's suggestion, you may check this article for more information about Variables in Triggered Action/Tasks: https://www.caspio.com/blog/automate-workflows/#:~:text=3.-,Variables,-Caspio also makes

Trying to combo this post with some others, seen below.
If 'InsertRecordStock_CartItems_Table_Quantity' field value is greater than 'cbParamVirtual7' value, I need to throw an alert and disable/recolor the Submit button. I also want to put a red border around the Quantity field.
The keyup event for Quantity is working. If the user puts in a value that is greater than Virtual 7 value, it will pop up an alert and also disable the Submit button. 
My problem is with the styling of the Submit button and the Quantity field. Also, the BeforeFormSubmit function is throwing an error, I believe because it is also trying to run the DataPageReady/Keyup event at the same time (that is where the error shows, on document.querySelector('[id*=InsertRecordStock_CartItems_Table_Quantity]').addEventListener('keyup', function)).
document.addEventListener("BeforeFormSubmit", function(e){ var quantNum = document.querySelector("input[id^='cbParamVirtual7']").value; var stockNum = document.getElementById('InsertRecordStock_CartItems_Table_Quantity').value; if(stockNum = 0){ e.preventDefault(); alert("This item is not in stock."); } }); document.addEventListener('DataPageReady', function (event) { document.querySelector('[id*=InsertRecordStock_CartItems_Table_Quantity]').addEventListener('keyup', function() { var stockNum = document.querySelector("input[id^='cbParamVirtual7']").value; var quantNum = document.getElementById('InsertRecordStock_CartItems_Table_Quantity'); if(quantNum.value > stockNum){ document.querySelector("input[name='Submit']").style.backgroundColor = "grey !important"; document.querySelector("input[name='Submit']").disabled = true; quantNum.style.border = "2px solid red !important;"; alert("Not enough in stock for your order.") } }) });  
 
Any help would be appreciated.
 
 
 

Hi! It seems better if you export the table used for dropdown and do the re-ordering of the list/adding more entries via excel. Then, import it back to the table using Replace action. This is because it is faster to do the re-ordering/adding more entries there, and you have also created a backup of your old list dropdown table.

Thanks. Useful vid!

Hi @biota,

You can check the following recorded live stream for more information about creating One-to-Many Relationships With Subforms: https://www.youtube.com/watch?v=Mud33bhZbDc

@biotaBut Relationships, in general, are really important since Caspio uses SQL Server which is a relational database.
Relational Database breaks the data into multiple different tables that have Relationships.
Normalization is the process of organizing data in a database. This includes creating tables and establishing relationships between those tables.
The main benefits of Data Normalization are:
Better and quicker execution / better performance              (Imagine that there is a Report built on a huge Table that stores not normalized data, the Search on a Report will take more time than the Search on a normalized Table)
Reduces redundant data To skip so-called side effects such as Insertion anomaly/Update anomaly/Deletion anomaly               For example, you need to update the customer`s email. This can be done in the Customers_TBL within one record. 
             Imagine, that the Tables are not normalized and all the data is stored in the Orders_TBL, including the Customer`s name, email, phone, etc. In this case, email must be updated in multiple records and some errors can happen. If the update is only partially successful – the customer`s address is updated on some records but not others – then the relation is left in an inconsistent state.
 
Summary: it is crucial to create normalized Tables and to have Parent Keys and Foreign Keys to identify the records in Parent and Child Tables.
-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
Let`s use an example with Customer_TBL, Products_TBL, and Orders_TBL.
Customer_TBL stores unique customers and Products_TBL stores unique products. So, these are so-called Parent tables. And it is an easy task to set up a Parent Key for these tables.
We just need to use a Field with any auto-generated data type (Autonumber, Random ID, etc.).
And usually, we need to configure DataPage to stamp Foreign Keys(Customer_ID and Product_ID) to the Orders_TBL (as you mentioned).
For example, Customer_ID can be taken from the Authentication parameters:

 
And Product_ID can be taken from the Lookup table:

 
Summary: As a result, the Orders_TBL is related to the Customers_TBL and Products_TBL with many-to-many relationships because Foreign Keys are stored in the Orders_TBL.
This way we can understand which product and which customer each order belongs to. 
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
Now, what are the benefits of this table design?
 
Actually, it is possible to manage some use cases only when Tables have relationships.
 
1) For example, you need to create a Report DataPage to display information about the Orders and about the Customers.
To achieve this, we can create a View and join these 2 Tables. And to join them, we definitely need to store Customer_ID in the Orders_TBL because this field is needed to join the Tables.
Tables are joined on Customer_ID:

Report example that is built on this View:
 

 
2) Another example: let`s say a week after the order was created you want to send a post-purchase email.
We can utilize a Task for this use case. To get the customer`s email and to populate the email body with the customer`s name and the name of the purchased product, we need to join all 3 Tables. 
And again to join them we need to have appropriate Foreign Keys in the Orders_TBL.


Email:

3) One more example. Let`s say you need to create a Report with the list of customers. And to open another Report for each customer with the list of orders of this customer.
For that, I can create a Report that is based on the Customers_TBL. In the HTML block, I added a link to a second Report that is based on the OrdersTBL and passed the customer`s ID as a parameter to filter the records in the OrdersTBL that are related to a specific customer. 
HTML block in the Customer`s report to pass the ID of the customer:

Report with the list of customers:

Receiving parameters on the Order`s Report:
 

The Report that is opened when I check orders of John Doe (so, after the 'Check Order' link is clicked for John Doe record):
 

And again it was possible to create a Report like this because the Customer_ID is stored in the Orders_TBL as a foreign key. 
 
I hope I understood your question correctly and this information is helpful.
If not and you still have questions, please update this thread. 

Hello @KPCOZZ,
According to the forum post https://forums.caspio.com/topic/4377-js-guide-caspio-form-elements/  these form elements can be referenced by id: Text Field/Text Area/Dropdown/Checkbox/Listbox/Hidden.
Ads for the Cascading AutoComplete, as I can see it cannot be referenced just by id because it looks like that:


The part after the InsertRecorduser_email is a so-called uniqueSuffix that is changed every time the DataPage is loaded/refreshed.
You may want to learn more about the uniqueSuffix https://howto.caspio.com/datapages/ajax-loading/

So, please use the CSS selector that selects an element that starts with the corresponding id.
And for me it works only with the !important property.
Please test this one:
<style> input[id^="InsertRecordBook_Unit"]{ background-color: #E0E0E0 !important; } </style>  

I have a submission form and want to change the background color of one of the fields. The form element is Cascading AutoComplete and that seems to be the issue with the following code as I have tried substituting the field name "Booking_Unit" for other Text Field form element fields on the form and it works for those fields. 
<style>
#InsertRecordBook_Unit {
background-color: #E0E0E0;
}
</style>
 
Any suggestions please.

Hello,

Thank you for the question and solution!

Just to add, the following article lists all available functions that you can use for your Calculated Field and please note that some functions such as SysUTCDateTime() are not available in the Table level's Formula Field: https://howto.caspio.com/function-reference/#:~:text=Date-,SysUTCDateTime(),-Current system timestamp

Hello @Afzal1,

This is very interesting to check. May you please provide us a DataPage URL that has this authentication so we can inspect its elements?

Thanks for feedback @Queso, your link to the another topic did it 

Hello @Skovgaard,

It seems that the solution you need is a Triggered Action setup. On the screenshot that you provided, upon submit it will create 30 records wherein each records should have Type_ID = 26 and Registration ID from = 1, is that correct? Also, where should the records be inserted upon submit? 

You can visit this similar topic for a Trigger setup: 
 

Hi Thead,
For you to change the number format in a tabular data page and change the color of negative numbers to red, please follow the below steps:
- Instead of showing the column with negative values, create an HTML block.
- Click source or disabled the HTML editor.
 
- Copy and paste this script.

<div id="mydiv[@field:ID]"></div>
<SCRIPT LANGUAGE="JavaScript">


if ("[@field:Value]" <0){

document.getElementById("mydiv[@field:ID]").innerHTML ="<span style='color:red;'> [@field:Value] </span>";

} else{
 
document.getElementById("mydiv[@field:ID]").innerHTML ="[@field:Value]";

}
 
 
</SCRIPT>

Hope this helps.

Hi!

Maybe you can add another aggregate function element on the report and paste the following formula there: 
CASE 
WHEN Round(AVG([@field:Final]),0) <= 75 THEN 'Failed'
WHEN Round(AVG([@field:Final]),0) > 75 AND Round(AVG([@field:Final]),0) <= 90 THEN 'PROMOTED'
WHEN Round(AVG([@field:Final]),0) > 90 AND Round(AVG([@field:Final]),0) <= 94 THEN 'PROMOTED WITH HONOR'
WHEN Round(AVG([@field:Final]),0) > 94 AND Round(AVG([@field:Final]),0) <= 97 THEN 'PROMOTED WITH HIGH HONOR'
WHEN Round(AVG([@field:Final]),0) > 97 AND Round(AVG([@field:Final]),0) <= 100 THEN 'PROMOTED WITH HIGHEST HONOR'
ELSE ''
END

Change the Final field in the formula to the field name of your 'Final' column. Hope this helps!

Hi, 

I used this on one of my DataPages; I needed it to be green because I'm trying to create a "Jungle"-style DataPage.
As far as I know, the accent-color property in CSS is capable of re-tinting the accented color of form controls provided by the browser’s default styles with a custom color value. 
With that being said, we are capable to change the color to the following HTML elements as well especially the Caspio checkbox:
<input type="checkbox">   
<input type="range">
<progress>

 

Hi there. I was trying to find a way to preview a PDF file before it is uploaded in a DataPage. The flow described in this article works for images only: https://howto.caspio.com/tech-tips-and-articles/advanced-customizations/preview-an-image-before-it-is-uploaded-in-a-datapage/

Here is a solution I came up with:
<script> const HTMLFileInput = document.getElementById("EditRecordFile_1"); HTMLFileInput.addEventListener("change", event => { const src = URL.createObjectURL(event.target.files[0]); const outputWidth = window.getComputedStyle(HTMLFileInput.parentElement.parentElement).getPropertyValue('width') const outputHeight = parseInt(outputWidth.replace('px',''))*1.3+'px' if(document.querySelector('#output')==null) { HTMLFileInput.parentElement.insertAdjacentHTML('afterend', `<iframe src="${src}" width="${outputWidth}" height="${outputHeight }" id="output" class="cbFormFieldCell">IFRAME IS NOT SUPPORTED IN YOUR BROWSER</iframe>`) } else { document.querySelector('#output').setAttribute("src", src) } }) </script>
Just substitute EditRecordFile_1 with id of your file input. You can also tweak the value of width and the height of the iframe so it fits your usual pdf file size.

Hope this helps