Support us .Net Basics C# SQL ASP.NET ADO.NET MVC Slides C# Programs Subscribe Buy DVD

Disadvantages of JavaScript

Suggested Videos
Part 1 - What is the use of JavaScript in ASP.NET
Part 2 - Why do we need both client side and server side validation



In this video we will discuss the disadvantages or downsides of using JavaScript



There are two main disadvantages of JavaScript. 

Security : JavaScript runs on the client machine. So a malicious user may use Javascript to do a variety of things like tracking your browsing history, stealing passwords etc. This is one of the main reasons why people disable JavaScript.

Browser Compatibility : Not all browsers treat the same piece of JavaScript in the same manner. This means the functionality and the user interface may vary from browser to browser. That is why cross-browser testing is very important. However, with JavaScript libraries like jQuery Browser Compatibility is no longer a major issue.

JavaScript Browser Compatibility Examples

Example 1 : innerText property is supported in IE & Chrome, but not in Firefox. This means the ValidatForm() JavaScript function that we worked with in Part 1, will only work in IE & Chrome but not in Firefox.

function ValidatForm()
{
    var ret = true;
    if (document.getElementById("txtFirstName").value == "")
    {
        document.getElementById("lblFirstName").innerText = "First Name is required";
        ret = false;
    }
    else {
        document.getElementById("lblFirstName").innerText = "";
    }

    if (document.getElementById("txtLastName").value == "")
    {
        document.getElementById("lblLastName").innerText = "Last Name is required";
        ret = false;
    }
    else
    {
        document.getElementById("lblLastName").innerText = "";
    }

    if (document.getElementById("txtEmail").value == "")
    {
        document.getElementById("lblEmail").innerText = "Email is required";
        ret = false;
    }
    else
    {
        document.getElementById("lblEmail").innerText = "";
    }

    return ret;
}

For the above JavaScript function to work in all the browsers that is in IE, Chrome & Firefox, replace innerText property with textContent as shown below.

function ValidatForm() {
    var ret = true;
    if (document.getElementById("txtFirstName").value == "")
    {
        document.getElementById("lblFirstName").textContent = "First Name is required";
        ret = false;
    }
    else
    {
        document.getElementById("lblFirstName").textContent = "";
    }

    if (document.getElementById("txtLastName").value == "")
    {
        document.getElementById("lblLastName").textContent = "Last Name is required";
        ret = false;
    }
    else
    {
        document.getElementById("lblLastName").textContent = "";
    }

    if (document.getElementById("txtEmail").value == "")
    {
        document.getElementById("lblEmail").textContent = "Email is required";
        ret = false;
    }
    else
    {
        document.getElementById("lblEmail").textContent = "";
    }

    return ret;
}

Example 2 : The following JavaScript function ddlGenderSelectionChanged() works in Chrome and Firefox but not in Internet Explorer.

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
    <script type="text/javascript" language="javascript">
        function ddlGenderSelectionChanged() {
            alert('You selected ' + ddlGender.value);
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <select id="ddlGender" onchange="ddlGenderSelectionChanged()">
            <option>Male</option>
            <option>Female</option>
        </select>
    </div>
    </form>
</body>
</html>

For the JavaScript function to work in all browsers (Chrome, Firefox & Internet Explorer) it needs to be modified as shown below.
<script type="text/javascript" language="javascript">
    function ddlGenderSelectionChanged()
    {
        alert('You selected ' + document.getElementById('ddlGender').value);
    }
</script>

JavaScript tutorial

No comments:

Post a Comment

If you like this website, please share with your friends on facebook and Google+ and recommend us on google using the g+1 button on the top right hand corner.