Free Online Courses for Software Developers - MrBool
× Please, log in to give us a feedback. Click here to login
×

You must be logged to download. Click here to login

×

MrBool is totally free and you can help us to help the Developers Community around the world

Yes, I'd like to help the MrBool and the Developers Community before download

No, I'd like to download without make the donation

×

MrBool is totally free and you can help us to help the Developers Community around the world

Yes, I'd like to help the MrBool and the Developers Community before download

No, I'd like to download without make the donation

Learning a little more about Javascript

This article will address various javascript functions with their uses. It is recommended for those beginning with javascript. We will learn a simple validation in a form, determining browser properties on client side and making a task execute after certain interval of time by itself.

Javascript is the most essential part in any web application today.This is because it can help to perform various operation on client side itself so that the request need not move to server and your web application responds faster.It may be utilized for variety of things.The most important one is to perform validation on client side.Suppose your website contains a form having field Name which cannot be blank.Now if the client left this field as blank and submit it then without javascript this request goes to server where it is verified and then it returns the error to user.So this takes time.But if you use javascript then if user left the field blank and submit the page then request don’t go to server instead the validation is done itself on client side and user is reported error immediately.This saves a lot of time.

But always remember that you don’t use javascript to validate important fields which have direct connection to database.Like if you have set a field to not have special characters with javascript then always remember that a client can edit a webpage and remove your javascript and submit the page so that your validations will not work at all and the page will be submitted with special characters in that field.This can be very risky since this may lead to attacks like sql injection or bulk emails sending etc

Here we are going to learn following techniques:

  1. Simple validation in a form
  2. Determining browser properties on client side
  3. Making a task execute after certain interval of time by itself

First we will learn how we may validate a field in a html form

Listing 1: Validating a form

<html>
<head>
<title>csanuragjain</title>
<script type="text/javascript">
function validate()
{
if(document.getElementById("myname").value=="")
{
alert("Name can't be blank");
return false;
}
return true;
}
</script>
</head>
<body>
<form  onsubmit="validate();">
Enter your name:
<input type="text" value="" id="myname"/>
<input type="submit" value="submit" />
</form>
</body>
</html>

Here:

  1. We made a function validate which is going to validate the field in the form
  2. We use document .getElementById to obtain the that field and then use value method to obtain the value.Now we check if the value in the field is empty or not. If this is empty then we show the error message
  3. We define the body and make the form with one field which need to contain the name of person.Now we put the validate function whenever the form is submitted

Now we will learn on how we can know about the client browser in our web app.I mean when a client open your website and you need to run some script which is dependent on type and version of browser then we may use the below code.

Listing 2: Determine browser name and other details

<html>
<head>
<title>csanuragjain</title>
<script type="text/javascript">

document.write("Browser CodeName: " + navigator.appCodeName);
document.write("Browser Name: " + navigator.appName);
document.write("Browser Version: " + navigator.appVersion);
document.write("Cookies Status: " + navigator.cookieEnabled);

</script>
</head>
<body>
</body>

Here:

  1. We write the script type as javascript to tell the browser that we are going to write javascript within this tag.
  2. We use document.write to write anything on browser with help of javascript
  3. Now we determined various browser attributes using there appropriate functions. We used the navigator object and use its various attributes as shown in listing 2 above
  4. We mark the end of script by using </script> tag

Now we will learn how to execute a particular task after a certain interval again and again

Listing 3: Repeating a task after certain time interval

<html>
<head>
<title>csanuragjain</title>
<script type="text/javascript">
var interval;
var i=1;
function start()
{
interval=setInterval(function(){update()},1000);
}

function update()
{
alert(i);
i++; 
if(i==3)
stop();
}

function stop()
{
clearInterval(interval);
}
</script>
</head>
<body>
<input type=button onclick="start()" value="click to start the task"/>
</body>
</html>

Here:

  1. Here we have set two variables which are interval and i.
  2. Variable interval is holding the result for setinterval function
  3. Variable I is a counter which we are using tobe displayed on each task run
  4. We used setInterval(function(){update()},1000); to set interval.Now 1000 tells that this function will be called after 1000ms which is 1 sec.We called the function update.So here we are calling update function after every 1 second automatically.We are storing this in interval variable.
  5. We define the update function.This function first alert user with counter value.Then updates the counter value.If the counter value is 3 then we call the stop function which stops the setinterval function.Here the update function is called after every 1 second so the user is presented with value 1 and then 2
  6. Now we define the stop function which will stop the task from executing.We call the clearinterval function and pass the interval object which clears the interval and stops the task
  7. Now we define the body part.We make a button and make it call the start method when this button will be clicked

This is all for today’s article. Hope you liked the article. See you next time with something more exciting.



My main area of specialization is Java and J2EE. I have worked on many international projects like Recorders,Websites,Crawlers etc.Also i am an Oracle Certified java professional as well as DB2 certified

What did you think of this post?
Services
[Close]
To have full access to this post (or download the associated files) you must have MrBool Credits.

  See the prices for this post in Mr.Bool Credits System below:

Individually – in this case the price for this post is US$ 0,00 (Buy it now)
in this case you will buy only this video by paying the full price with no discount.

Package of 10 credits - in this case the price for this post is US$ 0,00
This subscription is ideal if you want to download few videos. In this plan you will receive a discount of 50% in each video. Subscribe for this package!

Package of 50 credits – in this case the price for this post is US$ 0,00
This subscription is ideal if you want to download several videos. In this plan you will receive a discount of 83% in each video. Subscribe for this package!


> More info about MrBool Credits
[Close]
You must be logged to download.

Click here to login