Search...
FAQs
Subscribe
Pie
FAQs
Recent topics
Flagged topics
Hot topics
Best topics
Search...
Search within HTML Pages with CSS and JavaScript
Search Coderanch
Advance search
Google search
Register / Login
Win a copy of
Experimentation for Engineers: From A/B testing to Bayesian optimization
this week in the
Design
forum!
Post Reply
Bookmark Topic
Watch Topic
New Topic
programming forums
Java
Mobile
Certification
Databases
Caching
Books
Engineering
Micro Controllers
OS
Languages
Paradigms
IDEs
Build Tools
Frameworks
Application Servers
Open Source
This Site
Careers
Other
Pie Elite
all forums
this forum made possible by our volunteer staff, including ...
Marshals:
Campbell Ritchie
Ron McLeod
Tim Cooke
Paul Clapham
Liutauras Vilda
Sheriffs:
Junilu Lacar
Rob Spoor
Jeanne Boyarsky
Saloon Keepers:
Stephan van Hulst
Carey Brown
Tim Holloway
Piet Souris
Bartenders:
Forum:
HTML Pages with CSS and JavaScript
store the information that the user inputs
blacci boy
Greenhorn
Posts: 2
posted 2 years ago
Number of slices to send:
Optional 'thank-you' note:
Send
let artistV=[]; function myPage() { // body... let htmlSelect = document.getElementById("artistList"); htmlSelect.style.visibility = "hidden"; if (sessionStorage.getItem("hasCodeRunBefore") ===null) { sessionStorage.setItem("artists",JSON.stringify(artistV)); sessionStorage.setItem("hasCodeRunBefore",true); } else { artistV=JSON.parse(sessionStorage.getItem("artists")); let i =0; artistV.forEach(function(art){ let listItems=document.createElements("li"); listItems.innerHTML=art.name.artist; listItems.value=i; i=i+1; htmlSelect.appendChild(listItems); }); if (i>0) { htmlSelect.style.visibility="visible"; } } } function Artist(name,title,genre,album) { // body... this.name=name; this.title=title; this.genre=genre; this.album=album; } function submit() { // body... artistV=JSON.parse(sessionStorage.getItem("artists")); let newArtist=new Artist( document.getElementById("name").value, document.getElementById("title").value, document.getElementById("genre").value, document.getElementById("album").value, ); artistV.push(newArtist); sessionStorage.setItem("artists",JSON.stringify(artistV)); } function userInput(artistInfo) { // body... artistV[artistInfo].bio=function(){ alert( this.name+"Title is"+ this.title+"Genre is"+ this.genre+"Album is" this.album+"." ); }; artistV[artistInfo].bio(); }
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
<!DOCTYPE html> <html> <head> <title>Music</title> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous"> <script type="text/javascript" src="music.js"></script> </head> <body onload="myPage()"> <h1>Artist information</h1> <br> <form> <label>Artist name</label><input type="text" id="name"> <label>Title</label><input type="text" id="title"> <label>Genre</label><input type="text" id="genre"> <label>Album</label><input type="text" id="album"> <button id="btn" onclick="submit()">Submit</button> </form> <ul id="artistList" > </ul> </body> </html>
Zachary Griggs
Bartender
Posts: 242
27
posted 2 years ago
Number of slices to send:
Optional 'thank-you' note:
Send
What is the desired behavior, and what is actually happening?
blacci boy
Greenhorn
Posts: 2
posted 2 years ago
Number of slices to send:
Optional 'thank-you' note:
Send
Zachary Griggs wrote:
What is the desired behavior, and what is actually happening?
i want the user to be able to add information on the webpage and currently its not working
Please do not shoot the fish in this barrel. But you can shoot at this tiny ad:
The Low Tech Laboratory Movie Kickstarter is LIVE NOW!
https://www.kickstarter.com/projects/paulwheaton/low-tech
reply
reply
Bookmark Topic
Watch Topic
New Topic
Boost this thread!
Similar Threads
jsp
addEventListener invoking on loading page and not on button click
Tomcat auth-method = form with 3 login fields.
Converting an XML document to HTML using Javascript and HTML
Struts 2 Validator Question
More...