3. Demonstrate pop-up box alerts, confirm, and prompt using JavaScript.

PHOTO

Thu Oct 31 2024 15:22:48 GMT+0000 (Coordinated Universal Time)

popUpDemo.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JavaScript Pop-Up Boxes</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
            margin-top: 50px;
        }

        button {
            padding: 10px 15px;
            font-size: 16px;
            margin: 10px;
        }
    </style>
</head>
<body>

    <h1>JavaScript Pop-Up Box Demonstration</h1>
    <button onclick="showAlert()">Show Alert</button>
    <button onclick="showConfirm()">Show Confirm</button>
    <button onclick="showPrompt()">Show Prompt</button>

    <script>
        function showAlert() {
            alert("This is an alert box!");
        }

        function showConfirm() {
            const result = confirm("Do you want to proceed?");
            if (result) {
                alert("You clicked OK!");
            } else {
                alert("You clicked Cancel!");
            }
        }

        function showPrompt() {
            const name = prompt("Please enter your name:");
            if (name) {
                alert("Hello, " + name + "!");
            } else {
                alert("No name entered.");
            }
        }
    </script>

</body>
</html>

COPY

Save snippets that work from anywhere online with our extensions

Comments

WT-LAB

@varuntej

1. Create a web page using the advanced features of CSS Grid. Apply transitions and animations to the contents of the web page. 2. Create a web page using the advanced features of CSS Flexbox. Apply transitions and animations to the contents of the web page. 3. Demonstrate pop-up box alerts, confirm, and prompt using JavaScript. 4. Demonstrate Responsive Web Design using Media Queries to create a webpage. 5. Write a JavaScript program to demonstrate the working of callbacks, promises, and async/await. 6. Write an XML file that displays book information with the following fields: Title of the book, Author Name, ISBN number, Publisher name, Edition, and Price. Define a Document Type Definition (DTD) to validate the XML document created above. 7. Write an XML file that displays book information with the following fields: Title of the book, Author Name, ISBN number, Publisher name, Edition, and Price. Define an XML schema to validate the XML document created above. 8. Write a Java application to validate the XML document using the DOM parser. 14. Write a java program to establish connection to a database and execute simple SQL queries. 10. Write a Java program to access the metadata of an SQL database. 15. Write a java program to demonstrate the usage of JDBC in performing various DML statements. Use Prepared statements Demonstrate Servlet Lifecyle by implementing Servlet Interface. Demonstrate Creation of Servlet program using Http Servlet class. 11.Scientific Calculator 9. Write a Java application to validate the XML document using the SAX parser. 16. Write a java based application to demonstrate the Scrollable Result sets. 12. Demonstrate Servlet Lifecyle by implementing Servlet Interface. 13. Demonstrate Creation of Servlet program using Http Servlet class. 17. Write a program to accept request parameters from a form and generate the response.

#html #javascript #nodejs

How to Save HTML Form Data in JSON - Express

<form action="/new" method="post">
 
  <input name="title" type="text">
  <input name="description" type="text">
  <button type="submit">Submit Form</button>
 
</form>

> More steps

#javascript

Get URL and URL Parts in JavaScript

var newURL = window.location.protocol + "//" + window.location.host + "/" + window.location.pathname + window.location.search

#javascript

Add event listener to multiple buttons with the same class

    btns = document.getElementsByClassName("saveBtn");
    for (var i = 0; i < btns.length; i++) {
        btns[i].addEventListener("click", function () {
			//Add function here
        });
    }

#javascript

Replace Textarea with Codemirror editor

<link rel="stylesheet" type="text/css" href="plugin/codemirror/lib/codemirror.css">

<body>
	<textarea class="codemirror-textarea"></textarea>
</body>

<script>

$(document).ready(function(){
    var codeText = $(".codemirror-textarea")[0];
    var editor = CodeMirror.fromTextArea(codeText, {
        lineNumbers : true
    });
});

</script>

<script type="text/javascript" src="plugin/codemirror/lib/codemirror.js"></script>

#javascript #nodejs #commandline

HTTPS Redirect in Nodejs

npm install heroku-ssl-redirect

> More steps

#javascript #nodejs

Save to MongoDB without Duplicates Using Mongoose

var mongoose = require('mongoose');
var Schema = mongoose.Schema;

const exampleSchema = new Schema({
    title: { type: String , required: true},
    content: [{type: String}]
});


var Example = mongoose.model('Example', exampleSchema);
module.exports = Example;

> More steps

#html #javascript #jsfunctions #dom #dommanipulation

getAttribute() - how to get the value of any attribute of HTML element

<html>

<input id="contact" name="address">

<script>

    var x = document.getElementById("contact").getAttribute('name');

</script>

</html>

#javascript

Full Stack Developer

function full_stack_developer() {
    full_stack_developer();
}

#javascript #javascript #functions #parameters

Required Parameters for Functions in JavaScript

 const isRequired = () => { throw new Error('param is required'); };

const hello = (name = isRequired()) => { console.log(`hello ${name}`) };

// These will throw errors
hello();
hello(undefined);

// These will not
hello(null);
hello('David');
The idea here is that it uses default parameters, like how the b parameter here has a default if you don’t send it anything:
function multiply(a, b = 1) {
  return a * b;
}

#javascript

3 Ways To Detect Selenium Bots Using Javascript - CodingTutz

if (navigator.webdriver) {
    document.body.innerHTML = "This is a Bot";
}

#html #jquery #css #navbar

Underline active navbar link

// in css:
/* Display line under clicked navbar link */
.active {
  text-decoration-line: underline !important;
  text-decoration-thickness: 2px !important;
  color: rgb(20, 19, 19);
}

//in html: 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

    <script>
      $(document).ready(function () {
        // Underline to remain in navbar after click using URL
        jQuery(function ($) {
          var path = window.location.href; // because the 'href' property of the DOM element is the absolute path
          $('.nav-link').each(function () {
            if (this.href === path) {
              $(this).addClass('active');
            }
          });
        });
      });
    </script>

//Note class in link should be nav-link

#javascript

Copy Text to Clipboard with Line Breaks

function copyToClipboard(){

    var codeToBeCopied = document.getElementById('code-snippet').innerText;
    var emptyArea = document.createElement('TEXTAREA');
    emptyArea.innerHTML = codeToBeCopied;
    const parentElement = document.getElementById('post-title');
    parentElement.appendChild(emptyArea);

    emptyArea.select();
    document.execCommand('copy');

    parentElement.removeChild(emptyArea);
    M.toast({html: 'Code copied to clipboard'})

    }

#javascript #promises #howto

How to Get the Domain From A URL Using Javascript

var url = "http://scratch99.com/web-development/javascript/";
var urlParts = url.replace('http://','').replace('https://','').split(/[/?#]/);
var domain = urlParts[0];

#javascript

Mapping an Object

const object1 = {
  a: 'somestring',
  b: 42
};

for (let [key, value] of Object.entries(object1)) {
  console.log(`${key}: ${value}`);
}

#javascript #jquery

jQuery.post() - AJAX for post requests

$.ajax({
  type: "POST",
  url: url,
  data: data,
  success: success,
  dataType: dataType
});

3. Demonstrate pop-up box alerts, confirm, and prompt using JavaScript.

Save snippets that work from anywhere online with our extensions

Comments

More like this

WT-LAB

Browse more snippets >>

3. Demonstrate pop-up box alerts, confirm, and prompt using JavaScript.

Save snippets that work from anywhere online with our extensions

Comments

More like this

WT-LAB

Browse more snippets >>

Embed code snippet