Incorporating Checkbox Value into Textbox with classic ASP and jQuery

Here is a glimpse of the code I've written:

 response.write "<th align=left><font size=2>"
    response.write "1. <input type=checkbox class='checkboxes' value='ORG'>Organization"
    response.write "</font> </th>"
    response.write "<th align=left><font size=2>"
    response.write "2. <input type=checkbox  value='OpType' class='checkboxes'>Operation Type"
    response.write "</font> </th>"
    response.write "<th align=left><font size=2>"
    response.write "3. <input type=checkbox checked  value='YEAR' class='checkboxes'>Year"
    response.write "</font> </th>"

response.write "<tr><td colspan='3'> <input name='DISTRIBUTION' size='45' /></td></tr>"

And here is the JavaScript accompanying it.

<script type="text/javascript" src="../Scripts/jquery-1.9.1.js"></script>
$('.checkboxes').change(function () {
    alert("1");
    $("input[Title='DISTRIBUTION']").val("");
    if ($('.checkboxes').is(':checked')) {
        $("input[Title='DISTRIBUTION']").val("Yes");
    }
});

I'm not getting the alert message, and it seems like it's not triggering. Could you point out what might be wrong in my implementation?

javascriptjqueryasp-classic

Answer №1

It's possible that the script is running before the document is completely loaded. To solve this issue, try enclosing your jQuery code within:

$(document).ready(function () { ... });

Additionally, exploring KnockoutJs could simplify your tasks...

Answer №2

It appears that the issue lies in not ensuring the DOM is fully loaded before assigning event handlers. Consider utilizing the following approach...

$(function() {
    $('.checkboxes').change(function () {
        alert("1");
        $("input[Title='DISTRIBUTION']").val("");
        if ($('.checkboxes').is(':checked')) {
            $("input[Title='DISTRIBUTION']").val("Yes");
        }
    });
});

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Exploring the Depths of React by Cycling Through Arrays in Tabular Format

One issue I'm facing is that I have an array named paymentMethods which I'd like to iterate through in tabs. However, I seem to be struggling with the iteration part. To take a closer look at my code, please visit my codesandbox HERE <div& ...

javascriptreactjsarraysecmascript-6material-ui

Utilizing jQuery variables to manage various events simultaneously

Is it possible to set a variable that can be accessed and utilized in various events like mouseout, mouseenter, click, etc.? The code snippet looks something like this: $('a div') // Get the width and height of the image //var $img_ ...

jquery

Next.js does not support Video.js functionality when using server side rendering

I'm struggling to set up video.js in my next.js project and encountering issues. When the player is loading, it initially appears black and then disappears abruptly. A warning message in the console reads: "video.es.js?31bb:228 VIDEOJS: WARN: T ...

javascriptreactjsnext.jsserver-side-renderingvideo.js

Exploring the functionalities of AngularJS' ng-options when working with select elements

In my search through other posts, I came across this issue but couldn't find a solution. Here is the array in question: $scope.items = [ {ID: '000001', Title: 'Chicago'}, {ID: '000002', Title: 'New York' ...

javascriptangularjshtml-selectng-options

enable multiple ajax form submissions

This code snippet is responsible for fetching and displaying more results from the database onto the webpage. However, there seems to be an issue where the form submission only works once and fails on subsequent attempts. Here is the HTML structure: < ...

jqueryajax

Error: The module 'https://www.gstatic.com/firebasejs/9.6.0/firebase-app.js' is missing the required export 'default'

I'm currently in the process of setting up and testing Google authentication for a web application that I'm developing. Unfortunately, I've encountered several issues with getting the JavaScript functions to work properly, and I am uncertain ...

javascriptfirebasefirebase-authenticationgoogle-authentication

The success callback does not trigger when the status code is 201

Dealing with API Rest, I aim to create a resource using AJAX and JQuery. Although my resource is effectively created, the error callback is triggered. Here's the code snippet: $.ajax({ url: "/api/skills.json", data: JSON.stringify(skill), ...

