JavaScript Button Selector & Name Generator

I'm currently working on a Java project to develop a name generator. I have successfully implemented basic functionality using tables. However, I am now looking to enhance this by allowing the script to seamlessly switch between tables using radio buttons.

For example, instead of having to select from both male and female names, I would like the user to be able to choose either male or female options. Does anyone have any suggestions on how I can achieve this?

window.onload = initAll;

function initAll() {
document.getElementById("sillySubmit").onclick = function() {
    document.getElementById("msgField").innerHTML = getSillyName();
    return false;
}
}

if(document.getElementById('gender_Male').checked) {
}else if(document.getElementById('gender_Female').checked) {

}

function getSillyName() {
var firstName = ["My", "First", "Name"];  

var middleName = ["My", "Second", "Name"]; 

var lastName1 = ["My", "Third", "Name"]; 

var lastName2 = ["My", "Fourth", "Name"]; 

Answer №1

JavaScript and Java are completely distinct languages with no connection whatsoever.

Your issue seems to be that you want the function getSillyName to generate different names based on the selected gender, but you're not implementing it correctly. Here's a suggestion:

function getSillyName() {

    //set some gender-neutral names
    var firstName = ["My", "First", "Name"],
        middleName = ["My", "Second", "Name"],
        lastName1 = ["My", "Third", "Name"],
        lastName2 = ["My", "Fourth", "Name"];

    if(document.getElementById('gender_Male').checked) {
        // add male-specific names to the arrays.
    } else if (document.getElementById('gender_Female').checked) {
        //add female-specific names to the array
    }

    //perform your magic here

}

You can populate an array using the .push() method

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

Prefixes for logging - Consider using the not-singleton technique or another approach

I am currently developing a logging helper for Node.JS that includes several exported functions such as error and warn. For instance, I have two other scripts called test1 and test2 which make use of this "module". When initializing my logging module us ...

What are the steps to align the alert message of my PHP contact form using Javascript?

Struggling to position the alert message (e.g. "You need to fill in all required fields!!") due to CSS constraints. Any suggestions on how to approach this issue? Any ideas? <!DOCTYPE html> <html lang="en-US"> <head> <me ...

The title of the homepage is showing up behind the AppBar. Any suggestions on how to correct this?

I encountered an issue with my appBar where the homepage was appearing behind it instead of below it. Here is a snapshot of the problem: https://i.stack.imgur.com/27LjB.png Below are the codes for the AppBar: const Header = () => { const [value, setV ...

Discovering the absent objects within an array of objects through comparison

I may need some guidance on this, so any suggestions are appreciated. Currently, I have developed a web scraper using Node.js that extracts a list of job postings from our organization's website. These jobs are stored as an array of objects, which is ...

The jQuery ajax function seems to be malfunctioning when attempting to send a post request

Having trouble with AJAX? Let me show you my approach to making a POST request to my RESTful service using AJAX: var lat = marker.getPosition().lat(); var lng = marker.getPosition().lng(); //xmlhttp.open("GET","http://192.168.1.100:8080/MapDemo/serv ...

'An error occurred when invoking the class method due to 'This' being undefined

I'm attempting to display a response message to the user, but encountering an error (Cannot read property 'message' of undefined). Here's the code snippet causing the issue: server.js const server = express(); let App = require(' ...

Create and dismantle a dynamic Three.js scene with memory management efficiency

Imagine a scenario where we have a webpage with two buttons: create and destroy. By clicking the create button, the Three.js scene in this memory test is dynamically added to the page and starts running. On the other hand, clicking the destroy button shoul ...

Different kinds of functions can take an optional property name as an argument and either return the value of that property in an object or the entire object itself

In need of a function that accepts an optional parameter propName, which must be a key belonging to SOME_OBJECT. The function should return the value of propName if it is provided, or else return the entire OBJECT: Here's the code snippet: type SOME_ ...

Unable to display items in controller with AngularJS

I am facing an issue with displaying a slider using ng-repeat in my AngularJS code. The pictures and other elements defined in the controller are not showing up on the page. Here is the JavaScript code snippet: angular.module('starter', []) .co ...

Is there a way to transform my json data into a particular structure?

My json string looks like this: arguments[0] = [{"one":"1","two":"1","three":"15","four":"esj","five":null,"six":"2015-10-15 00:00:00","seven":null}, {"one":"1","two":"1","three":"15","four":"esj","five":null,"six":"2015-10-15 00:00:00","seven":null}, {"o ...

Displaying a variable in a live HTML user interface

I have successfully created a Python program that captures data from an Arduino Potentiometer and shows it on the Python console. Now, I am working on enhancing the output by displaying it in a local HTML file. I am seeking guidance on how to incorporate t ...

Error in jQuery submenu positioning issue

I am attempting to design a menu that opens when the parent element is clicked and closes when the mouse leaves the previously opened one. It should operate from left to right. Here is an example: <ul class="menuFirst"> <li><im ...

Creating a VueJS computed property that dynamically responds to changes in the `window.innerWidth`

Essentially, I am searching for a computed property that will evaluate to true when the window.innerwidth is 768px or less and to false when it exceeds 768px. This is what I have attempted: computed: { isMobile() { if (window.innerWidth <= 768) ...

Leveraging Server Response Codes Across Different Domains Using JavaScript

Before anything else, I must acknowledge the cross-domain issues that may arise with JavaScript. The fact that I am seeing both 404 and 200 response codes in my console has made me reconsider this possibility. The scenario... I am currently developing a w ...

The ins and outs of import and export output explained

I'm currently struggling to understand the output of Import/Export Statement. For example, if I were to write this code: import React, { Component } from 'react'; import Cperson from '../components/person/person.js'; console.log ...

Dealing with Javascript Array/Serialization in C# (.NET)

I have implemented tableDnD to rearrange table rows and then serialized them using the function "$.tableDnD.serialize()". Now, I need to pass this serialized data to C# for further processing. What is the most effective way to do this? Below is a sample ...

Sending Information within Controllers with AngularJS

I have a unique scenario in my application where I need to pass input from one view to another. I have set up a service as shown below: .service('greeting', function Greeting() { var greeting = this; greeting.message = 'Default&ap ...

Output various strings to the standard output and stream them individually

Is there a way to redirect each string output to standard out to another command? // Example file: example.js #!/usr/bin/env node process.stdout.write('foo') process.stdout.write('bar') After running ./example.js | wc -m, the total ch ...

The window fails to retain the scroll position when overflow is enabled

Whenever I click on a specific div, I use jQuery to dynamically apply overflow: hidden to the html and body. $(".mydiv").on("click", function() { $("html, body").css("overflow", "hidden"); }); However, this action causes the window to scroll to the to ...

What is the best way to navigate to a particular property within my jQuery library?

Hey everyone, I need some help with my ASP.net MVC application. I have this code in my Jquery custom library for plotting a chart and now I want to update a specific value using an ajax call. Take a look at the code snippet below: Code from Jquery custom ...