
Database System Concepts
7th Edition
ISBN: 9780078022159
Author: Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan
Publisher: McGraw-Hill Education
expand_more
expand_more
format_list_bulleted
Concept explainers
Question
Need help with this in Javascript
Angular Generate Username
We provided some simple Angular template code. Your goal is to add 2 input forms in the component for first name and last name. Once both forms are filled out by the user and the "Generate" button is clicked, then next to the button a username should be automatically generated which should be in the following format: [firstname]_[lastname]_[random integer]. First name and last name should be lowercased, and then a random integer between 1 and 9 should be added to the end. For example: if the inputs are "Daniel" and "SMITH" the generated username could be "daniel_smith_4" or "daniel_smith_2".
When your application loads, the input fields should be prepopulated with the following values already:
First name = Coder
Last name = Byte
You are free to add classes and styles, but make sure you leave the element ID's as they are. Submit your code once it is complete and our system will validate your output.
When your application loads, the input fields should be prepopulated with the following values already:
First name = Coder
Last name = Byte
You are free to add classes and styles, but make sure you leave the element ID's as they are. Submit your code once it is complete and our system will validate your output.
code
// @ts-ignore
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-area',
template: '' +
'<div>' +
'<input type="text" value="firstname" id="firstname">' +
'<input type="text" value="lastname" id="lastname">' +
'<button>Generate</button>' +
'<span id="output">generated username...</span>' +
'</div>',
styles: []
})
export class MainAppComponent implements OnInit {
// code goes here
ngOnInit() {
}
}
Expert Solution

This question has been solved!
Explore an expertly crafted, step-by-step solution for a thorough understanding of key concepts.
This is a popular solution
Trending nowThis is a popular solution!
Step by stepSolved in 2 steps

