any clues

how can i add a check so the JS have single and does not break right now its breaking using coldfusion 2021

<cfset struct['id'] = '<button type="button" class="btn btn-primary btn-sm" onClick="Check('ID#qry.id#');"><i class="fas fa-cogs"></i></button>'>

ColdFusion makes it simple to populate a form field with a previously submitted value: <input name="myVar" value="#form.myVar#"> Q: How do I do the same using JavaScript? If the values were in the url scope, I could use window.location.href, but they're in the form scope instead.

I'll post all this to stackoverflow too. (But I'll probably get my hand slapped)

Relocating question over here; Does anyone have a general approach or library they use for prompting for a session timeout? We currently have a JS library called session timeout (https://github.com/travishorn/session-timeout) to prompt the user their session is going to timeout or for them to continue it and we just hit a CF page to keep alive. BUT we have users who open numerous tabs so don't see the first tab's timeout prompt and their session times out in their current tab. So we need a solution that can prompt and track across all tabs and prompt. Thanks for any feedback.

message has been deleted

I'm sure a lot of you have used the little ls help bubble popups. I have used a couple of the live chat services. And when you are not logged in it just collects info and sends it as an email. I am thinking about adding a tool like that to our cf application to submit help requests. Anyone have suggestions?

what is the closest library to this one jQuery Form Validator [DISCONTINUED] which does not need much change

how about a link?

Do you mean

<https://jqueryvalidation.org/>

? Oh I guess you mean

<https://github.com/victorjonsson/jQuery-Form-Validator>

but you aren't making this easy!

Can you use a CASE statement in a select statement in SQL?

I'm trying to do some Javascript development for the first time in roughly 15 years, and even then, it wasn't really something I was an expert in... I feel like what I'm trying to do should be fairly simple, but it feels like there's been a paradigm shift that I wasn't privy to, that's making all the documentation I've found online really confusing. Starting with my most basic goal -- i'm trying to include this code in my page, so that I can have a stacked area chart: https://observablehq.com/@d3/stacked-area-chart I've copied that function into a javascript file (d3.charts.js), along with https://observablehq.com/@d3/color-legend#Swatches which it also references. But Swatches calls htl, which I eventually figured out was this: https://github.com/observablehq/htl So then I was trying to figure out how to include that in the page as well which has opened a giant can of worms. Given that the last time I worked with javascript was 2007 or 2008, Node.js, and npm, and anything resembling a modern javascript framework did not exist. I learned that I could use

browserify

to bundle an application, and include it in an html page, which sounded like what I wanted, so I'm trying to do that, but this is also where things have gotten complicated. I was able to sort out that if I put this code at the top of my d3.charts.js file, it pulls in the correct dependencies.

const d3 = require("d3/dist/d3");
const htl = require("htl/dist/htl");

And I can use

browserify

to bundle all those dependencies into a single file. The charts depend on d3 per above. d3 depends on jquery. But I also use foundation-sites which also depends on jquery. So I figured that it would be a good idea™ to package jquery as one bundle, foundation as a second bundle, and d3 and the charts as a third bundle (so as not to have jquery duplicated, and to not include the chart bundle on pages that don't need it), and that somehow, I'd be able to set it up so that foundation and my chart bundle would be able to reference jquery. I was able to work out how to exclude jquery from my foundation and chart bundles (

browserify -x jquery

), but what I haven't successfully worked out is how to reference jquery in the HTML so that foundation and the charts can see and use it. It seems that

browserify --standalone

is involved somehow, because that's what's supposed to make things visible from outside the bundle. But I haven't figured out how to make this work. I'm not sure what additional code, etc. might be useful, so I'm going to leave it here, but can reply with whatever. Also, if anyone has a completely different approach, I'm also open to that. Like I said at the start -- I just want the chart in the page...

i am trying to use a listfind in the loop where the following should appen

return this.system.filter(function (item, key) {
        if(key.)
      });

what ia m tryin to chhieve , if the key is: 1,2,3,4,5 it should be equal to 9 and it should also exclude key 7 from the list, i know in cf we can do listfind but i am nt sure in javascript

in vueJS, one of the api i am using does not send http referrer request any clues why it does so i am new to vue and literally have no clue on it i am searching google but could not find any solution

anyone knows any calendar which selects the weeks instead of days

looking for jquery one

Hey, I am trying to find a simple native js solution to stick a button on an html report to "copy" the entire window contents to the clipboard. All I have found are complex things with event handlers and such. I don't understand them. https://stackoverflow.com/questions/36270886/event-clipboarddata-setdata-in-copy-event

Hi guys, I'm using MixItUp to filter a result set. While I can count the DOM items having a certain class (say .LongLife), some elements having the same class but an inline style added by MixItUp to hide the elements ( style="display:none ) are also counted. I'd like to only count those which match class ".LongLife" and NOT got style:"display:none" (those simply show up as style="" ) - is this possible with either plain JavaScript or AlpineJS? Here's a very rough draft (I am not good at JS, please be kind!) of the function so far, which is called onMixEnd (a callback in the MixItUp library):

function countEurobat10items() {

        var eurobat10counterX = Array.from(containermixitup.querySelectorAll('.LongLife'));
        console.log(eurobat10counterX.length); // example: 35 total in DOM, 15 have "display:none" -> I want this number to be 20
        eurobat10counter = eurobat10counterX.length;
        // set this counter value into a span ID in the filter box
        $('#eurobat10counter').html(eurobat10counter);
       
        // change the className of the filter row, i.e. if we filter on one kind, we fade the others
        if ( eurobat10counter < 1 )
            {
                document.getElementById("eurobat10Label").className = "configuratorOptionItemSmallDisabled";
                document.getElementById("eurobat10counter").className = "configuratorOptionCounterDisabled";
            }
            else {
                document.getElementById("eurobat10Label").className = "configuratorOptionItemSmall";
                document.getElementById("eurobat10counter").className = "configuratorOptionCounter";
            } ;
    }

Good morning all, I'm currently learning Alpine JS. I have built a select list using Alpine and am now trying and make one of the options 'SELECTED' based on the value of an alpine variable. It almost works. The first x-if works showing the selected option but the second x-if never shows the rest of the options.

<div class="travFormInput">
          <select x-model="p_person_to" name="p_person_to" required>
            <option value="">Choose one</option>
          <template x-for="u in acctUsers" :key="u['USERID']">
            <template x-if="p_person_to == u['USERID']">
            <option :value="u['USERID']" x-text="u['FULLNAME']" SELECTED></option>
            </template>
            <template x-if="p_person_to != u['USERID']">
              <option :value="u['USERID']" x-text="u['FULLNAME']"></option>
            </template>
          </template>
          </select>
        </div>

any ideas or better ways to do this?

I'm trying to create a small PWA with JavaScript (just jQuery) that uses Firebase Cloud Messaging. I Initialize messaging like this:

<script type="module">
	import { initializeApp } from "<https://www.gstatic.com/firebasejs/9.14.0/firebase-app.js>";
	import { getMessaging, getToken, onMessage } from "<https://www.gstatic.com/firebasejs/9.14.0/firebase-messaging.js>";

	// Your web app's Firebase configuration
	const firebaseConfig = {
		apiKey: "<Api-Key>",
		authDomain: "<Domain>",
		projectId: "<ProjectId>",
		storageBucket: "<Bucket>",
		messagingSenderId: "<Sender-Id>",
		appId: "<App-Id>",
		name: "<App-Name>"
	};

	// Initialize Firebase
	const app = initializeApp(firebaseConfig);
	const messaging = getMessaging();

	getToken( messaging, { vapidKey: '<Public-Key>' } )
	.then((currentToken) => {
		if (currentToken) {
			window.localStorage.setItem( 'fbToken', currentToken );
		} else {
			console.log('No registration token available. Request permission to generate one.');
		}
	}).catch((err) => {
		console.log('An error occurred while retrieving token. ', err);
	}); 

	onMessage(messaging, payload => {
		console.log("Message received. ", payload);
		const { title, ...options } = payload.notification;
	});
</script>

On clicking a button the app reads the token from local storage and sends an ajax request to CF which then uses

cfhttp()

to send a message to Firebase with this request body:

{
    "to" : arguments.data.fbToken
  , "notification" : {
        "message": arguments.data.msg
      , "title": "Greetings"
    }
}

The result of the

cfhttp()

call shows

success: 1

(plus things like

multicast_id

and

message_id

), so I assume that I did things right so far. Yet the

onMessage()

event handler never fires, and I don't know whether the message never arrives or if there is a different problem. Any ideas or hints?

see what's being returned with the browser's devtool?

Does anyone here have experience setting up CORS on Hostek? Trying to get my demo working and their servers seem to be ignoring my config.

message has been deleted

Quick question about triggering a javascript chart (amCharts in this case) after manually selecting a tab: I have added some tabs to a "detailed view" on a product listing. On one of the tabs, a chart is generated. As there are about 30 concurrent products listed, 30 charts are being drawn in the background before I know if the visitor actually wants to see the chart, which delays the entire page build too much. Is there a good way using AlpineJS ideally (which I use for the tabs) to trigger the javascript for the charts when the selected tab is active? Many thanks for pointers!