-4

I have an assigment, I don't understand it as i'm beginner.

Create a javascript script which will modify the DOM of a web-page. The script must add a form with 4 elements: name, email, message(textarea) and submit button. Each element must contain a label with its name. For example, name field is input type, you must create still from javascript a label named "Name", same for the others except submit button. Also, each laber must have a colour added from javascript(red, blue, yellow). When you click submit button, it must have an alert: "Are you sure you want to send this message?".

Thank you in advance.

3
  • show your code here Commented Mar 8, 2019 at 16:20
  • Possible duplicate of creating and submitting a form with javascript Commented Mar 8, 2019 at 16:22
  • 2
    I'm pretty sure that you are not understanding the requirements of your assignment. forms, textarea and even submit are all HTML. Perhaps you need JavaScript to create the form, but you still need some HTML, if nothing else to create the blank page. If you need to create the form using JavaScript then look at developer.mozilla.org/en-US/docs/Web/API/Document/createElement Commented Mar 8, 2019 at 16:24

1 Answer 1

0

I need to use only Javascript for this and I can only find answers that use HTML

Web applications use HTML to contain, render and display elements in the viewport (browser window).

Where do you intend to render the form and capture user input?

You can build the DOM structure using JavaScript alone, however, there will still be a HTML file, which will contain the HTML elements created using javascript.

Please provide clarity as to your desired goal and what type of application this is being used for.

My gut feeling, for simplicity, is that you will require to use HTML as your template file, and JavaScript for interactivity and manipulation of the HTML file.

The script must add a form with 4 elements: name, email, message(textarea) and submit button. Each element must contain a label with its name. For example, name field is input type, you must create still from javascript a label named "Name", same for the others except submit button. Also, each laber must have a colour added from javascript(red, blue, yellow). When you click submit button, it must have an alert: "Are you sure you want to send this message?". That's it.

This is a start, just to try to help you to understand the concepts.

I do, however, implore you to go and explore with confidence - you won't break anything, just give it a try!

I recommend you try taking a look at some of these articles, have a look at my (very rudimentary) code below, and feel free to ask any questions you have!

JS:- W3 Schools JS and HTML reference

HTML:- W3 Schools: HTML Forms W3 Schools: Label Tag W3 Schools: Text Area Tag (This has been left out of the solution on purpose - give it a try!!)

(function divContent() {
//Create a 'div' as a container for our form
var div = document.createElement('div');
// Perhaps you could style it later using this class?? 
div.className = 'row';
// I have used backticks to contain some more normal looking HTML for you to review, it's not complete though!!
div.innerHTML = `<form action="javascript:" onsubmit="alert('Your message here, or, run a function from your JavaScript file and do more stuff!!')">
  <label for="name">Name:</label>
  <input type="text" name="name" id="name" value="Mickey Mouse">
  <br>
  <label for="email">Email:</label>
  <input type="text" name="email" id="email" value="[email protected]">
  <br><br>
  <input type="submit" value="Submit">
</form> `
// Get the body of the document, and append our div containing the form to display it on page
document.getElementsByTagName('body')[0].appendChild(div);
}());
<!DOCTYPE html>
<html>

	<head>
		
		<meta name="author" content="CoderYen | Wrangling with 0s & 1s Since The Eighties">
		
	</head>

	<body>

	</body>

</html>

Sign up to request clarification or add additional context in comments.

3 Comments

I really don't understand either, I'm confused.. I will try to translate in english the assigment. It's basic stuff but I don't know I don't get it. Create a javascript script which will modify the DOM of a web-page.
The script must add a form with 4 elements: name, email, message(textarea) and submit button. Each element must contain a label with its name. For example, name field is input type, you must create still from javascript a label named "Name", same for the others except submit button. Also, each laber must have a colour added from javascript(red, blue, yellow). When you click submit button, it must have an alert: "Are you sure you want to send this message?". That's it.
Alexandru Salitrarovici - I implore you to go and explore, I've updated the response and will be happy to help give you a gentle steer where I can. Developing is a marathon, not a sprint - there are so many principles I cannot convey in a short focused response in this post. It's for that reason the question could be deemed a little too broad and vague, however, this is a community built to encourage the free sharing of learning and expression of technical expertise/exploration of these areas - at all levels! Wishing you all the best - happy learning :)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.