Jump to content

wimtracking2

Caspio Ninja
  • Posts

    30
  • Joined

  • Last visited

  • Days Won

    1

Posts posted by wimtracking2

  1. On 12/8/2021 at 9:42 AM, CoopperBackpack said:

    Hello @wimtracking2,

    The easiest way is to restrict submitting the form when more than 8 values in the List-String field were selected.

    As far as I understand, you are referring to the Single Record Update form.

    I tested this code and it works for me:

    <script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    
    <script>
    document.addEventListener("BeforeFormSubmit", function (event) {
      const listOfvalues = document.querySelector('input[id^="EditRecordlist"]').value; // replace the 'list' part with your field name
      const numberOfValues = listOfvalues.split(",").length;
    
      if (numberOfValues > 8) {
        event.preventDefault();
    
        Swal.fire({
          icon: "warning",
          title: "Select less than 8 values",
        });
      }
    });
    </script>

    You may paste the code to the Footer section and disable the HTML editor before pasting.

    I am using so-called SweetAlert (https://sweetalert2.github.io/) to display a warning and the first line of code and Swal.fire() refers to it.

    This is exactly what I needed and it worked perfectly, thank you.

  2. I have created a map mashup. The markers are loading very slowly, one at a time. I would like to increase the speed in which they show up on the map or have them show up all at once.

    • I am using Lat and Long coordinates that are already in my data to map the markers.
    • I have tried using the default icons provided.
    • I have tested the speed of load via the URL deployment and Website deployment, so it is not my hosting website causing the delay.

    Does anyone have suggestions on increasing the speed of markers using a map mashup?

    You can see it deployed here: The Bright App 2.0 • WIM Tracking

  3. @CoopperBackpack

    I figured out how to make these two fields function as "or" during the search. Now I just need the second field to be pre-selected, like what you created for me for the first field. I added a second event listener, but the second field is not functioning. I am wondering if I need to add an ID or define each event in the javascript?

     

    <script>

    document.addEventListener('DataPageReady', selectedOptionHandler)

    function selectedOptionHandler() {

    let firstAccounts_Physical_City = document.querySelector('#Value25_1 > option[value="Bozeman"]');
    let secondAccounts_Physical_City = document.querySelector('#Value25_1 > option[value="Belgrade"]');
    let thirdAccounts_Physical_City = document.querySelector('#Value25_1 > option[value="Livingston"]');

    firstAccounts_Physical_City.selected = secondAccounts_Physical_City.selected = thirdAccounts_Physical_City.selected = true;

    document.removeEventListener('DataPageReady', selectedOptionHandler);
    };
    </script>
    <script>

    document.addEventListener('DataPageReady', selectedOptionHandler)

    function selectedOptionHandler() {

    let firstContacts_HC_Service = document.querySelector('#Value26_1 > option[value="Option 2: Help Center Crisis Answering Service & Referral Database"]');
    let secondContacts_HC_Service = document.querySelector('#Value26_1 > option[value="Option 3: Extended Emergency Response Service, Help Center Crisis Answering Service & Referral Database"]');

    firstContacts_HC_Service.selected = secondContacts_HC_Service.selected =  true;

    document.removeEventListener('DataPageReady', selectedOptionHandler);
    };

    </script>

  4. I have a search and report datapage.

    It provides a list of a records as a tabular report and a google map mashup is displayed above the results. I have the "map it" button enabled to send the user to the map to view the location on the map.  Is there a way to then send the user back to the record in the tabular report below the map using a link in the info card?

    View the live datapage here:2.0 The Bright App • WIM Tracking

    map.png

  5. @CoopperBackpack

    In the table, the field Contracts_HC_Service may contain 1, 2, or 3. The field Accounts_Physical_City could be any city in Montana.

    I'd like the default/pre loaded results on the search datapage to be the cities of Bozeman or Livingston or Belgrade OR Contacts_HC_Service contains 2 or Contacts_HC_Service contains 3. Then, the records returned could then be those with cities other than Bozeman, Belgrade, and Livingston, but Contacts_HC_Service inclues 2 or 3.  AND Contacts_HC_Service returned could be records that contain 1, but are in Bozeman, Belgrade, or Livingston.

    Capture.thumb.PNG.eec3ba0ea665462a817f687f1816bf84.PNG

  6. On 4/27/2021 at 4:38 AM, CoopperBackpack said:

    Hello @wimtracking2,

    As I understood from your inquiry, you store the cities in the field with the Text(255) data type and set this field on the Search page as Listbox -> Allow multiselection

    R1mzCWA.png

     

    And the Search is set like this:

    DzxHiJg.png

     

    If this is the case, it is possible to add the "selected" attribute to the options you want by JavaScript. 

    I added this code to the Footer section on the "Search and Report Wizard - Configure Search Fields" page (the HTML editor is disabled on the Advanced tab before pasting). 

    <script>
    
    document.addEventListener('DataPageReady', selectedOptionHandler) 
    
    function selectedOptionHandler() {
    
    let firstCity = document.querySelector('#Value1_1 > option[value="Bozeman"]'); 
    let secondCity = document.querySelector('#Value1_1 > option[value="Belgrade"]');
    let thirdCity= document.querySelector('#Value1_1 > option[value="Livingston"]');
    
    firstCity.selected = secondCity.selected  = thirdCity.selected = true;
    
    document.removeEventListener('DataPageReady', selectedOptionHandler);
    };
    
    </script>

    And here is the output. So, I can see the list of records where City is Bozeman, Belgrade, or Livingston on initial load.

    qvVS0xb.png

     

    In the example, the City field on the Search page is the only field and has the id Value1_1 that is used in the code above.

    Basically, the second field on the Search has the id Value2_1, the third field - Value3_1, etc. Please replace the id in the code if needed. 

    Hope this is the expected result and this solution helps.

    @CoopperBackpack Is there anyway to search with these preselected cities but also return results IF another field is a certain value?

    So if the default city field is set to "Bozeman",  "Belgrade", "Livingston", but the search returns results for records in any city IF the Type of the record is  "Option 2", "Option 3".

  7. Hi have a non-authenticated app that is deployed on 7 websites. I would like to track how many searches are completed in the app and even better know what website is hosting the app the searches are coming from. I know that I can create a submission page and pass these parameters into a table and build a second app to display the results (Separate Search Page and Results Page into Two Different Web Pages - Caspio Online Help). However, using this does not work for me since the same app is on 7 websites and the second app (results) is hosted on a different page and requires sending the user to a URL specific to the website they are currently on. Has anyone built something like this or know a work around?

  8. In a search datapage, with a list of cities available in a multi-select list box, how can I "pre-select" or set multiple values as the default search. Users want to see cities Bozeman, Belgrade, and Livingston as the default records returned in the default search results below the search form. The will then have the ability to change the selection using the multi select city field.

    The values stored in the city field are a text field. Thanks for your ideas!

  9. I have a search and report datapage that when deployed on most Wordpress websites  functions properly. On one wordpress website that uses (Theme X) the radio buttons are not displaying on the same line. In the datapage it is set to display "multiple options per line".

    The hint images are also displaying on the line under the label. I believe I need to enter custom css into the style in order to make the radio buttons display multiple options per line and the hint images to stay on the same line. What css can be used?

    Here is the app functioning with the issues when deployed: https://www.mtpca.org/behavioral-health-directory/

    Here is the app functioning properly when deployed: https://wimtracking.com/thebrightapp/

  10. Hi @NiceDuck

    Yes, the data pulls from one View.

    It's a limit on the total count of all records downloaded over one year. So download one, they download a .csv file of 500 records, download two, they download a .csv file of 3,000 records. Now they have downloaded 3,500 records and can only download another 2,000. Once they download the last 2,000 records, the download option should be disabled. So they can download as many .csv files as needed, until the total count of all the records from each download reaches 5,500.

    Thanks so taking a look!

  11. I have a Report Datapage that displays Tabular results. I have enabled users to download their search results into a .csv file. I would like to limit the number of records (5,500) that each user can download over the course of 365 days.

    I would like to continue to allow them to download as many records each time they search until they have dowloaded 5,500. At that time I would like the download option to be disabled.

    Has anyone done this? Thanks

  12. I was able to get this figured out. I needed to move my code to my footer. 

     

    I have deployed an update datapage on Wordpress and the javascript below works fine. However, I deployed it on a Weebly website and it is not working. I have pasted the javascript below and then also the deployment code I put on Weebly. I have other custom javascript that is working on the same datapage, so wondering if the iMask might be the problem?

     

    Javascript in the Datapage:

    <script src="[@app:iMask/]"></script>

    <script type="text/javascript">
    document.addEventListener('DataPageReady', function (event) {
     var phoneMask = IMask(
      document.getElementById('EditRecordFax'), {mask: '(000) 000-0000'});
    var phoneMask = IMask(
      document.getElementById('EditRecordOffice_Phone'), {mask: '(000) 000-0000'});
    var phoneMask = IMask(
      document.getElementById('EditRecordOther_Phones'), {mask: '(000) 000-0000'});
    var phoneMask = IMask(
      document.getElementById('EditRecordPrimary_Phone_Number'), {mask: '(000) 000-0000'});
    var phoneMask = IMask(
      document.getElementById('EditRecordCell_Phone'), {mask: '(000) 000-0000'});
    var phoneMask = IMask(
      document.getElementById('EditRecordHome_Phone'), {mask: '(000) 000-0000'});
    var phoneMask = IMask(
      document.getElementById('EditRecordBeeper'), {mask: '(000) 000-0000'});
    var phoneMask = IMask(
      document.getElementById('EditRecordOther_Phone'), {mask: '(000) 000-0000'});
    });
    </script>

     

    Datapage embed deployment code:

    <script type="text/javascript" src="https://c2axa376.caspio.com/dp/3c194000bfe6c015b6ac4d52b0e2/emb"></script>
    <div class="cxkg"><a href="https://c2axa376.caspio.com/dp/3c194000bfe6c015b6ac4d52b0e2">Click here</a> to load this Caspio <a href="http://www.caspio.com" target="_blank" title="Cloud Database">Cloud Database</a></div>
    <div id="cb3c194000bfe6c015b6ac4d52b0e2"></div>

     

  13. On 12/5/2019 at 1:38 PM, DesiLogi said:

    Hi Wimtracking2,

    Glad you got it answered-I was just about to post what might be a solution: 

    This code in the footer will highlight the choices selected in the listbox (my field is called 'AssignedTo'.

    
    <script type="text/javascript">
    var v_state = "[@field:Assigned_To]" ;
    var o_state = document.getElementById("EditRecordAssigned_To") ;
    o_state.multiple = true ;
    
    function f_listbox() {
    if ( v_state.indexOf(",") > 0 ) {
    for (var i=0 ; i < o_state.options.length; i++ ) {
    if(o_state[i].value == v_state) {
    o_state.remove(i);
    break ;
    }
    }
    var o_st = v_state.split(", ") ;
    for (var j=0 ; j < o_st.length; j++) {
    for (var i=0 ; i < o_state.options.length; i++ ) {
    if(o_st[j]== o_state.options[i].value){
    o_state.options[i].selected = true ;
    break ;
    }
    }
    }
    }
    }
    //window.onload = f_listbox ;
    
    document.addEventListener('DataPageReady', f_listbox());
    </script>

     

    Screen Shot 2019-12-05 at 10.36.00 AM.png

    Hi @DesiLogi

     

    Is there anyway to use this same solution, but for the user to multi-select from checkboxes rather than the listbox?

  14. Hi @Andrew

    I implemented your iMask framework to format my phone number fields and it worked great. I deployed my datapage into a wordpress site without a hitch. However, when deployed into a Weebly website, it did not work. Other custom javascript is working in the same datapage on the Weebly site. Curious if you have run into this before, know what would cause the issue and if you have suggestions on what I might try to get it to work? Below is the code I implemented and it works when deployed on a wordpress site.

    <script src="[@app:iMask/]"></script>

    <script type="text/javascript">
    document.addEventListener('DataPageReady', function (event) {
     var phoneMask = IMask(
      document.getElementById('EditRecordFax'), {mask: '(000) 000-0000'});
    var phoneMask = IMask(
      document.getElementById('EditRecordOffice_Phone'), {mask: '(000) 000-0000'});
    var phoneMask = IMask(
      document.getElementById('EditRecordOther_Phones'), {mask: '(000) 000-0000'});
    var phoneMask = IMask(
      document.getElementById('EditRecordPrimary_Phone_Number'), {mask: '(000) 000-0000'});
    var phoneMask = IMask(
      document.getElementById('EditRecordCell_Phone'), {mask: '(000) 000-0000'});
    var phoneMask = IMask(
      document.getElementById('EditRecordHome_Phone'), {mask: '(000) 000-0000'});
    var phoneMask = IMask(
      document.getElementById('EditRecordBeeper'), {mask: '(000) 000-0000'});
    var phoneMask = IMask(
      document.getElementById('EditRecordOther_Phone'), {mask: '(000) 000-0000'});
    });
    </script>

     

    I answered my problem - it was a browser update issue. Oi

  15. Thank you @douvega, your code worked perfectly. I was able to implement it for 8 fields needing to function the same way.

     

    <script type="text/javascript">
     //JS code created by douglas.vega1989@gmail.com
     function f_listbox(fieldObj) {
      //Set field to multi-select
      fieldObj.multiple = true;

      //Get field values
      var values = fieldObj.value;

      if (values.indexOf(",") > 0) {
       for (var i=0 ; i < fieldObj.options.length; i++) {
        if(fieldObj.value == values) {
         fieldObj.remove(i);
         break ;
        }
       }

       var arr = values.split(", ");

       for (var j=0 ; j < arr.length; j++) {
        for (var i=0 ; i < fieldObj.options.length; i++ ) {
         if(arr[j]== fieldObj.options.value){
          fieldObj.options.selected = true;
          break ;
         }
        }
       }
      }
     }

     setTimeout(f_listbox(document.getElementById("EditRecordCertifications")), 20);
     setTimeout(f_listbox(document.getElementById("EditRecordTreatment")), 20);
     setTimeout(f_listbox(document.getElementById("EditRecordAges")), 20);
     setTimeout(f_listbox(document.getElementById("EditRecordTherapy")), 20);
    setTimeout(f_listbox(document.getElementById("EditRecordAgency_Services")), 20);
    setTimeout(f_listbox(document.getElementById("EditRecordInsurance")), 20);
    setTimeout(f_listbox(document.getElementById("EditRecordAccept")), 20);
    setTimeout(f_listbox(document.getElementById("EditRecordAreas")), 20);
    </script>

  16. @douvega I modified the code per this post 

    This is what I have:

    <script type="text/javascript">
        
     function f_listbox(v_state) {
      if ( v_state.indexOf(",") > 0 ) {
       for (let i=0 ; i < o_state.options.length; i++ ) {
        if(o_state.value == v_state) {
         o_state.remove(i);
         break ;
        }
       }
       let o_st = v_state.split(", ") ;
       for (let j=0 ; j < o_st.length; j++) {
        for (let i=0 ; i < o_state.options.length; i++ ) {
         if(o_st[j]== o_state.options.value){
          o_state.options.selected = true ;
          break ;
         } 
        }
       }
      }
     }

    document.addEventListener('DataPageReady', function (event) {

    let v_state = ["Certifications", "Therapy", "Ages", "Agency_Services", "Insurance", "Accept", "Areas", "Treatment"]; //Field names goes here 
    let o_state = [];

     v_state.forEach(function(el) {
        if (el !== null) {
                o_state.push(document.getElementById("EditRecord"+el));
        }
     });

     o_state.forEach(function(el){

        if (el !== null) {
            el.multiple = true;
        }
     });

    f_listbox(v_state);

    });

    </script>

  17. Thanks @douvega I followed your suggestion and set up  a multiselect listbox as you listed in your option 2. (Follow this Caspio solution for a Multiselect Listbox option: https://forums.caspio.com/topic/4315-js-multiselect-listbox-in-update-datapage/

    This is working, however, I am using an update form. I would like the current options to be individually pre-selected, rather than a list pre-selected.

    See attachments, Capsio1.png is what is currently displayed. I would like it to show up as it does in Caspio2.png. Do you know how to accomplish this? Thanks again,

    Caspio1.PNG

    Caspio2.PNG

  18. On 9/30/2019 at 8:21 AM, Vitalikssssss said:

    Hi @DesiLogi,

    Try using the following script in the Footer of the Datapage:

    
    <script type="text/javascript">
        
     function f_listbox(v_state) {
      if ( v_state.indexOf(",") > 0 ) {
       for (let i=0 ; i < o_state.options.length; i++ ) {
        if(o_state[i].value == v_state) {
         o_state.remove(i);
         break ;
        }
       }
       let o_st = v_state.split(", ") ;
       for (let j=0 ; j < o_st.length; j++) {
        for (let i=0 ; i < o_state.options.length; i++ ) {
         if(o_st[j]== o_state.options[i].value){
          o_state.options[i].selected = true ;
          break ;
         } 
        }
       }
      }
     }
    
    document.addEventListener('DataPageReady', function (event) {
    
    let v_state = ["CompanyName", "FirstName", "LastName"]; //Field names goes here 
    let o_state = [];
    
     v_state.forEach(function(el) {
        if (el !== null) {
                o_state.push(document.getElementById("EditRecord"+el));
        }
     });
    
     o_state.forEach(function(el){
    
        if (el !== null) {
            el.multiple = true;
        }
     });
    
    f_listbox(v_state);
    
    });
    
    </script>

     

    Hi @Vitalikssssss

     

    This solution is working for me on an update submission form. Thank you. Is there a way that it can be altered to pre-select the listbox options individually as stored in the database rather than selecting one option summarizing the data in the table.  See attached images. 

    Caspio1.png shows how the field currently shows up in the update form based on the current data in the table. I would like it to display as shown in caspio2.png.  Can this be done? Thank you

    Caspio1.PNG

    Caspio2.PNG

×
×
  • Create New...