Jump to content

KlisaN137

Caspio Ninja
  • Posts

    26
  • Joined

  • Last visited

  • Days Won

    6

Everything posted by KlisaN137

  1. Hi @MarkMayhrai, In order to prevent submission you may check the following Forum Post: As the autosubmit part, I'm guessing you are using JS from the page: To prevent submission if there is an error in Form, you may use this code instead: <script type="text/javascript"> document.addEventListener('DataPageReady', function (event) { const error = document.querySelector('div[data-cb-name="HeaderErrorMsg"]'); if(!error){ if(document.getElementById("caspioform")) { document.getElementById("caspioform").style.display = 'none'; setTimeout('document.forms["caspioform"].submit()',1000); } } }); </script> I'm not sure how are you checking if the entry is a duplicate? What is the indication that some record is duplicate?
  2. @jbloome for implementing it on Details, instead of 'InsertRecordFIELDNAME', you must use 'EditRecordFIELDNAME', and place the code not in the Footer of the page, but add a new HTML block element just after all other elements, and put the code there. Also, additional event listener is needed, here is the entire code: <script> document.addEventListener('DataPageReady', function (event) { const fields = ['EditRecordPhone1','EditRecordPhone2', 'EditRecordPhone3']; const inputs = []; for (let f of fields){ inputs.push(document.querySelector('#' + f)); } for(let i of inputs){ i.maxLength = 14; i.onkeyup = telephize; i.onkeydown = telephize; } function telephize(v_e) { // this.value = this.value.replace( /\D+/g, "" ).replace( /([0-9]{1,3})([0-9]{3})([0-9]{4}$)/gi, "($1) $2-$3" ); //mask numbers (xxx) xxx-xxxx v_e = v_e || window.event; if (v_e.keyCode >= 65 && v_e.keyCode <= 90) { this.value = this.value.substr(0, this.value.length - 1); return false; } else if (v_e.keyCode >= 37 && v_e.keyCode <= 40) { return true; } var v_value = (this.value.replace(/[^\d]/g, '')); if (v_value.length == 7) { this.value = (v_value.substring(0, 3) + "-" + v_value.substring(3, 7)); } else if (v_value.length == 10) { this.value = ("(" + v_value.substring(0, 3) + ") " + v_value.substring(3, 6) + "-" + v_value.substring(6, 10)); }; } document.querySelector('#caspioform').onsubmit = function(e) { e.preventDefault(); if (input.value.length >= 14){ this.submit(); } else { alert('Please input a valid phone number'); input.focus(); } } }); </script>
  3. Hi @telepet If it is a Tabular Report, I'm guessing you want this on Details Page? Yes, you need to adjust Element ID, in this case, where you see 'EditRecord' and 'Remove', just follow the same logic. Also, add another part to get rid of the label 'remove': <script> var UploadA='[@field:FIELDNAME]'; if (UploadA.length>0) { document.getElementById("EditRecordFIELDNAME").style.visibility = 'hidden'; document.getElementById("EditRecordFIELDNAMERemove").style.visibility = 'hidden'; document.querySelector('label[for="EditRecordFIELDNAMERemove"]').style.visibility = 'hidden'; } </script> Please instead of using the code in the Footer of the page, add another HTML block element just after the last element, and put the code in it, this will execute code again when the file is uploaded after using Update button.
  4. @telepet Could you elaborate a bit more about the DataPage setting? What is the DataPage Type on which you are using this?
  5. 1) You can store picture files, and just reference it on a DataPage, it will be shown as picture: https://howto.caspio.com/files-and-images/uploading-files-and-images/ 2) If you are storing quotes in table with fields quote and date, so every quote is having the corresponding date, you could use Calculated Value to find the right quote based on the date: SELECT Quote FROM Quotes WHERE Date = CONVERT(DATE, SysUTCDateTime()) 3) For setting a background, please check the following articles: https://howto.caspio.com/tech-tips-and-articles/advanced-customizations/how-to-dynamically-change-the-background-of-a-results-page https://howto.caspio.com/faq/styles-and-localization/how-to-use-an-image-as-form-background/ https://howto.caspio.com/tech-tips-and-articles/advanced-customizations/customize-background-and-font-colors-in-report-datapage/
  6. Hi @Miguel, From which table is the above screenshot, with additional fields, TableD?
  7. Hi @jbloome and @Meekeee We can also use arrays and loops to further reduce the code: <script> const fields = ['InsertRecordPhone1','InsertRecordPhone2', 'InsertRecordPhone3']; const inputs = []; for (let f of fields){ inputs.push(document.querySelector('#' + f)); } for(let i of inputs){ i.maxLength = 14; i.onkeyup = telephize; i.onkeydown = telephize; } function telephize(v_e) { // this.value = this.value.replace( /\D+/g, "" ).replace( /([0-9]{1,3})([0-9]{3})([0-9]{4}$)/gi, "($1) $2-$3" ); //mask numbers (xxx) xxx-xxxx v_e = v_e || window.event; if (v_e.keyCode >= 65 && v_e.keyCode <= 90) { this.value = this.value.substr(0, this.value.length - 1); return false; } else if (v_e.keyCode >= 37 && v_e.keyCode <= 40) { return true; } var v_value = (this.value.replace(/[^\d]/g, '')); if (v_value.length == 7) { this.value = (v_value.substring(0, 3) + "-" + v_value.substring(3, 7)); } else if (v_value.length == 10) { this.value = ("(" + v_value.substring(0, 3) + ") " + v_value.substring(3, 6) + "-" + v_value.substring(6, 10)); }; } document.querySelector('#caspioform').onsubmit = function(e) { e.preventDefault(); if (input.value.length >= 14){ this.submit(); } else { alert('Please input a valid phone number'); input.focus(); } } </script>
  8. Hi @kcastagnaro, Did you also joined (in the table variable level) Nurse ID (or name) from user table with the field that represent Nurse ID in the screening table?
  9. Hi, @drckarcher, In order to show some field on the Form DataPage from the entry that has most recent timestamp, we can use the Virtual Field with Calculated Value with the following SQL statement: SELECT TOP(1) field_we_want_to_show FROM tbl_test ORDER BY Time_Stamp_Field DESC I'm not sure if I understand would you like to show last allocation based on some value from other field, so could you please elaborate a little bit more about the issue?
  10. @skwaler Workaround that comes to my mind is to maybe use Multipage Form? https://howto.caspio.com/tech-tips-and-articles/common-customizations/how-to-create-a-multi-page-form/
  11. Hi @JenKri, In order to show only records with Status Active, you might want to make a new View to filter out active Exams, and then use that View in your Listbox element. More on filtering using Views you can find on the article: https://howto.caspio.com/tables-and-views/what-are-views/creating-a-view-to-filter-data/
  12. Hi @CoffeeLover, Thank you for explanation. As far as I can see, because the values of authentication fields are taken at the moment of login, they remain unchanged during the entire session. Only way to refresh data is starting a new session - log out and then again log in. I found this Forum thread about that also: I'm guessing that for required workflow, you might need to use additional table.
  13. Hi @CoffeeLover, To update user authentication fields, you can use Single Record Update DataPage, with the Users table as the Data Source. Then you can restrict access to the page based on Authentication: https://howto.caspio.com/datapages/forms/update-forms/ I'm not sure what do you mean by "How can I have the users authfields updated if changed? (without them logging off and loggging back in)", could you specify a little bit more?
  14. @skwaler As I checked, it may not be possible to update the parent DataPage when data from it are updated on the separate pop up page. Refer to the below Posts: It is possible to refresh the page at some time interval, but I suspect that is not the intended workflow here... Have you considered using Inline Edit or Grid Edit on your Report DataPage instead of pop up? That way, if records are edited, the DataPage is updated. Please refer to the: https://howto.caspio.com/datapages/reports/data-editing-options-in-reports/ Anyway, I will continue to look onto this issue, and will update here if I find something.
  15. Hi @skwaler, Did you tried to make popup using the following article? https://howto.caspio.com/tech-tips-and-articles/common-customizations/how-to-generate-link-menus-and-popup-windows/
  16. Hi @CoffeeLover, You can use the following code to check if there is an error prior to submit, and submit only if there are no errors: <script type="text/javascript"> const error = document.querySelector('div[data-cb-name="HeaderErrorMsg"]'); if(!error){ setTimeout('document.getElementById("caspioform").submit()',1); } </script>
  17. Hi @kpcollier Great spot by you, the proposed solution does not work if we have search form, and we are experiencing some strange behavior - hiding some other fields as you described it during consecutive search. The reason for this is because it appears that when 'Search' button is clicked, the code from footer is not executed only once, but a couple of times. In order to execute the code only once, when page is first reloaded, we can add an IF statement before the actual code, which will check how many columns are still there: <script> document.addEventListener('DataPageReady', function (event) { const check = document.querySelectorAll('table[data-cb-name="cbTable"] th'); /* Just set the number in IF below to the number of columns you have BEFORE hiding anything */ if(check.length===9){ // code goes here } }); </script> Additionally, I refactored whole code to be able to hide any number of columns without adding redundant code, just add or edit arguments in function deleting : <script> document.addEventListener('DataPageReady', function (event) { const check = document.querySelectorAll('table[data-cb-name="cbTable"] th'); if(check.length===9){ const deleting = (...args) =>{ let label, values for(let a of args){ label = document.querySelector(`table[data-cb-name="cbTable"] th:nth-of-type(${a})`); values = document.querySelectorAll(`table[data-cb-name="cbTable"] td:nth-of-type(${a})`); label.parentElement.removeChild(label); values.forEach(el => { el.parentElement.removeChild(el); }); } } /* In below function call, just put any number of column you want to hide, but in reverse order - from highest number to the lowest */ deleting(8,5); } }); </script>
  18. For the columns in a table in SQL, there is a maximum limit of 1024 columns in a table, I imagine same applies here.
  19. If you want to place Timestamp in Submission Form, you can use Virtual Field and set it in Advanced tab to Receive value or parameter like in the screenshot: The result is as follows: In the Report DataPages, you can just use Calculated field with value SysUTCDateTime() or SysDateTime()
  20. For the Submission Form, the code is a little bit different: <script> document.addEventListener('DataPageReady', () => { /* Select the input element of the Calculated Value */ document.querySelector('input[name="InsertRecordSum_Of_Values"]').addEventListener('change',()=>{ const replacing = (obj,whatToReplace,withWhatToReplace) => { obj.forEach(record => { const modified = record.textContent.replaceAll(whatToReplace, withWhatToReplace); record.textContent = modified; }); } const dollar = '$'; const euro = '€'; const pound = '£'; /* Select all Calculated Fields */ const calculated = document.querySelectorAll('.cbFormCalculatedField'); switch('[@authfield:Localization]'){ case 'Europe': replacing(calculated, dollar, euro); break; case 'Britain': replacing(calculated, dollar, pound); break; case 'USA': replacing(calculated, dollar, dollar); break; } }); }); </script> The result is the following when the user with European localization is logged:
  21. It is possible to change the currency sign dynamically, but only with a JavaScript solution. For the Report DataPage, set the fields formatting to US dollar ('$'). Then the following code should be put in the Footer of the DataPage: Note that if you are not using all the elements in the Report as described in the code, just delete the parts using that elements. <script> document.addEventListener('DataPageReady', () => { /* Declaring the function for replacing the specific text value in some array of HTML elements */ const replacing = (obj,whatToReplace,withWhatToReplace) => { obj.forEach(record => { const modified = record.textContent.replaceAll(whatToReplace, withWhatToReplace); record.textContent = modified; }); } /* Selecting all cells where we want to replace signs */ let table = document.querySelectorAll('.cbResultSetTableCellNumberDate'); // Table cells let htmlBlocks = document.querySelectorAll('.cbResultSetTableCell'); // HTML blocks inside the table let calculated = document.querySelectorAll('.cbResultSetCalculatedField'); // Calculated values in the table let sumAggregate = document.querySelectorAll('.cbResultSetTotalsDataCellNumberDate'); // Aggregates Total let aggregate = document.querySelectorAll('.cbResultSetGroup1LabelCellNumberDate'); // Aggregates in Group-level aggregations const dollar = '$'; const euro = '€'; const pound = '£'; /* Calling the Function 'replacing' for the declared elements, with arguments, based on the authentication field */ switch('[@authfield:Localization]'){ case 'Europe': replacing(table, dollar, euro); replacing(htmlBlocks, dollar, euro); replacing(aggregate, dollar, euro); replacing(sumAggregate, dollar, euro); replacing(calculated, dollar, euro); break; case 'Britain': replacing(table, dollar, pound); replacing(htmlBlocks, dollar, pound); replacing(aggregate, dollar, pound); replacing(sumAggregate, dollar, pound); replacing(calculated, dollar, pound); break; case 'USA': // Note that this case is redundant if using the dollar as default sign replacing(table, dollar, dollar); replacing(htmlBlocks, dollar, dollar); replacing(aggregate, dollar, dollar); replacing(sumAggregate, dollar, dollar); replacing(calculated, dollar, dollar); break; } }); </script> In the case you are using the "In Line Insert", then the part with declarations of variables "table" and "htmlBlocks" should be a replaced with the following code: /* Delete the variable "htmlBlocks" and replace the declaration of variable "table" with the code */ let tableParent = document.querySelectorAll('tr[data-cb-name="data"]') let table = []; tableParent.forEach(el => { let cells = el.querySelectorAll('.cbResultSetTableCellNumberDate'); table.push.apply(table, cells); let htmlBlocks = el.querySelectorAll('.cbResultSetTableCell'); table.push.apply(table, htmlBlocks); }); Also, delete the "replacing(htmlBlocks, currency, currency)" from Switch statement in this case. The resulting Report will look something like this if the user with European localization is logged in:
  22. Do you have some deployed DataPage on this, it would be helpful to see the whole thing?
  23. Alternately, if you want to show the parent field as "Display Only", but the DataPage doesn't permit using the Virtual Field element (Bulk Edit configuration, etc), set the field to "Text Field" and add the following code to the Footer of the Page (Bulk Edit Configuration): <script> if(typeof parentDisplayOnlyElement === "undefined"){ let parentDisplayOnlyElement = document.querySelector('input[name="BulkEditProductCategory"]'); // Select the input in the element you want to be just displayed parentDisplayOnlyElement.disabled = true; parentDisplayOnlyElement.style.border = 'none'; } </script>
  24. This hiding of the columns can also be achieved by using only JavaScript in the Footer: <script> document.addEventListener('DataPageReady', function (event) { let label = document.querySelector('table[data-cb-name="cbTable"] th:nth-of-type(8)'); // Select the label of eighth column let values = document.querySelectorAll('table[data-cb-name="cbTable"] td:nth-of-type(8)'); // Select all the values in the eighth column /* Removing the selected fields */ label.parentElement.removeChild(label) values.forEach(el => { el.parentElement.removeChild(el) }); /* If we want to remove additional columns */ label = document.querySelector('table[data-cb-name="cbTable"] th:nth-of-type(5)'); // Select the label of fifth column values = document.querySelectorAll('table[data-cb-name="cbTable"] td:nth-of-type(5)'); // Select all the values in the fifth column label.parentElement.removeChild(label) values.forEach(el => { el.parentElement.removeChild(el) }); }); </script> Main difference between this and approach with CSS is that here columns are entirely removed from the page, and not just hidden - in the CSS approach you could still find the elements if you inspect the page, and access the information in them, but in this JavaScript approach, they are completely removed from the page. Notice however, that in the above example we are first removing the column that comes after and work our way to the beginning. If we would also like to remove tenth column, we would put that code before the code for removal of the eighth.
  25. If we want to show some column in the Tabular Report just for the user who is also Administrator, but for the regular Users we want to hide it, below is the example (note that this is one Report DataPage - Tabular Report): Admin view can see the Agent Name column: User view can see the table without Agent Name column: In order to achieve this functionality, we need to add the following code to the DataPage Result page footer section: <script> document.addEventListener('DataPageReady', function (event) { /* If user is not Admin, we will remove the column */ if('[@authfield:Admin^]'==='No'){ /* We need to select Parent node of the Table Label and remove the desired child element (nth-child(2)) */ let agentLabelParent = document.querySelector('tr[data-cb-name="header"]'); let agentLabel = document.querySelector('tr[data-cb-name="header"] th:nth-child(2)'); agentLabelParent.removeChild(agentLabel); /* There can be multiple rows in the Tabular Report, so we need to select them all */ let agentNameParents = document.querySelectorAll('tr[data-cb-name="data"]'); /* Using the loop to pass through each row, and remove the entry (nth-child(2)) we don't need */ agentNameParents.forEach(parent => { let agentName = parent.querySelector('tr[data-cb-name="data"] td:nth-child(2)'); parent.removeChild(agentName); }); } }); </script>
×
×
  • Create New...