Jump to content


Caspio Ninja
  • Posts

  • Joined

  • Last visited

  • Days Won


Everything posted by geoffdude

  1. Hello all - I know there are many Multiselect listbox topics that touch on some of my issues, but I can't find any info on how to reset a checkbox to false (off) after it's triggered a change event. Quick summary: • I have a multiselect listbox named "chkbox1" that has 3 checkboxes / options. • I want to limit the selection options to only 2 allowed, and pass those checked values to a data table (which is does now). • Problem = once 3rd checkbox is checked, it fires to limit collected values correctly, and shows an alert msg correctly.. but the 3rd checkbox stays "checked" and I can't figure out how to have it reset to unchecked. • Test page form is here: https://c0esh141.caspio.com/dp/f988200040b732ce715c40458847 • Screen grab of problem below: • The top-most listbox named "address" uses the datatype "text 255" and it works fine, as intended. • However, the multiselect named "chkbox1" uses the datatype "list-string" and the problem of an unwanted checkbox still checked. My code is below. <script type="text/javascript"> // enable multiple selections of listbox "address" document.addEventListener('DataPageReady', assignMultiple); function assignMultiple() { let fieldNameB = "InsertRecordaddress"; let xB=document.getElementsByName(fieldNameB); xB[0].multiple=true; } // limit "address" choices with alert msg $(document).ready(function() { var myMultiListBoxAddy = document.getElementsByName("InsertRecordaddress")[0]; var last_valid_selected = null; $(myMultiListBoxAddy).change(function(event) { if ($(this).val().length > 3) { $(this).val(last_valid_selected); alert("Alert: you can't pick more than"+" "+($(this).val().length)+". "+"Your current selections are"+" "+last_valid_selected); } else { last_valid_selected = $(this).val(); } }); }); // limit "chkbox1" choices with alert msg $(document).ready(function() { var myMultiListBox = document.getElementsByName("InsertRecordchkbox1")[0]; var last_valid_checked = null; $(myMultiListBox).change(function(event) { if ($(this).val().length > 3) { $(this).val(last_valid_checked); alert("Howdy -"+" "+"You can't pick more than"+" "+($(this).val().length-1)+". "+"Your choices are numbers"+" "+last_valid_checked); } else { last_valid_checked = $(this).val(); } }); }); </script> Thx for any and all help. Geoff
  2. I'm trying to figure out a way to change any character submitted to data table field, that's not 0-9 or A-Z/a-z to something else, using formula logic. I'm new to formulas, and this is what I'm playing with .. but it's not working as desired. It only runs the first "When" statement and ignores the others. CASE When Charindex ('''',[@field:promo], 0) <> 0 Then Replace([@field:promo], '''','') When Charindex ('é',[@field:promo], 0) <> 0 Then Replace([@field:promo], 'é','e') When Charindex ('ü',[@field:promo], 0) <> 0 Then Replace([@field:promo], 'ü','u') ELSE ( [@field:promo]) END Any tips, or ideas would be greatly appreciated. Thx
  3. Still a bit confusing to me .. however, how would the product "fail" lining inspection? What process in the flow validates/checks for a "pass" or "fail"?
  4. If you want to hide the info on result page of some kind, give your DIV an ID (use "box1") then try this: <script type="text/javascript"> document.addEventListener('DataPageReady', window.onload = function(){ var x = document.getElementsByName("InsertRecordZip3")[0].value; if (x == "") { document.getElementById("box1").style.display = 'none'; alert("Nothing entered - box hidden"); } else { document.getElementById("box1").style.display = 'block'; alert("Word entered - box not hidden"); } }); </script> <!-- add a style tag, with "box1" display set to 'block', then update your code for the DIV as below --> <style> #box1 {display:block}</style> <div id="box1" style="background:#eee;border:1px solid #ccc;padding:5px 10px;">Address:<br /> [@field:Address3]<br /> [@field:City3], [@field:State3]<br /> [@field:Country3], [@field:Zip3]</div>
  5. Can you provide a wire-frame of the flow that way we can see what's supposed to happen. Like: Product = GARMENT X Serial Number = 123456 Emp Id = TestID-00001 Station = Choices (Station A, Station B, etc) Then create the wire-frame for us to look at ... like this example below, except show your form fields w/names and what should happen with it's use (It will help us to figure out the flow/logic.)
  6. My first thought is you CSS in causing errors. The form CSS may be the issue .. but it's hard to determine without seeing the form live. Some things to try on the code you provided are as follows: <style> .ui-resizable-helper { border: 1px dotted gray; } ul#menu .activeMenu { background: #bb3033; } ul#menu { width: 100%; background: #21618C; font-size: 10px; font-family: "Arial", sans-serif; font-weight: bold; list-style-type: none; margin: 0; padding: 0; text-align: center; } ul#menu li { display: block; display: inline-block; margin: 4px 0 0 0; padding: 5px 15px 5px 15px; cursor:pointer;} ul#menu li a {color: #fff; text-decoration: none; display: block; line-height: 200%; } ul#menu li a:hover { color: #333; } /* FIX(1) move li styles here */ li { font-size: 11px !important; font-weight: bold !important; } /* FIX(2) get rid of padding, border, make width 100%, get rid of display block and position too, make background grey for testing only */ .content{width: 100%; height:1024px; background: #e5e5e5; padding: 0px; border:0px solid #21618C; overflow:hidden;} /* FIX(3) get rid of padding, make width 50% (iFrame width), make background blue (iFrame background color) for testing only */ .ChannelView{ width:50%; height:100%; margin-bottom:100%; background:#aae2ee;} /* FIX(4) disable this media query as it does nothing for this page @media (max-width: 1024) { .content { width: 96.6%; background: #ff0000 !important; } } */ </style> Let see what this style code change does, then go from there.
  7. You may need to create a copy of the form, then remove all the JS associated with that form and start testing by introducing portions of the script back into the test-form. You can also create a 3rd form copy to just focus on the fields that use the scripts, and run tests on these new forms to see when the error occurs. - It's a pain, but part of the developer process at times. Hunt and peck so to speak... without messing up your OG form.
  8. What was your code for the link opening a new window? Were you using <a href="somecaspioURL" target="_blank"> LINK HERE</a>? The code target="_blank" works for me.
  9. Also .. the referrer field will ONLY capture the domain address if the previous page links to your page. It must be a REFERRING domain.. so an active page on a live domain will work .. testing from your 'puter on a local page (from your 'puter) will not.
  10. You need to pass the "Virtual7" value as a "parameter" in your form's advance setting for that field- such as: On exit: Pass field value as parameter: [@Virtual7] Then on your report page have that virtual field set as display only, but also have it set to receive the parameter: Receive value or parameter: External Parameters = [@Virtual7]
  11. Do you have the Virtual7 form field set as: Form element: Text Field If you have Virtual7 set as display only like: Form element: Display Only it won't work.
  12. Where, and how, are you placing the code? * I tried your code and it works for me.
  13. Maybe create a wire-frame for us to look at ... like this example below. It may help to figure out the flow/logic. Sample wire-frame:
  14. I'm on 20.3 .. strange huh? Update: I had to clear my cache to see the new version changes. It's all good now.
  15. Is "Loops" even available for tasks anymore? I don't see it.
  16. Can you share the URL to the page? .. I can look at the source code that way, and maybe help.
  17. Or .. given that it's a results page, maybe this is more accurate: <script> var isi = document.getElementById("visi[@field:UniqueFieldName]"); if ('[@choiceList FieldName]' == "1") { isi.parentNode.parentNode.style.backgroundColor = '#firstColor'; } else if ('[@choiceList FieldName]' == "2"){ isi.parentNode.parentNode.style.backgroundColor = '#secondColor'; } else if ('[@choiceList FieldName]' == "3"){ isi.parentNode.parentNode.style.backgroundColor = '#thirdColor'; } else if ('[@choiceList FieldName]' == "4"){ isi.parentNode.parentNode.style.backgroundColor = '#fourthColor'; } else{ isi.parentNode.parentNode.style.backgroundColor = '#defaultColor'; } </script> With "choiceList" being the results page targeted field name. Just change it to your unique field name.
  18. Well.. based on the code example you and caspio provided, I'd start from there, like so (again based on a drop down): <script> var isi = document.getElementById("visi[@field:UniqueFieldName]"); var select = document.getElementById("fielda"); var selectedString = select.options[select.selectedIndex].value; if (selectedString == "1") { isi.parentNode.parentNode.style.backgroundColor = '#firstColor'; } else if (selectedString == "2"){ isi.parentNode.parentNode.style.backgroundColor = '#secondColor'; } else if (selectedString == "3"){ isi.parentNode.parentNode.style.backgroundColor = '#thirdColor'; } else if (selectedString == "4"){ isi.parentNode.parentNode.style.backgroundColor = '#fourthColor'; } else{ isi.parentNode.parentNode.style.backgroundColor = '#defaultColor'; } </script> This script should go at the bottom of the page in an HTML block .. and the colors would be hexadecimal like (#0000FF) or just "cyan", "yellow" etc.. but no number sign when using just color names.
  19. Take this sample code below and play around with it a bit. - Note the script works based upon a select dropdown .. then targets a DIV by changing it's background color and placing the selected value into the targeted span id. - This may help you alter your code to achieve similar results. <!doctype html> <html> <head> <meta charset="UTF-8"> <title>Untitled Document</title> </head> <body> <select id="fielda"> <option value="0">Select</option> <option value="1">one</option> <option value="2">two</option> <option value="3">three</option> <option value="4">four</option> </select> <div id="answerBox" style="background:#ccc; width:50%; margin:20px auto; border:1px solid red; padding:5px; color:#000; font-size:14px">Answer = <span id="selectNmbr" style="color:red; font-weight:bold">Selected Option</span> </div> </body> <script> var select = document.getElementById("fielda"); select.onchange = function(){ var selectedString = select.options[select.selectedIndex].value; if (selectedString == "1") { document.getElementById("answerBox").style.background = 'pink'; document.getElementById("selectNmbr").innerHTML = selectedString; } else if (selectedString == "2") { document.getElementById("answerBox").style.background = 'lime'; document.getElementById("selectNmbr").innerHTML = selectedString; } else if (selectedString == "3") { document.getElementById("answerBox").style.background = 'cyan'; document.getElementById("selectNmbr").innerHTML = selectedString; } else if (selectedString == "4") { document.getElementById("answerBox").style.background = 'gold'; document.getElementById("selectNmbr").innerHTML = selectedString; } else { document.getElementById("answerBox").style.background = '#ccc'; document.getElementById("selectNmbr").innerHTML = "Selected Option"; alert("nothing selected"); } } </script> </html> Good luck, LMK how it goes.
  20. Try targeting just the "label" tag .. then zone into which specific label tag to affect by changing the bracketed number [0], [1] etc. next to it. See my code below. <script type="text/javascript"> document.addEventListener('DataPageReady', function (event) { function myFunction() { var labelTarget = document.getElementsByTagName("form")[0]; labelTarget.getElementsByTagName("label")[0].innerHTML = ""; } }); </script> <!-- • The first part of the code finds the 1st[0] "form" tag • 2nd part of the code targets ALL the "label" tags as an array, but the unique label you want is found here > [0] .. this number needs to change until you find your specific label . once found, the script makes the label's HTML text become BLANK with the code call innerHTML = "" -->
  21. Great. And, you're very welcome. Best, Geoff
  22. Show, post, the code you used for the 2nd counter.
  23. • Use the same code, but change where it says "myFunction" to another name .. like "myFunctionB" or similar. Make sure to change all occurrences of it. • Also change the ID of the <span> tag to "cntB" and then change that in the script code too, so your counter text goes to the right area. • Finally - also change the target text area name, as you did earlier, to match what new text area field your targeting... Make sure and change all occurrences of it. LMK if this works.
  24. Try this. In your form add an HTML Block immediately under the textarea field. In the HTML block add this code below. Change the name of "InsertRecordmessage" to the unique name of your textarea field. Get that name by viewing page source while previewing the form. Here's the code: <!-- area counter text appears --> <div id="writing" style="width:90%; text-align:center; margin:0 auto 15px auto; font-size:11px; font-family:sans-serif; color:#000; padding:0 5%"> Total Word Count: <span id="cnt" style="color:red;">0</span> </div> <!-- script to capture keypress within the textarea field - change name of "InsertRecordmessage" if need be --> <script type="text/javascript"> document.addEventListener('DataPageReady', function (event) { document.getElementsByName("InsertRecordmessage")[0].addEventListener("keypress", myFunction); function myFunction() { var string = document.getElementsByName("InsertRecordmessage")[0].value; var wordcount = string.split(/[^\s]+/).length - 1; document.getElementById("cnt").innerHTML = wordcount; } }); </script> Good luck, LMK how it goes. Geoff
  • Create New...