Dynamically add a checkbox using JavaScript

Can anyone assist with dynamically setting a checkbox in JavaScript?

function updateCheckboxValue(html){
    var values = html.split(",");
    document.getElementById('fsystemName').value = values[0];
    if (values[1] == "true"){
        document.getElementById('fUpdateActiveFlag').checked = true;
    }
}

I am sending values separated by commas from my controller. When the value is true, I need to check the checkbox.

UPDATE: Whenever there is a change in the dropdown box, it triggers the displayResults method through its return statement:

$('#uINewsSystemList').change(function() {
    $.get("/live-application/SystemById", {systemid: $("#systemList").val()}, updateCheckboxValue, "html");

My goal is to update other elements like textboxes and checkboxes. While fsystemName correctly displays the value, fUpdateActiveFlag remains unchecked.

Answer №1

Your inquiry seems to be related to JavaScript rather than JSP.

In JSP, a for loop can be utilized to generate checkboxes as shown below:

<% for (Element item : elementList) { %>
<input type="checkbox" name="<%=item.getName() %>" value="<%=item.getValue() %>" <%=item.getChecked() ? "checked" : "" %> />
<% } %>

The generated output will look like this:

<input type="checkbox" name="option1" value="Milk"> Milk<br>
<input type="checkbox" name="option2" value="Butter" checked> Butter<br>
<input type="checkbox" name="option3" value="Cheese"> Cheese<br>

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

What is the best way to prevent the page from constantly refreshing?

Recently, I developed a code snippet that detects the user's geolocation and changes the currency accordingly. The functionality works as intended, but there is an issue where the page keeps refreshing due to the presence of certain code. If I remove ...

What are the factors that lead to the rendering of an Angular component?

Efficiency is key in maximizing performance with single page applications. Take, for example, React, where any change in state or props within a component triggers a re-execution, re-evaluation, and ultimately, a re-rendering of that component. With that ...

The value of msg.member is empty following the messageReactionAdd event

Whenever someone reacts on my server, it triggers the messageReactionAdd event. However, I am encountering difficulty in retrieving the member object of the author of a message that someone reacted to: module.exports = async (client, messageReaction, user) ...

Ways to ascertain if all functions in the chain have been executed by Javascript's Q deferred()

Can we determine with the Javascript Q promise library when all the functions in the chain have been executed? Below is a code snippet I found on this page (my question follows on from this): testJSCallbacks(); function testJSCallbacks(){ var i = 0, ...

How can you obtain constructor parameter from JSON directly within the constructor itself?

I decided to store the fixed parameters required for creating an object in a JSON file as an array. My goal was to have the constructor of the object fetch these parameters from the file. Although reading a JSON file is efficient, I wanted to explore othe ...

React/Ionic: Avoiding SVG rendering using <img/> elements

I seem to be encountering an issue when trying to load SVG's in my React/Ionic App. I am fetching weather data from OpenWeatherMap and using the weather?.weather[0].icon property to determine which icon to display. I am utilizing icons from the follow ...

AJax request is failing to execute - Different page is being displayed

Today, I decided to delve into the world of AJAX and started learning the basics. I attempted to create a simple AJAX call, but instead of receiving a response asynchronously, it just loaded the PHP script page as if it was a normal form submission. html ...

What steps can I take to successfully utilize $index named variables in Angular?

There is a div element in my HTML file with the following code: <div ng-repeat="loss in Model.plDetails track by $index"> <div class="col-sm-2"> <div class="input-group"> <input type="text" class="form-cont ...

I am unable to submit the form with the sweetalert 2 feature

I've tried numerous solutions, but none seem to work for me. Below is the PHP code I am using: <? if( isset($_POST['btn-login']) ) { $mails = new PHPMailer; $content = "xxxx"; $mails->IsSMTP(); $mails->send(); } ?&g ...

Issue with the loss of scope in the Subscribe event causing the Clipboard Copy Event

Hey there, currently I am attempting to implement a text copying feature in Angular 2. I have a function that executes when a button is pressed, fetching data from the database and converting it into readable text, which is then automatically copied to the ...

Arrange objects based on the most recent addition using Vue JS

I am working with a Vue array that consists of 3 objects with names and rates. I have already implemented a function to sort the items by rate: methods: { sortByRate() { this.complejos = this.complejos.sort(function(a, b) { return a.rate - ...

Struggling to animate the selector of a nested div in Jquery?

Despite trying numerous variations, I am struggling to identify the correct selector of a nested div. The goal is to animate this particular div, but since no animations are taking place, I suspect that I have not selected the right element. Here is the a ...

Ways to troubleshoot issues that arise when updating the node version

After upgrading my version, I encountered a serious error. I developed a program a few years ago using version 18.x. Now that I have upgraded node.js, I am facing some errors. Below are the error messages: ERROR in ./app/assets/scss/styles.scss (./node_mo ...

Design interactive diagrams in React js with the help of Fluent UI

I am looking to build a flowchart with interactive buttons in React JS using Fluent UI components. Unfortunately, I have been unable to find a suitable solution within the Fluent UI library for creating Flow Charts. If anyone has expertise in this area a ...

Unable to track user (Mineflayer - Node.js)

Trying to track a player using the mineflayer library in Node.js, but encountering an error within the source code of the library itself. Attempted code: const mineflayer = require('mineflayer'); const { pathfinder, Movements, goals } = require( ...

AngularJS Event Handler Fails to Trigger

I'm currently working on a form that I need to submit using the ng-submit event through a custom Auth service. This is a snippet of the login.html (partial template) <div class='container'> <form class='form-signin' ...

What is the proper way to retrieve an object from a json file?

My JSON structure looks like this: { "total": 4367, "page": 1, "per_page": 10, "paging": { "next": "/videos?query=second%20world%20war&per_page=10&access_token=XXX&page=2", "previous": null, "first": "/v ...

What is the process for generating an executable jar with external dependencies stored in a subfolder within the jar file using Maven?

Is there a way to create an executable jar with dependencies in a sub-folder within the jar using Maven? The current pom.xml configuration generates an executable jar with dependencies stored in the root directory. How can I modify the pom.xml file to hav ...

Discover how a universal Windows application utilizes webview to access Google Maps events

In the process of developing a Universal Windows App (UWA), I have integrated Google Maps using a webview. Using JavaScript and InvokeScriptAsync, I am able to add and remove markers on the map. Now, I am looking to handle events in the opposite direction ...

Utilizing an Angular controller to fetch and parse JSON data

Trying to fetch JSON data and present it on a Jade template using an Angular controller. Controller : processJson.js var getJson = angular.module('getJson', []).controller('controller1', function ($scope, $http) { var url = '/ ...