Knowledge Booster
Learn more about
Need a deep-dive on the concept behind this application? Look no further. Learn more about this topic, computer-science and related others by exploring similar questions and additional content below.Similar questions
- Can you please help with this Use the provided template below BASE_YEAR = 1903 #***************************************************************# Function: main# # Description: The main function of the program## Parameters: None## Returns: Nothing ##**************************************************************def main():# Local dictionary variablesyear_dict = {}count_dict = {}developerInfo()# Open the file for readinginput_file = open('Program11.txt', 'r') # End of the main function #*********************************************## Function: # # Description: ## Parameters:## Returns: ##*****************************************def showResults(year_dict, count_dict):# Receive user inputyear = int(input('Enter a year in the range 1903-2018: ')) # Print resultsif year == 1904 or year == 1994:print("The world series wasn't played in the year", year)elif year < 1903 or year > 2018:print('The data for the year', year, \'is not included in our database.')else:winner = year_dict[year]wins…arrow_forwardBuild Brothers company in C A civil engineering company called Build Brothers has approached you to write a program to help some of their employees with getting their job quicker specially when it comes to calculating different equations in their construction projects. Currently, they use the following PDF to perform all their calculations: http://www.madison-lake.k12.oh.us/userfiles/680/Classes/16192/IED-Review%20Engineering%20Formula%20Sheet.pdf They are willing to develop a small software to calculate all the functions and calculations in the above cheat sheet. They have made this decision to reduce inherent human errors during calculation and improve efficiency. They think that these can be achieved by an “advanced calculator” that allows a user to choose an equation, provide the inputs, and calculate the outputs. Before the company invests on the final product, the have agreed on developing a proof-of-concept first. The idea is that your solution will ‘prove’ that a better…arrow_forwardNEED HELP DEBUGGING THE FOLLOW JS CODE JS CODE /* JavaScript 7th Edition Chapter 3 Project 03-05 Application to generate a horizontal bar chart Author: Date: Filename: project03-05.js*/ // Array of phone models sold by the companylet phones = ("Photon 6E", "Photon 6X", "Photon 7E", "Photon 7X", "Photon 8P"); // Units sold in the previous quarterlet sales = (10281, 12255, 25718, 21403, 16142); // Variable to calculate total saleslet totalSales = 0; // Use the forEach() method to sum the sales for each phone model and add it to the totalSales variablesales.forEach(addtoTotal); // For loop to generate bar chart of phone salesfor (let i = 1; i <= phones.length; i++) { let barChart = ""; // Variable to store HTML code for table cells used to create bar chart // Calculate the percent of total sales for a particular phone model let barPercent = 100*sales/totalSales; let cellTag; // Variable that will define the class of td…arrow_forward
- shapes = [{'type': 'circle', 'x': 300, 'y': 300, 'radius': 100, 'color': 'cyan'},{'type': 'circle', 'x': 300, 'y': 300, 'radius': 10, 'color': 'white'},{'type': 'rectangle', 'x1': 500, 'y1': 500, 'x2': 550, 'y2': 580, 'color': 'green'},{'type': 'line', 'x': 0, 'y': 0, 'a': 100, 'b': 300, 'color': "black", 'width': 7},{'type': 'point', 'x': 200, 'y': 50, 'color': 'black'},{'type': 'point', 'x': 205, 'y': 50, 'color': 'black'},{'type': 'point', 'x': 210, 'y': 50, 'color': 'black'},{'type': 'triangle', 'x': 500, 'y': 100, 'a': 600, 'b': 100, 'c': 550, 'd': 200, 'color': 'yellow'},{'type': 'oval', 'x': 100, 'y': 100, 'a': 400, 'b': 400, 'color': 'red'},{'type': 'text', 'x': 500, 'y': 50, 'message': 'hello world!', 'color': 'blue'}] I'd like to take this list and write it to a new txt file. Ignoring the ':' , {}, and words within quotation marks. so the txt file created would look like this: circle, 300,300, 100, cyancircle, 300,300, 10, whiterectangle, 500,500, 550,580, greenline, 0,0,…arrow_forward3. Which among the following shows a valid use of the Direction enumeration as a parameter to the moveCharacter function? Select al that apply. enum Direction { case north, south, west, east}func moveCharacter(x: Int, y: Int, facing: Direction) {// code here} moveCharacter(x: 0, y: 0, facing: .southwest) moveCharacter(x: 0, y: 0, facing: Direction.north) moveCharacter(x: 0, y: 0, facing: .south) moveCharacter(x: 0, y: 0, facing: Direction.northeast)arrow_forwardDescription:Create JFrame application called Dictionary.Set up three one-dimensional arrays to contain the equivalent English andother-language-of-your-choice nouns, and the images of those objects.Typing a word in one of the languages and hitting the appropriate buttonshould produce the translation and display the picture of that object. Makesure you check to see whether the word is in the dictionary. If it is not,display a message "Word is not found".Three arrays will be of equal length (array_length).The program should work for different array_length values. Test andupload for array_length = 10.Requirements: This project requires typing a word in one of the languages. So, theprogram should be interactive. The word search should be case-insensitive. Three arrays must be declared: two String arrays for words in twolanguages and the third array for pictures files names. List of words in dictionary should be displayed for user With arrays, use for or enhanced for loop. Enhanced for…arrow_forward
- JQuery loading Consider following code $(function(){ // jQuery methods go here... }); What is the purpose of this code with respect to JQuery ? O This is to prevent any jQuery code from running before the document is finished loading (is ready). O This is to load the jQuery and to run this as soon as page start before loading. This is to load the function so we can run jQuery codearrow_forwardDouble any element's value that is less than controlValue. Ex: If controlValue = 10, then dataPoints = {2, 12, 9, 20} becomes {4, 12, 18, 20}. #include <iostream>using namespace std; int main() { const int NUM_POINTS = 4; int dataPoints[NUM_POINTS]; int controlValue; int i; cin >> controlValue; for (i = 0; i < NUM_POINTS; ++i) { cin >> dataPoints[i]; } /* Your solution goes here */ for (i = 0; i < NUM_POINTS; ++i) { cout << dataPoints[i] << " " ; } cout << endl; return 0;}arrow_forward
arrow_back_ios
arrow_forward_ios
Recommended textbooks for you
- Database System ConceptsComputer ScienceISBN:9780078022159Author:Abraham Silberschatz Professor, Henry F. Korth, S. SudarshanPublisher:McGraw-Hill EducationStarting Out with Python (4th Edition)Computer ScienceISBN:9780134444321Author:Tony GaddisPublisher:PEARSONDigital Fundamentals (11th Edition)Computer ScienceISBN:9780132737968Author:Thomas L. FloydPublisher:PEARSON
- C How to Program (8th Edition)Computer ScienceISBN:9780133976892Author:Paul J. Deitel, Harvey DeitelPublisher:PEARSONDatabase Systems: Design, Implementation, & Manag...Computer ScienceISBN:9781337627900Author:Carlos Coronel, Steven MorrisPublisher:Cengage LearningProgrammable Logic ControllersComputer ScienceISBN:9780073373843Author:Frank D. PetruzellaPublisher:McGraw-Hill Education

Database System Concepts
Computer Science
ISBN:9780078022159
Author:Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan
Publisher:McGraw-Hill Education

Starting Out with Python (4th Edition)
Computer Science
ISBN:9780134444321
Author:Tony Gaddis
Publisher:PEARSON

Digital Fundamentals (11th Edition)
Computer Science
ISBN:9780132737968
Author:Thomas L. Floyd
Publisher:PEARSON

C How to Program (8th Edition)
Computer Science
ISBN:9780133976892
Author:Paul J. Deitel, Harvey Deitel
Publisher:PEARSON

Database Systems: Design, Implementation, & Manag...
Computer Science
ISBN:9781337627900
Author:Carlos Coronel, Steven Morris
Publisher:Cengage Learning

Programmable Logic Controllers
Computer Science
ISBN:9780073373843
Author:Frank D. Petruzella
Publisher:McGraw-Hill Education