How can I ensure that my user responses are case-insensitive?

Currently, I'm facing a roadblock in my coding journey. I am trying to modify my code so that user responses are not case sensitive when compared for correctness. Can anyone offer some advice on how to achieve this?

Check out the code snippet below:

var questions = [
  ["What solar system do we live in?", "Milky Way"],
  ["How many ounces are in a cup?", "16"],
  ["What type of cellphone is currently the most popular throughout the world?", "iPhone"],
  ["What's Chicago's tallest building?", "Willis Tower"],
  ["What is the name of the Chicago White Sox' new stadium?", "Guaranteed Rate"]
];

var correctAnswers = 0;
var question;
var answer;
var response;
var html;
var correct = [];
var wrong = [];

function print(message) {
  var outputDiv = document.getElementById("output");
  outputDiv.innerHTML = message;
}

function buildList(arr) {
	var listHTML = "<ol>";
		for(var i=0;i<arr.length;i++) {
			listHTML += "<li>" + arr[i] + "</li>";
		}
    listHTML += "</ol>";
	return listHTML;
}

for(var i=0;i<questions.length;i++) {
  question = questions[i][0];
  answer = questions[i][1];
  response = prompt(question);
  if(response.toLowerCase() === answer.toLowerCase()) {
    correctAnswers += 1;
    correct.push(question);
  } else {
    wrong.push(question); 
  }
}

html = "You got " + correctAnswers + " question(s) right.";
html += "<h2>You got these questions correct:</h2>";
html += buildList(correct);
html += "<h2>You got these questions wrong:</h2>";
html += buildList(wrong);
print(html);

Answer №1

To ensure accurate validation, consider comparing them with either all lowercase or all uppercase characters:

if(request.toLowerCase() === solution.toLowerCase()) {

This approach allows users to input the answer in any case while still verifying it correctly.

Answer №2

To make it case-insensitive, you can apply the functions toLowerCase() or toUpperCase() to both the response and answer variables.

if(response.toUpperCase() === answer.toUpperCase()) {
    correctAnswers += 1;
    correct.push(question);
} else {
    wrong.push(question); 
}

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

A ServiceWorker used a promise in FetchEvent.respondWith() that resulted in a non-Response value of 'undefined'. This caused an issue in browser-sync

There are times when my server encounters an error in the console: Failed to load ‘http://localhost:3000/browser-sync/socket.io/?EIO=3&transport=polling&t=Lm2wn4p’. A ServiceWorker passed a promise to FetchEvent.respondWith() that reso ...

How to dynamically add HTML content to a JSON string with the help of Javascript

I am working with a JSON object that includes various messages to be displayed on a webpage using Javascript. This JSON file is located in a separate directory and I have full control over it, being loaded asynchronously. There are specific cases where di ...

Save to a JSON file

Hey there, I'm having some trouble with pushing a temporary value to a JSON file using the command "MyJSON.name.push". It keeps giving me an error saying "Undefined is not an object". I've tried different approaches and using JavaScript arrays wo ...

Transmit information from the backend Node.js to the frontend (without using sockets)

Is there a method to transfer data from my socket, for example example.com:8000, to my web server that is not on the same socket at example.com/index.php? I've searched through various codes but have not come across any solutions yet. If you could pro ...

Interactive Sidebar Navigation Content

On my website, I have a navigation sidebar that contains links to all of the main site pages. Each page has the same links, except the link to the current page is not included, making it easy to visually identify which page you are on. Currently, I manuall ...

Exploring Deeply Nested Routing in Angular

I've been exploring the use of multiple router outlets and encountered an issue. When using the navigateBy function of the router, I am unable to view my child route and encounter an error. However, when I access it via the routerLink in HTML, I get ...

"Troubleshooting: Why is my Bootstrap modal window only printing a

I've encountered an issue with printing the content of a Bootstrap modal window. Previously, the code I had was working fine but now it seems to be malfunctioning. Content is dynamically added to the form using appendChild() in a separate function. Ho ...

When iterating over objects in JavaScript, the loop may return undefined, while using Lodash's map

After encountering an issue with a JavaScript loop where the value was returning as null upon completion, I decided to try using lodash for the same purpose and it successfully returned the result. This is what I attempted: JavaScript: const jsRows = Ob ...

Finding the precise top offset position with jQuery upon scrolling – a step-by-step guide

I need help with detecting the offset top of a TR element when it is clicked. It works fine initially, but once the page is scrolled, the offset().top value changes. How can I resolve this issue? $(function() { $('tr').click(function() { ...

Is it possible to use setState after a setTimeout to unmount a component?

Can anyone help me find the issue with my code? I am attempting to clear an error message after a specific duration, but it's not working as expected. I'm puzzled about what might be causing this problem. export default class MyError extends Com ...

Is there a way to stop the execution of myFunc after it has been performed 5 times using clearInterval?

This code is designed to notify online shoppers that they need to choose a color from a dropdown menu before adding an item to their shopping cart. If no color is selected, the text will blink to alert them. How can I modify this code so that the blinking ...

Ways to boost an array index in JavaScript

I recently developed a JavaScript function that involves defining an array and then appending the values of that array to an HTML table. However, I am facing an issue with increasing the array index dynamically. <script src="https://cdnjs.cloudflare. ...

Modifying inner content without altering CSS styling

Inside this div, there is a paragraph: This is the HTML code: <div id="header"><p>Header</p></div> This is the CSS code: #header p { color: darkgray; font-size: 15px; Whenever a button is clicked, the innerHTML gets updated: H ...

Change the label's class when the input area is selected

Looking to add a new class to a label when its corresponding input element is in focus. A form consists of 10 input fields and 10 labels, one for each field. const inputFields = document.querySelectorAll('.form-control'); console.log(inputFie ...

Ensure the presence of a value in an array using Angular

I need to check if any of the "cuesData" have values or lengths greater than 0. However, in my current code, I can only evaluate the first array and not the rest. https://i.sstatic.net/bMpvg.jpg TS checkValues(values) { const result = Object.values ...

What steps should I take to address the issue of sanitizing a potentially harmful URL value that contains a

I've encountered a URL sanitization error in Angular and despite researching various solutions, I have been unable to implement any of them successfully in my specific case. Hence, I am reaching out for assistance. Below is the function causing the i ...

Tips for sending a successful POST request with the MEAN stack

Currently, I am utilizing yeoman to set up a new project. My ultimate goal is to master the process of scaffolding CRUD operations. However, I have encountered an issue with a post request. For this reason, I opted for the angular-fullstack generator as I ...

There seems to be an issue with the VueJs + ElementUi Change method as it is

Just starting out with Vue and Element UI. I'm attempting to create a custom component using the ElementUI autocomplete/select feature. The problem I am facing is that the @change method does not contain a event.target.value value. When I try to acc ...

Obtain the text that is shown for an input field

My website is currently utilizing Angular Material, which is causing the text format in my type='time' input field to change. I am looking for a way to verify this text, but none of the methods I have tried give me the actual displayed text. I a ...

Unable to import Node modules in WebWorker using NWJS

I've encountered a challenge that I thought would be straightforward. My project involves using nwjs (formerly known as Node-Webkit), which essentially means developing a desktop application with both Chromium and Node components where the DOM interac ...