Sponsored Content
Top Forums Web Development Web development learning thread(Javascript, HTML, CSS, angular, vue.js). Post 303033979 by RavinderSingh13 on Monday 15th of April 2019 02:29:35 PM
Old 04-15-2019
Hello All,

I learnt today, how to create a button in HTML, how to present OK or CANCEL button for user and after user's selection how to print date and time on screen.

Here is simple HTML file:
Code:
<html>
    <head>
        <title>Get date and time once more....</title>
        <meta http-equiv="content-type" content="text/html;charset=utf-8">
        <script type="text/javascript" src="print_date.js"></script>
    </head>
    <body>
        <button onclick="gettime()">Get date and time</button>
        <p id="get_date"></p>
    </body>
</html>

Here is the respective JS file:
Code:
function gettime () {
    var txt;
    if(confirm("Press a button")){
        var nDate = Date();
        var dDate = nDate.toLocaleString();
        txt = dDate;
    }
    else {
        txt = "Sorry !! since you pressed CANCEL, so no date and time printing here :)"
    }
    document.getElementById("get_date").innerHTML = txt;
}


What code does:

1- HTML code mentions JS file named print_date.js in it in <script> TAG.
2- It also has a button with button tag, with is value(what it will be shown in text form on button and its id(how we will call it in further program)).
3- We have a <p id=get_date>..</p in our code for paragraph too.
4- Button has something called gettime() function which is called whenever a click happens on button by mentioning onclick="gettime"
5- Now comes JS part, we have a function in JS named "gettime" which will help us to present pop up window for user.
6- confirm("Press a button") condition shows a pop up with OK and CANCEL options in front of client/user.
7- If condition is TRUE when a user hits OK and will create date object's variable and save my locale machine's date and time in txt variable.
8- Else condition, means when user selected CANCEL option then assigning txt variable value as an error.
9- Now finally using document.getElementById("get_date").inneHTML toassign value of txt variable to p tag in HTML file.
10- Now HIT http://localhost:5000/my_html.html link in browser.

I am very tired and almost sleeping so will add screen shots of this too tomorrow,see ya.
Will try to add more small small learning here.


Thanks,
R. Singh
 

7 More Discussions You Might Find Interesting

1. Web Development

Help with passing HTML values in to JavaScript

Not sure if this is the right place to ask this but here goes. I am creating a cheat sheet for co-workers. The concept is that you pick wire size and conduit size and the amount of wires that will fit is displayed. I haven't used alot of drop downs and can't quite figure out the way the get id... (3 Replies)
Discussion started by: zero3ree
3 Replies

2. Shell Programming and Scripting

Javascript or HTML to retrieve apache username

I have a internal wesbite set up and any visitor must enter username / passwd as defined in apache (I've set these up using htpasswd) I use cgi scripts set up using ksh or javascript to populate pages / tables etc. I want to be able to get the apache username that the used authorised... (3 Replies)
Discussion started by: frustrated1
3 Replies

3. Web Development

Learning HTML

I have tried to create a web page browser window. An example, I copied what the book pretty much wanted but get only the header. What should I change? Also Anyone know any good books for this? Many thanks. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Translation/EN" ... (4 Replies)
Discussion started by: N-Training
4 Replies

4. Programming

Looking For the Best Way to Rotate an Image: JavaScript, PHP, HTML etc

Hey All, What I'm looking for is a way to rotate an image by non 90 degree angles (ie 90, 180, 270, 360). I am able to do it in PHP, but there are errors in the image, some pixels end up colored incorrectly and the image ends up resized and I lose transparency. I've done my share of searching on... (1 Reply)
Discussion started by: pmd006
1 Replies

5. Web Development

HTML down, CSS help, ahhhh

I am having some problems. I have been able to learn HTML, but when I try and encode CSS, nothing happens, what is the major issue here. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>MY CSS</title> <style... (7 Replies)
Discussion started by: N-Training
7 Replies

6. Web Development

Simple Vue.js Component to Redirect to External Web Page Using Vue Router

Vue Router has some quirks and on of the quirks is that it is not reliable when adding external links using the vue-router library. After struggling with many solutions, I have found that creating a simple Vue.js component like this one seems to work the best (so far): Component Example: ... (0 Replies)
Discussion started by: Neo
0 Replies

7. Web Development

Google Trends: react.js angular.js vue.js

While I'm on the subject of Google trends, here is a global trend since 2004 comparing react.js, angular.js, vue.js It's no secret I'm a vue.js fan and coder, but not because of the trend line (which I just saw for the first time a few minutes ago) My experience is that vue.js, a late arrival... (0 Replies)
Discussion started by: Neo
0 Replies
All times are GMT -4. The time now is 07:24 AM.
Unix & Linux Forums Content Copyright 1993-2022. All Rights Reserved.
Privacy Policy