Jump to content

Vitalikssssss

Caspio Evangelist
  • Content Count

    532
  • Joined

  • Last visited

  • Days Won

    54

Reputation Activity

  1. Thanks
    Vitalikssssss got a reaction from HeyItsDoug in Display results without clicking searching button   
    Hi @achatwani,
    Please try the following JavaScript:
    <script type="text/javascript"> document.addEventListener('DataPageReady', function (event) { var suffix = event.detail.uniqueSuffix; document.querySelector(".cbFormSelect").addEventListener("change", myFunction); function myFunction(){ var button = document.querySelector(`#searchID${suffix}`); if(button) { button.click(); } } }); </script> Place it in the Footer of Search Form and make sure that you have disabled HTML editor prior to inserting the code.
    Hope this helps.
    Regards,
    vitalikssssss
     
  2. Thanks
    Vitalikssssss reacted to Bloom in Disable Autocomplete   
    /* Turn autocomplete off  on form*/ 
    document.getElementById("caspioform").setAttribute("autocomplete", "off"); 
     
    /* Turn autocomplete off  on each input text element*/ 
    if (document.getElementsByTagName("input").length > 0) {
      var inputElements = document.getElementsByTagName("input");
      for (i=0; i < inputElements.length ; i++) {
        if (inputElements[i].getAttribute("type") == "text") {
          var att = document.createAttribute("autocomplete");
          att.value = "off";
          inputElements[i].setAttributeNode(att); 
        }
      }
    }
  3. Thanks
    Vitalikssssss got a reaction from Tyler in Date Entry validation/limitation in Tabular Report "InlineAdd"   
    Hi @Tyler,
    I can suggest using a different approach for this case that does not require JS snippet.
    You may create a lookup table that would be prefilled with date range Monday-Sunday (current week) with a help of Application Task.
    The Task might look like the following: 

    You may use this lookup table as a source for a dropdown with predefined options.
    Hope this helps.
    Regards,
    Vitalikssssss
  4. Thanks
    Vitalikssssss got a reaction from Tyler in Date Entry validation/limitation in Tabular Report "InlineAdd"   
    Hi @Tyler,
    I can suggest using a different approach for this case that does not require JS snippet.
    You may create a lookup table that would be prefilled with date range Monday-Sunday (current week) with a help of Application Task.
    The Task might look like the following: 

    You may use this lookup table as a source for a dropdown with predefined options.
    Hope this helps.
    Regards,
    Vitalikssssss
  5. Like
    Vitalikssssss got a reaction from superfarts in Task to send email with multiple records   
    Caspio Bridge 21.0 release brought a Tasks\Trigger enhancement which solve this case without complex Trigger\Tasks.
    There is a new block added to Triggered Action called "Table variable" which forms a table.
     
    You can insert table variable into email body and it will be formed link a table (HTML format enabled):

    Hope it helps someone.
     
  6. Thanks
    Vitalikssssss reacted to JayDub in How to hide "No records found" and Header   
    Hi @Vitalikssssss,
    I replaced error message 351 in my localization file for the form with:
    <div id="norecord"><h3>Please add a student to continue.</h3></div>
    I originally used the code higher in this thread in the window.onload event and it worked to hide the buttons when the form first loaded. But due to the Ajax functionality employed when records are deleted, it did not remove the buttons when all records were deleted. So at the suggestion of @Alison I changed the code to listen for the DataPageReady event of the specific form on my page but now it doesn't work at all, the buttons always show.
    Thank you for the suggestion to use the Console in the browser. I wasn't familiar with how to use it, but I looked it up and when I did try it, it showed an error that there was a missing ) in my code. I went back to the original example here https://howto.caspio.com/datapages/ajax-loading/  and realized I was missing ); from the very end of my script. So the complete block should have been:
    <script type="text/javascript"> document.addEventListener('DataPageReady', function (event) { if (event.detail.appKey == '--i put my form's app key here--') { if (document.getElementById('norecord')){ document.getElementById('HideFooter').style.display = 'none'; } } }); //added right parentheses and semicolon here </script> It works like a charm now!
  7. Thanks
    Vitalikssssss reacted to sandy159 in Record actions on separate lines   
    Hi @MaraMara,
    To move your "Record Action buttons column" to the first column you may follow the next steps:
    1. Go to Styles and open the styles that you are using for the DataPage
    2. Select Table Layout under Results Page
    3. Under Element Type, look for Record Action Column
    4. On the Position dropdown, change the position to Left.
    5. Click Save then go to your DataPage then apply this Style


    Hope this helps!
  8. Like
    Vitalikssssss got a reaction from MaraMara in Hide submission form that uses auto-submit   
    Hi @DesiLogi,
    Perhaps you can use CSS instead of JS to hide the Datapage.
    Try putting this code in DP Header:
    <style> #caspioform { display: none; } </style>  
  9. Like
    Vitalikssssss got a reaction from Meekeee in Line-through in Data   
    Hi @JanineB,
    It looks like the "$" currency sign added by formatting is the reason for element value not been recognized as a number.
    You may add a replace function with regex to remove unwanted characters from value formatted as currency.
    So, your JavaScript would look like this:
    <script> var elems = document.getElementsByTagName("td"); for (var i=0, m=elems.length; i<m; i++) { if (elems[i].innerHTML.replace(/[^0-9\.-]+/g,"") > 0) { elems[i].style.textDecoration = "line-through"; } } </script> Regards,
    vitalikssssss
  10. Like
    Vitalikssssss reacted to jazmichaelking in Using G Suite (Google Cloud Identity) for auth   
    Thanks @Vitalikssssss, I am assuming I  will need to add the SAML app on G Suite's side, but mostly I was just checking if there was any other option eg just going with Google as a scoail login and restricting the domain or similar.
    We will set up the SAML app in G Suite and then work on figuring out the necessaries for Caspio, and I'll come back here and share our experience when it's done. Or abandoned :o)
  11. Thanks
    Vitalikssssss reacted to sandy159 in need to create a web app calculator - can Caspio do this?   
    Hello @mruns,
    If you want your calculator to display calculated values without the user actually submitting any data to the table, you will need to add Virtual Field to your Submission form. 
    Just select the Virtual Field from the picker and then set Form element to Calculated Value. Please refer to the screenshot below.

    Hope this helps!
  12. Thanks
    Vitalikssssss reacted to Elderberg in Inline edit only in certain circumstances   
    Just leaving this here ...  
     
    <script> document.addEventListener('DataPageReady', function(event) { function hideControlsForPerson() { var table = typeof document.getElementsByClassName("cbResultSetTable" + event.detail.uniqueSuffix)[0] == "undefined" ? document.getElementsByClassName("cbResultSetTable")[0] : document.getElementsByClassName("cbResultSetTable" + event.detail.uniqueSuffix)[0]; // Find the index of the last column, which happens to be the inline edit/delete var total_num_columns = table.rows[0].cells.length; var controlsColumnIndex = total_num_columns - 1; //position of the column with inline edit/delete // Find the index position of the column by searching the column's label row = table.rows[0]; var i; var KeyColumnIndex; for (i = 0; i < total_num_columns; i++) { if (row.cells[i].textContent == 'Label_of_Target_Field') { KeyColumnIndex = i; i = total_num_columns; // this is essentially to exit the loop } } // Iterating through rows and hiding Content for (var i = 1, row; row = table.rows[i]; i++) { if (row.cells.length > KeyColumnIndex && row.cells[KeyColumnIndex].textContent !== '[@authfield:Name]') { row.cells[controlsColumnIndex].style = "display:none;" } } } hideControlsForPerson( ); }); </script>  
    Note:  " row.cells.length > KeyColumnIndex "  was added to the if statement to protect against an uncaught TypeError that happens if using a date rollup or other field grouping. 
     
     
  13. Like
    Vitalikssssss got a reaction from Mik271828 in Mysterious margins in embedded data pages   
    Hi @Mik271828,
    It looks like the Datapage has been deployed within a container which has width <1024 px, hence responsive CSS has been applied on styling.
    You may disable a responsive option if you do not use Datapages on tablet/mobile devices or go into the Style section -->Source and change the HTML properties related to tablet/phone CSS.
    Hope this helps.
    Regards,
    vitalikssssss
  14. Like
    Vitalikssssss got a reaction from Joanne in Format Phone on Tabular Report   
    Hi @Joanne,
    the way how you reference fields is incorrect for Inline Edit action of Tabular report and also you need to use a special event to capture the moment then user clicked on Edit/Update button/link.
    You may try to use the following snippet, however make sure that name of the fields are correct and have prefix "InlineEdit".
    <script> document.addEventListener('DOMSubtreeModified', function(){ let element = document.querySelector('[id*="InlineEdit"]'); if (element) { let regExp = /^[0-9]+$/; //Change the name of the fields let arrEl = Array.from(document.querySelectorAll('[id*="InlineEditPhone"], [id*="InlineEditEmergencyPhone"], [id*="InlineEditPhone3"]')); arrEl.forEach(function(el) { el.maxLength = 14; el.addEventListener('input', function(v_e) { if (regExp.test(v_e.key)) { this.value = this.value.substr(0, this.value.length - 1); return false; } let v_value = (this.value.replace(/[^\d]/g, '')); if (v_value.length >= 7 && v_value.length < 10) { this.value = (v_value.substring(0, 3) + "-" + v_value.substring(3, 7) + v_value.substring(7, v_value.length)); } else if (v_value.length >= 10) { this.value = ("(" + v_value.substring(0, 3) + ") " + v_value.substring(3, 6) + "-" + v_value.substring(6, 10) +v_value.substring(10, v_value.length)); } }); }); } }); </script> Hope this helps.
    Regards,
    vitalikssssss
  15. Like
    Vitalikssssss got a reaction from JMR21 in How Can I Format A Text Field As A Dollar?   
    Hi @bbewley, @kpcollier,

    You may try using this JS which should go to the Footer:
    <script type="text/javascript"> function formatAsDollars(el) { el.value = el.value.replace(/[^\d]/g,'').replace(/(\d\d?)$/,'$1').replace(/^0+/,'').replace( /\d{1,3}(?=(\d{3})+(?!\d))/g , "$&,"); el.value = el.value ? '$' + el.value : ''; } let fields = ["FIELD_1", "FIELD_2"]; //specify your fields here fields.forEach(element => { element = "InsertRecord" + element; // replace "InsertRecord" with "EditRecord" for Details/Single Record Update DP document.getElementById(element).onkeyup = function() { formatAsDollars(this); } document.getElementById(element).onchange= function() { formatAsDollars(this); } }); </script> Pay attention to comments.
    Hope this helps.
    Vitalikssssss
  16. Like
    Vitalikssssss got a reaction from Elderberg in Referencing VirtualField with weird alphanumeric appended to it by Caspio   
    Hi @Elderberg,
    I have recently found that you can get suffix from DataPage event.
    <script type="text/javascript"> document.addEventListener('DataPageReady', function (event) { let suffix = event.detail.uniqueSuffix; console.log(suffix); }); </script> Regards,
    vitalikssssss 
  17. Thanks
    Vitalikssssss reacted to Hastur in How to get the file size   
    Hello @CoopperBackpack
    You may use additional JS code to implement this workflow:
    <script type="text/javascript"> document.addEventListener('DataPageReady', fileInputEvent) function fileInputEvent() { document.querySelector("#InsertRecordFile_f"),addEventListener('change', fileInputHandler); // use the InsertRecord[your file field name] instead document.removeEventListener('DataPageReady', fileInputEvent) } function fileInputHandler(event) { const fileSizeInput = document.querySelector('#InsertRecordFile_size'); // use the InsertRecord[your file size field name] instead fileSizeInput.value = event.target.files[0].size; } </script> Insert this code into the header of the submission form. Do not forget to disable the HTML editor.
    For the file size field use the Number data type. You also may make the size field hidden in the submission form.
  18. Thanks
    Vitalikssssss reacted to Hastur in Disable Submit button   
    Hi @Caspio101
    You can implement this workflow using the JS code.
    Here is the code with comments on parts which needs to be changed according to your workflow:
    <style> /* some styles for the disabled button */ input[name="Submit"]:disabled { cursor: not-allowed !important; background-color: gray !important; } </style> <script type="text/javascript"> function inputHandler(event, elementsSelectors) { if (!!event.target.innerHTML.trim()) { let elements = elementsSelectors.map( function(selector) { return document.querySelector(selector).innerHTML.trim() }); if (elements.includes('0')) { // Here you may change the condition. Now the button will be disabled if at least one calc value is equal to 0 document.querySelector('input[name="Submit"]').disabled = true; } else { document.querySelector('input[name="Submit"]').disabled = false; } } else { return null; } } function assignEvent() { // here you may define the list of the selectors to choose calculated fields you may use in condition let elementsSelectors = ['span[id^="InsertRecordfield_1"]', 'span[id^="InsertRecordfield_2"]', 'span[id^="InsertRecordfield_3"]']; elementsSelectors.forEach(function(selector) { document.querySelector(selector).addEventListener('DOMSubtreeModified', function() { inputHandler(event, elementsSelectors); }); }); document.removeEventListener('DataPageReady', assignEvent); } document.addEventListener('DataPageReady', assignEvent); </script>  
    You need to insert this code into the header of the submission form. Do not forget to disable the HTML editor in the advanced section of the header.
  19. Like
    Vitalikssssss got a reaction from Vincent in Use external database instead of the Caspio Tables   
    Hi @Vincent,
    Your data needs to reside in Caspio tables in order to work with it via Datapages.
    You may check this article which explains how you can import your date:
    https://howto.caspio.com/tables-and-views/importing-data/
    You may also consider using REST API for transferring the data from you database into Caspio:
    https://howto.caspio.com/web-services-api/rest-api/
    Hope this helps.
    Regards,
    vitalikssssss
     
  20. Thanks
    Vitalikssssss reacted to DesiLogi in Change style for 'Bulk Edit' link on hover   
    Hi,
    Does anyone know how/where to change the css in the Styles for the Bulk Edit link when it's hovered over, for a tabular datapage. I can change the style for the link in Source/Page Action section: 
    .cbResultSetBulkEditActionLink
    {
        /*Results Page Bulk Edit ActionLink Attributes (For Gallery And List Pages)*/
        color: green;
        font-family: Arial, sans-serif;
        font-size: 14px;
        font-weight: 600;
        text-decoration: none;
    }
    However, this only changes the link style when it's not hovered over. When hovered over  the 'Bulk Edit' link reverts to its default styling and looks jarring. There must be some css somewhere for something like .cbResultSetBulkEditActionLink:hover but I cannot find it. 
    EDIT:
    In case anyone needs a solution to something like this, I ended up sort of finding a solution. If you put _hover after it (what Caspio seems to use to designate hover), it basically removes the hover effect (it's supposed to change it, if you change the css but it seems to have just disabled hover). So if you put something like:
    .cbResultSetBulkEditActionLink
    {
        /*Results Page Bulk Edit ActionLink Attributes (For Gallery And List Pages)*/
        color: green;
        font-family: Arial, sans-serif;
        font-size: 14px;
        font-weight: 600;
        text-decoration: none;
    }
    .cbResultSetBulkEditActionLink_hover
    {
        /*Results Page Bulk Edit ActionLink Attributes (For Gallery And List Pages)*/
        color: green;
        font-family: Arial, sans-serif;
        font-size: 14px;
        font-weight: 800;
        text-decoration: none;
    }
    in Source/User Defined Styles it seems to work. 
  21. Thanks
    Vitalikssssss got a reaction from mgredmond in Populate Field 2 Based on Value of Field 1   
    Hi @mgredmond,
    You can add your actual field into submission form and use Calculated value form element to reference the result of Virtual field.
    Advanced Calculated value settings allows you to hide field.

    The formula expression will need to have a CASE logic block because Calculated value works with "Value" section of dropdown.
    It might look like this:

    Hope it helps.
    Regards,
    Vitalikssssss
  22. Like
    Vitalikssssss got a reaction from kpcollier in Task to send email with multiple records   
    Caspio Bridge 21.0 release brought a Tasks\Trigger enhancement which solve this case without complex Trigger\Tasks.
    There is a new block added to Triggered Action called "Table variable" which forms a table.
     
    You can insert table variable into email body and it will be formed link a table (HTML format enabled):

    Hope it helps someone.
     
  23. Like
    Vitalikssssss got a reaction from kpcollier in Format Currency With Custom Calculations   
    Hi @kpcollier,
    Try the following JavaScript:
    <script type="text/javascript"> function formatAsDollars(el) { el.value = el.value.replace(/[^\d]/g,'').replace(/(\d\d?)$/,'$1').replace(/^0+/,'').replace( /\d{1,3}(?=(\d{3})+(?!\d))/g , "$&,"); el.value = el.value ? '$' + el.value : ''; } var fields = ["Subtotal", "MarkUp", "County_Tax", "Misc_Percent", "Freight_Total"]; //specify your fields here fields.forEach(element => { element = "InsertRecord" + element; // replace "InsertRecord" with "EditRecord" for Details/Single Record Update DP document.getElementById(element).onkeyup = function() { formatAsDollars(this); } document.getElementById(element).onchange= function() { formatAsDollars(this); } }); function calculate() { var subTotal = document.getElementById("InsertRecordSubtotal").value.length == 0 ? 0 : (parseFloat(document.getElementById("InsertRecordSubtotal").value.replace(/[$,]+/g,""))); var markUp = document.getElementById("InsertRecordMarkUp").value.length == 0 ? 0 : (parseFloat(document.getElementById("InsertRecordMarkUp").value.replace(/[$,]+/g,""))); var countyTax = document.getElementById("InsertRecordCounty_Tax").value.length == 0 ? 0 : (parseFloat(document.getElementById("InsertRecordCounty_Tax").value.replace(/[$,]+/g,""))); var miscPerc = document.getElementById("InsertRecordMisc_Percent").value.length == 0 ? 0 : (parseFloat(document.getElementById("InsertRecordMisc_Percent").value.replace(/[$,]+/g,""))); var freight = document.getElementById("InsertRecordFreight_Total").value.length == 0 ? 0 : (parseFloat(document.getElementById("InsertRecordFreight_Total").value.replace(/[$,]+/g,""))); var markUpTotal = document.getElementById("InsertRecordMarkUp_Total").value = (subTotal) * (markUp); var countyTaxTotal = document.getElementById("InsertRecordCountyTax_Total").value = (subTotal) * (countyTax); var miscPercTotal = document.getElementById("InsertRecordMisc_Percent_Total").value = (subTotal) * (miscPerc); var total = document.getElementById("cbParamVirtual1").value = (subTotal) + (markUpTotal) + (countyTaxTotal) + (miscPercTotal) + (freight); var dp_el = [ document.getElementById("InsertRecordMarkUp_Total"), document.getElementById("InsertRecordCountyTax_Total"), document.getElementById("InsertRecordMisc_Percent_Total"), document.getElementById("cbParamVirtual1") ]; dp_el.forEach(element => formatAsDollars(element)); } setInterval(calculate, 1500); </script> Regards,
    vitalikssssss
  24. Like
    Vitalikssssss got a reaction from norkaman in Passing non-Table field Parameters via Query String   
    Hi @norkaman

    Do you use the following syntax to reference first 2 parameters? 
    [@WID] and [@LBE]?
    Regards,
    vitalikssssss
  25. Like
    Vitalikssssss got a reaction from Chrille in Change the value of a field in a detailspage on update.   
    Hi @Chrille,
    You should use "EditRecord" prefix on Details page in order to reference a field.
    So, you code should look like this:
    <script type="text/javascript"> document.addEventListener('BeforeFormSubmit', function (event) { var v3 = '<img src="http://image_url" alt="YES"'; var v2 = document.getElementById("EditRecordKontaktad").value; if (v2 !="") { document.getElementById("EditRecordRingt").value = v3; }}); </script> Hope this helps.
    Regards,
    vitalikssssss
×
×
  • Create New...