All TalkersCode Topics

Follow TalkersCode On Social Media

devloprr.com - A Social Media Network for developers Join Now ➔

Prompt Box In JavaScript

Last Updated : Mar 11, 2024

Prompt Box In JavaScript

In this article we will show you the solution of prompt box in JavaScript, the purpose of an alert box is to make sure the user is aware of important information.

An alert box must be clicked "OK" by the user in order to move forward.

The prompt box is often used for requesting information from the user before entering a page.

Input values will be translated into a prompt box. After clicking "OK" or "Cancel", the user will be able to proceed.

Upon clicking "OK," the box displays the value entered by the user. Users who click "Cancel" will receive null as a result.

A prompt() return value is returned if the user clicks "OK" otherwise a null value is returned.

To proceed, we must click "OK" or "Cancel" when the prompt box appears.

Users can enter text into a single-line textbox, cancel the dialog, and click the OK button to return the (possibly empty) text entered.

Step By Step Guide On Prompt Box In JavaScript :-

<!DOCTYPE html>
<html>
<body>
   <p id="msg"></p>
   <button onclick="myFunction()">Click to Enter Name</button>
   <script>
      function myFunction() {
         let txt;
         let x = prompt("Enter Your Name: ");
         if(x==null || x=="") {
            txt = "You've not entered you name!";
         }
         else {
            txt = "Welcome " + x;
         }
         document.getElementById("msg").innerHTML = txt;
      }
   </script>
</body>
</html>
  1. We begin by writing <HTML>, which tells the browser what HTML version we're using. Tags are the beginning of an HTML document.
  2. This is followed by the <body> tag, which defines the webpage's content. Writing all the content for the website takes place here.
  3. The P id is created first before a message can be created.
  4. A click event is detected using the onclick directive, and up and down arrows are added using the ng-class directive. The ng-click and ng-class directives contain functions that take the key name as a parameter.
  5. Then we added an HTML page with a <script> tag. The script tag explains the source code we used for the JavaScript google API run and the file we used that or the code.
  6. Our functions were then created by adding some if-else statements.
  7. After that </script></body></html> and code should be executed after closing all tags.

Conclusion :-

When the prompt() method is invoked in JavaScript, a prompt box is displayed that prompts the user to enter their input.

This form is commonly used before entering a page to collect user input. The prefix window need not be used.

I hope this article on prompt box in JavaScript helps you and the steps and method mentioned above are easy to follow and implement.

Author Image About Riya

A recent graduate with a Bachelor of Technology (B.Tech) in Computer Science from India. She is passionate about leveraging technology to solve real-world problems. With a strong foundation and experience in programming languages such as Python, Django, HTML, CSS, and JavaScript, java, php and have honed her skills through hands-on projects and coursework.

Follow Riya On Linkedin 🡪