Jump to content

DesiLogi

Caspio Rockstar
  • Content Count

    282
  • Joined

  • Last visited

  • Days Won

    22

Reputation Activity

  1. Like
    DesiLogi got a reaction from SinJunYoung in Display Time   
    A couple years later--just want to say this is perfect and really helpful- thanks for posting it. 
  2. Thanks
    DesiLogi got a reaction from kpcollier in Set Search Date Criteria Begin and End dates as weekly blocks (current week), by default   
    Hi SinJunYoung, 
    Many thanks for that tip- I did not catch that as an option for the Search/Filter date.  It works really nicely except for one thing-I need the user to be able to change the week they want to Search/Filter by so the date needs a Begin/End criteria that's visible. I just need the current date to open by default so they don't have to enter it in themselves (bad design if they did). 
    Here's some js I put together to get the Sunday before the current date and then add 6 days to it for the following Saturday, and then to put that into the Date Criteria for Begin and End dates. This allows the user to change the Search/Filter to different dates.  
    <script type="text/javascript"> document.addEventListener('DataPageReady', function (event) { var curr = new Date(); day = curr.getDay(); firstday = new Date(curr.getTime() - 60*60*24* day*1000); //will return firstday (ie sunday) of the week lastday = new Date(curr.getTime() + 60 * 60 *6 * 24 * 1000); //adding (60*60*6*24*1000) means adding six days to the firstday which results in lastday (saturday) of the week var v_weekstart = firstday.toLocaleDateString('en-US'); var v_weekend = lastday.toLocaleDateString('en-US'); //removes the time from the day/time value so it can be used in the date criteria search var v_weekend2 = (firstday.getMonth()+1) +"/"+ (firstday.getDate()+6) +"/"+ (firstday.getFullYear()) //this was added because in testing the variable 'lastday' wasn't always correct document.forms[0].Value2_1.value = v_weekstart; document.forms[0].Value2_2.value = v_weekend2; //this puts the two date values in the two criteria so they can be used to search/filter }); </script> ***I haven't thoroughly tested this yet so if anyone needs this check it out in detail before deploying. The code for the variable 'lastday' did not give me an accurate date last week, but this week it does, so it seems unreliable.  Therefore I used another method to add 6 days to come up with the end date of the current week  (variable v_weekend2). I left the original code for lastday in there in case someone needs it. 
  3. Thanks
    DesiLogi got a reaction from SinJunYoung in Open fancybox after submission or update   
    I figured this out, if anyone else needs it. Basically, I have a button that uses the class to call the fancybox code but also an onclick that calls the submit code separately. This way both of the functions work in sequence. 
    Here's the button:
    <button class="cbpop btaction" href="#" data-width="1100" data-href="../shortcuts/universal-item-search" onclick="myFunction()"><i class="fa fa-search fa-lg"></i></button> And here's the script in the datapage footer. I have the Destination set to 'Same Form.' Note that the code opens the fancybox in the parent as this datapage is embedded in an iframe. 
    <script> $('.cbpop').each(function(index, el){ var width = 450; var v_href= $(el).attr('href'); if (v_href=="#") { v_href=$(el).attr('data-href'); } if($(el).attr('data-width')){ width = $(el).attr('data-width'); } parent.$(el).fancybox({ closeBtn:false, openEffect : 'none', closeEffect : 'none', modal:true, type:'iframe', autoSize:true, width:width, //href:$(el).attr('href') href:v_href }); }); </script> <script> function myFunction(){ setTimeout('document.forms["caspioform"].submit()',1000); } </script>  
  4. Like
    DesiLogi got a reaction from SinJunYoung in Time Picker code that works on submission form not working on Details View Update   
    Hi,
    I took some code from one of Caspio's demo apps (an appointment scheduler) to create a Time Picker on a Submission form. This works great, allowing far more detailed calendar scheduling than just using the date without a time. The issue is when the user needs to edit the date/time from the Calendar, in Details view. The code doesn't work in this case. I've changed the 'InsertRecord' part to 'EditRecord' but that doesn't seem to make a difference. Is there some difference to calling the code from the Update button vs a Submission button? Any help would be greatly appreciated. 
    Below is the process and code in the Submission form's footer. I need to modify it to work in a Calendar's Detail view: 
    a) the user selects a Date from the calendar popup for field Virtual6 (set to Text).
    b) the user then clicks this link in an html block to open the Time Picker: <input type="time" name="time" class="timeClass"  id="timepicker"/>
    c) on Submission the code below runs to combine the date from Virtual6 and the time from the Time Picker into the actual Date/Time field TasksTimeine_CalDate.
    ****I need this code to work on a Calendar's Detail View Update. 
    <script type="text/javascript"> var datefield=document.createElement("input"); datefield.setAttribute("type", "time"); if (datefield.type!="time") { //if browser doesn't support input type="time" document.addEventListener("DataPageReady", function () { $('#timepicker').timepicker({ timeFormat: 'HH:mm', interval: 1, minTime: '00:00', maxTime: '23:59', defaultTime: '6', startTime: '00:00', dynamic: false, dropdown: true, scrollbar: true, timepicker: true, datepicker: false, stepHour: 1, stepMinute: 1, timeInput: true, showHour: true, showMinute: true, pickerTimeFormat: 'hh:mm tt' }); }); } document.getElementsByName('Submit')[0].onmouseover = function(){ var date = document.getElementById('cbParamVirtual6').value; if(date == "") { date = "1/1/2011"; } var ampm = document.getElementById('timepicker').value; document.getElementById('InsertRecordTasksTimeline_CalDate').value = date + " " + ampm; }; </script>  
  5. Thanks
    DesiLogi got a reaction from SinJunYoung in Time Picker code that works on submission form not working on Details View Update   
    Got it figured out, after all. If anyone needs this solution. On the Calendar's Detail page, change the line:
    document.getElementsByName('Submit')[0].onmouseover = function(){ 
    to
    document.getElementsByName('Mod0EditRecord')[0].onmouseover = function(){ 
    And also change 
    document.getElementById('InsertRecordTasksTimeline_CalDate').value = date + " " + ampm; to
     
    document.getElementById('EditRecordTasksTimeline_CalDate').value = date + " " + ampm; This will find the Update button by name and use it to run the code above in the footer. 
    This will give you a great Calendar--the user can set times for their appointments like on a normal calendar. 
  6. Like
    DesiLogi got a reaction from AnyCarKeyMade 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. 
  7. Thanks
    DesiLogi got a reaction from MaraMara in How to show & hide submit & details form on same page as tabular results using div column changes in bootstrap   
    I thought this might be helpful across the board for people developing in Caspio. I've been trying to do a better UI for data entry on web pages that also have to show results in a tabular report.
    Since iframes don't reliably pass parameters from parent to child and back it's necessary to sometimes deploy 2 datapages (a Submit or Details and a Tabular) on the same web page. This doesn't really look good from a UI perspective. 
    This solution requires using bootstrap and jquery but it's fairly straightforward. 
    One option is to put the the Submit/Details  deploy code in the first div with something like class="col-md-3" and the Tabular deploy code in the next div with class="col-md-9" (divs in bootstrap with col classes must add up to 12 but no more than 12, in basic mode). This will put the 2 datapages next to each other, the 1st with 1/4 screen width and the 2nd with 3/4th. However, this setup looks cluttered and can constrain the Tabular report which often needs full page width to show its data clearly. 
    So the ideal would be to onload hide/collapse the first div (with the Submit/Details form) and have the second div (tabular report) a full 12 columns wide. Then click a button or link to show the 1st div (Submit form) and change the 2nd div (tabular report) to 9 columns, thereby displaying both datapages when data entry/edit is needed. Clicking the button/link again (in this method) will collapse div1 and expand div2 back to 12 columns. So it's easy to toggle views this  way. 
    To do this: 
    Put this in the body of your webpage (you may have bootstrap and jquery referenced differently):
    <div class="container-fluid"> <br> <div class="row"> <div class="col-md-3 bg-faded"> <div id="showsubmitform" class="collapse"> Caspio Deploy Code for Submit/Details form </div> </div> <div class="col-md-12" id="right"> <div> Caspio Deploy Code for Tabular Report </div> </div> </div> </div> <script src="//ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <script> $('#btnSwitch').click(function(){ $('.col-md-3').toggleClass('show'); $('#right').toggleClass('col-md-9 col-md-12'); }) </script> And then put a button or link elsewhere on your page, wherever you want to show it: 
    <a class="btn page-action" id="btnSwitch" href="#showsubmitform" style="color:green;" data-toggle="collapse"><i class="fa fa-plus" aria-hidden="true"></i> Submit New Data</a> When the page is loaded the Tabular Report will be the only datapage showing, in full width. 
    When the 'Submit New Data' link is clicked the Tabular Report moves to the right and shrinks to 9 columns from 12. The space that opens on the left is 3 columns wide and will now show the Submit/Details form. 
    When the 'Submit New Data' link is clicked again it will hide the Submit/Details form and expand the Tabular Report back to 12 full columns. 
    You can change the column numbers of the divs and button ids and labels to suit. This solution might help with some UI massaging, if anyone is working on that aspect of their app...
  8. Thanks
    DesiLogi got a reaction from Vitalikssssss 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. 
  9. Like
    DesiLogi got a reaction from kpcollier in Background color outside the Search forms and data tables   
    When I do an Inspect on the page it looks like cbOuterAjaxCtnr is where some of the whitespace comes from. When I manually type in a background color (in inspector) it does change the background. However, in the Style Sources if I put the below code it doesn't work and I can't find anything for cbOuterAjaxContainer. This is what I thought it would need: 
     .cbOuterAjaxCtnr
    {
        background-color: #daded1 !important;
    }
     
    EDIT:
    Ah, I figured it out if anyone else needs to do the same thing: The background setting needs to not be in a Caspio datapage or Style but in the host web page's css. I guess the datapage uses whatever background css the host page uses for the headers and outer containers.
  10. Thanks
    DesiLogi got a reaction from vanderLeest in Updating Data inside dropdown   
    Hi MayMusic, 
    Thanks for posting the script for updating a dropdown without refreshing the whole page.  That's a key thing for a smooth UI. 
    I need to use this method to update a multi-select Listbox field (instead of a drop down field) and I can't get it to work.  I tried using getElementsByName("InsertRecordFieldName")[0] instead of getElementById("InsertRecordFieldName") but it's not refreshing the field listbox.  Any idea how to target a Listbox for refresh in this scenario? 
    EDIT: actually, I did get this to work using getElementsByName("InsertRecordFieldName")[0] . What was missing was I needed to use the parameter from the popup in the OnLoad in the Listbox field. Works great now- thanks for posting that javascript, really helpful.
  11. Like
    DesiLogi reacted to Hastur in Trigger To Insert Record Only Once Even with Multiple Updates   
    @Scott

    Hello!

    Your trigger should consist of two part.
    First one will insert the entry into the log table if the log table does not contain the ID of a particular entry.
    The second will update the needed entry if it is already present within the log table.
    Please find the app with the example attached :
    FORUM_Trigger_Insert_Update_Based_on_Presence_1_0_2019-Jun-19_0714.zip


     
  12. Thanks
    DesiLogi got a reaction from kpcollier in How to show & hide submit & details form on same page as tabular results using div column changes in bootstrap   
    I thought this might be helpful across the board for people developing in Caspio. I've been trying to do a better UI for data entry on web pages that also have to show results in a tabular report.
    Since iframes don't reliably pass parameters from parent to child and back it's necessary to sometimes deploy 2 datapages (a Submit or Details and a Tabular) on the same web page. This doesn't really look good from a UI perspective. 
    This solution requires using bootstrap and jquery but it's fairly straightforward. 
    One option is to put the the Submit/Details  deploy code in the first div with something like class="col-md-3" and the Tabular deploy code in the next div with class="col-md-9" (divs in bootstrap with col classes must add up to 12 but no more than 12, in basic mode). This will put the 2 datapages next to each other, the 1st with 1/4 screen width and the 2nd with 3/4th. However, this setup looks cluttered and can constrain the Tabular report which often needs full page width to show its data clearly. 
    So the ideal would be to onload hide/collapse the first div (with the Submit/Details form) and have the second div (tabular report) a full 12 columns wide. Then click a button or link to show the 1st div (Submit form) and change the 2nd div (tabular report) to 9 columns, thereby displaying both datapages when data entry/edit is needed. Clicking the button/link again (in this method) will collapse div1 and expand div2 back to 12 columns. So it's easy to toggle views this  way. 
    To do this: 
    Put this in the body of your webpage (you may have bootstrap and jquery referenced differently):
    <div class="container-fluid"> <br> <div class="row"> <div class="col-md-3 bg-faded"> <div id="showsubmitform" class="collapse"> Caspio Deploy Code for Submit/Details form </div> </div> <div class="col-md-12" id="right"> <div> Caspio Deploy Code for Tabular Report </div> </div> </div> </div> <script src="//ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <script> $('#btnSwitch').click(function(){ $('.col-md-3').toggleClass('show'); $('#right').toggleClass('col-md-9 col-md-12'); }) </script> And then put a button or link elsewhere on your page, wherever you want to show it: 
    <a class="btn page-action" id="btnSwitch" href="#showsubmitform" style="color:green;" data-toggle="collapse"><i class="fa fa-plus" aria-hidden="true"></i> Submit New Data</a> When the page is loaded the Tabular Report will be the only datapage showing, in full width. 
    When the 'Submit New Data' link is clicked the Tabular Report moves to the right and shrinks to 9 columns from 12. The space that opens on the left is 3 columns wide and will now show the Submit/Details form. 
    When the 'Submit New Data' link is clicked again it will hide the Submit/Details form and expand the Tabular Report back to 12 full columns. 
    You can change the column numbers of the divs and button ids and labels to suit. This solution might help with some UI massaging, if anyone is working on that aspect of their app...
  13. Like
    DesiLogi got a reaction from NeoInJS in Bulk Edit Auto-Submit   
    Hi,
    Does anyone know how to put code in the footer of a Bulk Edit form so it auto-submits (so the user doesn't have to click the Update button)?  This code:
    <script type="text/javascript">
      if(document.getElementById("caspioform")) {
      document.getElementById("caspioform").style.display = 'none';
      setTimeout('document.forms["caspioform"].submit()',1000); }
    </script>
    works only on a regular Update or Submission form. If you use it in Bulk Edit it just keeps refreshing the records over and over. So there must be some specific code for Bulk Edit. 
    As well, if I can get Bulk Edit to auto-submit I'd like to remove he Update button so if anyone has code for that it'd be really great. Thanks!
  14. Like
    DesiLogi got a reaction from Becca37 in Bulk Edit Auto-Submit   
    thanks- this will help when the auto-submit is worked out. Once I get that done I'll post the solution here as well. 
  15. Like
    DesiLogi reacted to Jan in Email Trigger Of Multiple Records   
    Hello everyone,
     
    I have found a solution, but it requires additional steps.
     
    Select the field with id or with any unique value, on the Advanced tab, select the Pass field value as parameter checkbox and copy the name of the parameter (for example, "[@id]"). Add a Virtual field, select the Hidden Form element, select the External Parameters "On load, receive", paste the name of the parameter from step 1 (for example, "[@id]"). Add the second Virtual field, select the Hidden Form element, select the Data Source Field "On load, receive", select the field with id or with any unique value, the field from step 1. Add the Header&Footer element, select the Footer element, click the Source button and enter the following script: <script type="text/javascript"> if(document.getElementById("caspioform")) { if(document.getElementById("cbParamVirtual1").value==document.getElementById("cbParamVirtual2").value)   {           document.getElementById("caspioform").style.visibility = 'hidden';      document.write('<font face="arial" color=red size="5">Email Notifications have been Sent!');        } else   setTimeout('document.forms["caspioform"].submit()',1000); } </script> I hope, it works. And it is not too complex
  16. Like
    DesiLogi reacted to Jan in Email Trigger Of Multiple Records   
    Maybe, it is possible to merge both scripts (and three steps, that allow do not click the last record more than once):
    <script type="text/javascript"> if(document.getElementById("caspioform")) { if(document.getElementById("cbParamVirtual1").value==document.getElementById("cbParamVirtual2").value)   {           document.getElementById("caspioform").style.visibility = 'hidden';      document.write('<font face="arial" color=red size="5">Email Notifications have been Sent!');        } else   {     if("[@field:text]" == "105") { setTimeout('document.forms["caspioform"].submit()',1000); }     else       {          var v_link = document.getElementsByName("JumpToNext")[0];          if(v_link){ v_link.click(); }        }    } } </script> I hope, it helps.
  17. Like
    DesiLogi got a reaction from kpTechman in Use Calculated Field for Sum in tabular   
    The problem (I get error when trying) is those calculated fields aren't drawing from the same table. Is there a way to put, instead of [@calcfield:1] the actual syntax from calcfield:1 which is:
    SELECT
    Proposals_Deposit
    FROM Proposals Where ProposalID=target.[@field:Items_ProposalID] AND CompanyID ='[@authfield:CompanyID]'
    That said, calcfield2 is even more complicated because it's choosing from 3 other calculated fields, in a different View. 
    If I can somehow use all sub-SELECTs instead of the [@calcfield:1 or 2] that would probably do it but I don't know how, or if it's possible. 
  18. Like
    DesiLogi got a reaction from Isabelleg in How to show & hide submit & details form on same page as tabular results using div column changes in bootstrap   
    I thought this might be helpful across the board for people developing in Caspio. I've been trying to do a better UI for data entry on web pages that also have to show results in a tabular report.
    Since iframes don't reliably pass parameters from parent to child and back it's necessary to sometimes deploy 2 datapages (a Submit or Details and a Tabular) on the same web page. This doesn't really look good from a UI perspective. 
    This solution requires using bootstrap and jquery but it's fairly straightforward. 
    One option is to put the the Submit/Details  deploy code in the first div with something like class="col-md-3" and the Tabular deploy code in the next div with class="col-md-9" (divs in bootstrap with col classes must add up to 12 but no more than 12, in basic mode). This will put the 2 datapages next to each other, the 1st with 1/4 screen width and the 2nd with 3/4th. However, this setup looks cluttered and can constrain the Tabular report which often needs full page width to show its data clearly. 
    So the ideal would be to onload hide/collapse the first div (with the Submit/Details form) and have the second div (tabular report) a full 12 columns wide. Then click a button or link to show the 1st div (Submit form) and change the 2nd div (tabular report) to 9 columns, thereby displaying both datapages when data entry/edit is needed. Clicking the button/link again (in this method) will collapse div1 and expand div2 back to 12 columns. So it's easy to toggle views this  way. 
    To do this: 
    Put this in the body of your webpage (you may have bootstrap and jquery referenced differently):
    <div class="container-fluid"> <br> <div class="row"> <div class="col-md-3 bg-faded"> <div id="showsubmitform" class="collapse"> Caspio Deploy Code for Submit/Details form </div> </div> <div class="col-md-12" id="right"> <div> Caspio Deploy Code for Tabular Report </div> </div> </div> </div> <script src="//ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <script> $('#btnSwitch').click(function(){ $('.col-md-3').toggleClass('show'); $('#right').toggleClass('col-md-9 col-md-12'); }) </script> And then put a button or link elsewhere on your page, wherever you want to show it: 
    <a class="btn page-action" id="btnSwitch" href="#showsubmitform" style="color:green;" data-toggle="collapse"><i class="fa fa-plus" aria-hidden="true"></i> Submit New Data</a> When the page is loaded the Tabular Report will be the only datapage showing, in full width. 
    When the 'Submit New Data' link is clicked the Tabular Report moves to the right and shrinks to 9 columns from 12. The space that opens on the left is 3 columns wide and will now show the Submit/Details form. 
    When the 'Submit New Data' link is clicked again it will hide the Submit/Details form and expand the Tabular Report back to 12 full columns. 
    You can change the column numbers of the divs and button ids and labels to suit. This solution might help with some UI massaging, if anyone is working on that aspect of their app...
  19. Like
    DesiLogi got a reaction from mjsidoarjo in Save Value in Virtual List box and pass as Parameter on button click (not Submit)   
    I have a submission form where there's a choice aside from the normal 'submit new record' function (that's available too but the user can also go this other route). 
    There is a Virtual Field that is a List Box. The user can select a single record from this List Box (not multiple records) and then click a button (not the Submit button) to go to a different datapage. I need to pass the Value of the Virtual List Box as a parameter in the button's url link but don't know how to 'save' that value on the Virtual Fields' 'change'. 
    Does anyone know how to use the Virtual field's current value (probably using a variable from 'on change'?) as a parameter in a url? 
    In this example Virtual 1 is a List Box that stores a numerical unique ID value for the selection. I need to pass that in the url as a parameter.
    <div style="text-align: center;"><a href="../mypage?ExampleID=[@cbParamVirtual1]&otherfieldID=[@otherfieldID]" target="_self"><input class="cb_custom_btn" type="button" value="LINK" /></a></div>  
  20. Like
    DesiLogi got a reaction from Mathilda in How to show & hide submit & details form on same page as tabular results using div column changes in bootstrap   
    I thought this might be helpful across the board for people developing in Caspio. I've been trying to do a better UI for data entry on web pages that also have to show results in a tabular report.
    Since iframes don't reliably pass parameters from parent to child and back it's necessary to sometimes deploy 2 datapages (a Submit or Details and a Tabular) on the same web page. This doesn't really look good from a UI perspective. 
    This solution requires using bootstrap and jquery but it's fairly straightforward. 
    One option is to put the the Submit/Details  deploy code in the first div with something like class="col-md-3" and the Tabular deploy code in the next div with class="col-md-9" (divs in bootstrap with col classes must add up to 12 but no more than 12, in basic mode). This will put the 2 datapages next to each other, the 1st with 1/4 screen width and the 2nd with 3/4th. However, this setup looks cluttered and can constrain the Tabular report which often needs full page width to show its data clearly. 
    So the ideal would be to onload hide/collapse the first div (with the Submit/Details form) and have the second div (tabular report) a full 12 columns wide. Then click a button or link to show the 1st div (Submit form) and change the 2nd div (tabular report) to 9 columns, thereby displaying both datapages when data entry/edit is needed. Clicking the button/link again (in this method) will collapse div1 and expand div2 back to 12 columns. So it's easy to toggle views this  way. 
    To do this: 
    Put this in the body of your webpage (you may have bootstrap and jquery referenced differently):
    <div class="container-fluid"> <br> <div class="row"> <div class="col-md-3 bg-faded"> <div id="showsubmitform" class="collapse"> Caspio Deploy Code for Submit/Details form </div> </div> <div class="col-md-12" id="right"> <div> Caspio Deploy Code for Tabular Report </div> </div> </div> </div> <script src="//ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <script> $('#btnSwitch').click(function(){ $('.col-md-3').toggleClass('show'); $('#right').toggleClass('col-md-9 col-md-12'); }) </script> And then put a button or link elsewhere on your page, wherever you want to show it: 
    <a class="btn page-action" id="btnSwitch" href="#showsubmitform" style="color:green;" data-toggle="collapse"><i class="fa fa-plus" aria-hidden="true"></i> Submit New Data</a> When the page is loaded the Tabular Report will be the only datapage showing, in full width. 
    When the 'Submit New Data' link is clicked the Tabular Report moves to the right and shrinks to 9 columns from 12. The space that opens on the left is 3 columns wide and will now show the Submit/Details form. 
    When the 'Submit New Data' link is clicked again it will hide the Submit/Details form and expand the Tabular Report back to 12 full columns. 
    You can change the column numbers of the divs and button ids and labels to suit. This solution might help with some UI massaging, if anyone is working on that aspect of their app...
  21. Like
    DesiLogi got a reaction from TWIRED in Copy image field from one table to another in Submission form   
    Hi Twired,
    Thanks for the tips on this- I do understand re an image not being stored in the table but instead the path to that image is stored and then the image grabbed to open (that's how I used to set up my Access databases with image files). I believe what you're suggesting above is referencing the original image via a joined table in a View. Unfortunately, this isn't what I need to do. I need to actually duplicate the image into the new table. 
    This is because the data in one table is used as a reference point to add records to another table but beyond that the are not relatable. As in table1 is a 'Catalogue' with records to draw from. Those records are used (sometimes) to populate records in table2 'Items' which are actual physical 'items and work' on a project. Once a record is in the Items table it is independent and can be changed in many ways. Likewise, the Catalogue record that was used to first 'create' the Items record can and will be changed. The image may be changed along with other information- but the 'Items' record that was made for it needs to NOT change also (because it is now an independent entity). Meaning if an image in the Catalogue record is changed then the image in the related Items record must NOT also change. So a View with joined tables would not work for this. 
    This isn't a relational database 'don't duplicate data' issue- in this particular case I do actually need to duplicate some records, instead of using FKs. 
    Hence, my query about how to duplicate the image into the new table. As per your explanation above, I was hoping to be able to duplicate the image path to the new table, into the image field. Because users enter data in this table in a few ways, manually as well as by copying from the 'Catalogue' table- so images need to be in a single field for displaying purposes. I can't have a field for manual upload when a record is manually created, and a separate (text) field for a 'copied' record from the Catalogue. The image field is used all over the app and if there are 2 fields (one an image field, one a text field from copying) it will not work in many (complicated) displays. 
    So the fact that an image file must be user-uploaded (thanks for pointing that out) means that I can't copy the image path itself into an 'image' field, only to a text field. So that's a no-go, unfortunately. 
    I had Caspio do some custom work on duplicating records in this way but was hoping to avoid that expensive and time-involved route, if possible. If I come across a solution I'll definitely post it here for others. Also, thanks again for your help on this- much appreciated either way. 
     
  22. Like
    DesiLogi got a reaction from TWIRED in Check text field for null in javascript if then   
    Hi TexterVaid,
    Thanks for the suggestion- I wasn't able to get it to work using that for some reason. I fiddled around and finally got the code to work- it seems Caspio is somewhat random as to what js works with its data fields. 
    Removing the parseFloat, changing the if clause a bit (I tried 'else if' as suggested but just the 'else' ended up working) and making the fields 'hidden' seemed to get it right:
    var v_lk = document.getElementById("EditRecordmstrSuppliers_LinkedIn").value; if(!(v_lk) == "") { Thanks again for helping and hope this solution works for someone else too- 
  23. Like
    DesiLogi got a reaction from TWIRED in Custom Submit button with url destination in html block   
    Thanks for posting this- I need to play around with it to make it applicable to my particular scenario but this is a good place to start. 
  24. Like
    DesiLogi got a reaction from TWIRED in Update different Fields based on Virtual field value   
    I ended up using the above and some other code for if/then to get it to work. Here's the solution in case anyone else needs it:
     
    <SCRIPT LANGUAGE="JavaScript"> function concatenate() { var productid = document.getElementById("cbParamVirtual1").value; if (productid == 3){ var x = document.getElementById("cbParamVirtual2").value; document.getElementById("EditRecordmyTextfield1").value = x; } else if (productid == 1){ var x = document.getElementById("cbParamVirtual2").value; document.getElementById("EditRecordmyTextfield2").value = x; } else if (productid == 2){ var x = document.getElementById("cbParamVirtual2").value; document.getElementById("EditRecordmyTextfield3").value = x; } else if (productid == 4){ var x = document.getElementById("cbParamVirtual2").value; document.getElementById("EditRecordmyTextfield4").value = x; } else if (productid == 5){ var x = document.getElementById("cbParamVirtual2").value; document.getElementById("EditRecordmyTextfield5").value = x; } else if (productid == 6){ var x = document.getElementById("cbParamVirtual2").value; document.getElementById("EditRecordmyTextfield6").value = x; } } document.getElementById("caspioform").onsubmit=concatenate; </SCRIPT>  
  25. Like
    DesiLogi got a reaction from TMeyer in Open tabular datapage 'as download file' directly   
    I'm trying to work with a datapage's download file in a bit of a different way then normal. Instead of the user clicking the 'Download' link I need that download csv file to just 'open in the url.' (meaning the datapage tabular view doesn't open at all). 
    This is because I need that download csv file to be available via a url for another, outside app to access (using that url) and then use to import that data. I need to cut out the steps where the user has to 'download the data,' take that file and then 'upload it to the outside app' to do the actual import. The outside app should be able to just go to a url and grab the data. 
    I’ve looked into the Datahub but it won't work for this particular need because it’s an ‘all data all the time’ thing with 2 drawbacks. 1) it doesn't 'authenticate' the data at a sub-account level, other than the overall CB account and 2) all records need to not be exported at all times- only records the user designates or that are in a queue using various fields in the View for filters.
    The existing ‘download’ link in a tabular datapage is close to solving both the authentication issue because 1) the datapage will only show data for the account that’s logged in and authenticated already, by design and 2) the ‘export status’ issue is dealt with using normal filters to filter out non-exportable or already exported records. These are the 2 big hurdles and using existing data pages solves them both. 
    The missing part of this solution would merely be setting the datapage to ‘open the download file’ instead of opening the datapage view, on load. Since the datapage already has a download link the user can click on to get the data downloaded in xml/csv, it’s got to be just a matter of pointing the ‘on load’ of the datapage to just go to that existing ‘download’ link and instead of downloading anything just open it in the data page’s existing url.
    Another related option might be for the datapage's 'onload' to activate the 'download csv' file and send it to a specific, designated url that's not the opening datapage (if that's easier). Then the outside app can go to that url and pull the download csv file.
    Surely this can be done? It seems like it’d be very similar to the code for ‘select all’ and then ‘open bulk edit’ automatically that can be implemented on a tabular datapage. We just need ‘onload’ to be ‘open download xml/csv.'
    Any help on this would be greatly appreciated- 
×
×
  • Create New...