jqueryajax

Specify the return type based on specific parameter value

I'm facing a situation where I have two definitions that are identical, but I need them to behave differently based on the value of the limit parameter. Specifically, I want the first definition to return Promise<Cursor<T>> when limit is g ...

javascripttypescripttypescript-typings

How to Resolve ENOENT ERROR When Using fs.unlink in an Express.js Simple Application?

Currently, I am developing a basic blog using express.js. For managing the posts, I have opted for Typicode/lowdb as my database. The posts are created, updated, and deleted based on unique IDs stored in a data.json file. Additionally, I utilize the slug d ...

javascriptjsonnode.jsexpressfilesystems

Encountering Issues with Implementing Bootstrap Select for Multiple Selections

I have implemented BootStrap-Select for multi-selection functionality. When selecting multiple options from a list of 10, I noticed that if I select a 4th option, another selected option gets randomly unselected. To address this issue, I am using the follo ...

jquerytwitter-bootstrap-3bootstrap-select

Generate an array of checked inputs to be used when posting to a REST API

I have been using .push() to create a checked array of "List" inputs for posting to a REST API. However, it doesn't seem to be working correctly. When unchecking an item, it is not automatically removed from the array. Does anyone have a better solut ...

javascriptangularjs

Establish a WebSocket connection via Meteor.js

How do we establish a Websockets connection in Meteor? Can we achieve this using the following code: ws = new WebSocket('ws://localhost/path'); ws.on('open', function() { ws.send('something'); }); ws.on('message&apo ...

javascriptnode.jsmeteorwebsocketnpm

Refreshing certain sections of a webpage without the need to refresh the entire page

If you want to understand better, it would be helpful if you could check out my website first at: The main part of the website is a stream from Own3D.tv displayed through an iframe (line 342). My objective is to have the ability to click on a specific str ...

phpjavascripthtmlcssajax

Creating a dynamic progress bar that scrolls for multiple elements

I am currently working on implementing a scrolling progress bar to show users how much of an article within a div they have read. For reference, something similar can be seen on this site. I have created my custom progress bar and coded it on fiddle, whe ...

javascriptjqueryhtmlscrollprogress-bar

Is there a way for me to update a Link To containing a parameter by using history.push with a parameter inside a table cell?

Hey there! I'm working on some code and wondering if it's doable to replace the Link To with a history.push, including the following parameter, like so: <TableCell style={{width: '10%'}}> <Link to={`/run-id/${item.run_ ...

javascriptreactjsreact-routermaterial-ui

What causes the Element to be null in Vue.js?

Could someone please clarify why the console.log output is showing as null, and provide guidance on how to resolve this issue? <template v-for="day in getMonthLength()"> <td> <input :id="day" type=number :value=&qu ...

javascriptvue.js

Checking for mobile SSR in a ReactJS applicationUncover the signs of mobile

I recently integrated the mobile-detect library into my project following this informative tutorial: link /src/utiles/isMobile.tsx: import MobileDetect from "mobile-detect"; import { GetServerSidePropsContext } from "next"; export co ...

javascriptnext.js

Can you determine the sequence in which these code statements are placed on the call stack?

I am a beginner in the world of Javascript and currently seeking to grasp a better understanding of how the JS execution engine operates. I am aware that any asynchronous code statement is pushed onto the call stack and then promptly removed, allowing it t ...

javascriptpromisees6-promisejavascript-engine

The JavaScript code that functions properly in Codepen is not functioning on my HTML page

Can you help me understand why this code is working fine in CodePen, but not on my HTML page? I'm unable to identify the error that may have occurred. Any assistance would be greatly appreciated! I suspect there's an issue with connecting some jQ ...

javascriptjqueryhtmlcsscoffeescript

Having trouble with integrating user input from HTML into a JavaScript file to execute a GET request

I am currently working on a project to create a website that integrates the google books API for users to search for books. To start, I have set up a server using express in index.js at the root of the project directory, and all my static files are stored ...

javascripthtmlexpress