Why below code correctly work in IE8 , and not work in Chrome and mozila ?

Question

0.00/5 (No votes)

See more:

ASP.NET

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="javascripttest.aspx.vb" Inherits="javascripttest" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>

       <script type="text/javascript" language="javascript">
    function AddDept_ClientClick() {

     document.getElementById("lnkAddDept").style.color = "#0064a5";
     document.getElementById("lnkAddUser").removeAttribute("style");
     document.getElementById("lnkImpADUser").removeAttribute("style");
     document.getElementById("lnkImpUserList").removeAttribute("style");
     return false;
 }


 function AddUser_ClientClick(obj) {





     document.getElementById("lnkAddDept").removeAttribute("style");
     document.getElementById("lnkAddUser").style.color = "#0064a5";
     document.getElementById("lnkImpADUser").removeAttribute("style");
     document.getElementById("lnkImpUserList").removeAttribute("style");




     return false;
 }

 function ImportADUser_ClientClick() {


     document.getElementById("lnkAddDept").style.color = "black";
     document.getElementById("lnkAddUser").style.color = "black";
     document.getElementById("lnkImpADUser").style.color = "#0064a5";
     document.getElementById("lnkImpUserList").style.color = "black";

     return false;
 }

 function ImportUser_ClientClick() {

     document.getElementById("lnkAddDept").style.color = "black";
     document.getElementById("lnkAddUser").style.color = "black";
     document.getElementById("lnkImpADUser").style.color = "black";
     document.getElementById("lnkImpUserList").style.color = "#0064a5";
   







     return false;
 }

       </script>
       <style type="text/css">
      

       .change
       {
           text-decoration:none;
               }
       
        .change:hover
        {
            color: #0064a5;
            text-decoration:underline;
          cursor :pointer ;
        }
.fontbold12 {
	font-family: Arial;
	font-size: 12px;
	font-weight: bold;
	color: black;
    }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <table width="100%" cellpadding="0" cellspacing="0">
    <tr>
        <td style="width: 84%; padding-removed 8px" class="fontbold12"> <a  runat="server" class="change"  önmousedown="return AddDept_ClientClick()" id="lnkAddDept">Add Department</a>

        </td>
    </tr>
    <tr id="tradduser"  runat="server">
        <td style="width: 84%; padding-removed 8px" class="fontbold12"> <a  runat="server"  class="change"  önclick="return AddUser_ClientClick()" id="lnkAddUser" visible="True">Add User</a>

        </td>
    </tr>
    
    <tr id="trimportaduser"  runat="server">
        <td style="width: 84%; padding-removed 8px" class="fontbold12"> <a  runat="server" class="change"  önclick="return ImportADUser_ClientClick()" id="lnkImpADUser">Import AD User</a>

        </td>
    </tr>
   
    <tr>
        <td style="width: 84%; padding-removed 8px" class="fontbold12"> <a  runat="server" class="change"  önclick="return ImportUser_ClientClick()" id="lnkImpUserList">Import User List</a>

        </td>
    </tr>
</table>
    </div>
    </form>
</body>
</html>

the above in html page

VB

Partial Class javascripttest
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
        lnkAddUser.Disabled = True
        lnkAddDept.Disabled = True
        lnkImpADUser.Disabled = False
        lnkImpUserList.Disabled = False

    End Sub
End Class

in this above i will disable first 2 hyper link and next 2 hyper link enable from server side.
if i run IE 8 ,it work correctly,but if i run in chrome and Mozilla it not work correct.
Actually my need is first 2 hyper user cant click and also page not get changes, in IE 8 user cant click and also page not get changes and this is my need.
but in chrome and Mozilla can click first 2 hyper link and also page get changes.
why in IE 8 correctly respond and chrome and Mozilla not respond ?

Posted 24-Oct-13 23:12pm

Aravindba

Updated 11-Nov-13 2:42am

v3

Add a Solution

Comments

ZurdoDev 25-Oct-13 9:55am

What does "it not work correct" mean?

Aravindba 27-Oct-13 11:38am

not work correctly means,i can click hyper link even it Disabled="true" form server side

vbmike 25-Oct-13 12:53pm

Sometimes different browser interpret things like onclick etc differently. Search for those function calls in Google and see if you can find differences.

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Sergey Alexandrovich Kryukov · Accepted Answer · 2013-10-25T08:24:00

At first glance, I cannot see any incompatible fragments of code, but they are not so easy to spot. Nevertheless, I can advise how to solve the problem.

There are some apparent problems in your code design. I mean it: this code style is unacceptable and can cause many different problems. You need to refactor the code, and, if the problem won't go (but most likely it will go), you would address further problems. So what do to?

Let's start with HTML and static styles. First of all, get rid of all style attributes, once and forever, and never come back to this bad idea. Use only class attributes, and only when you are not going to modify the style in JavaScript, or when you only want to add and remove additional class to elements in JavaScript, and those additional classes should add minor changes on top of "permanent" class. See about that below. Also, you are overusing the classes. Why do you write a class at each <td> element? This is wrong. Figure out which elements should have the same style in most cases. And then, put this style in CSS code for object "td", not "td.fontbold12" (and never use such names as "fontbold12"; the styles should be named after they purpose, not look; for example: "td.selection"). Also, don't ever use other styling attributes like "width", "cellpadding", "cellspacing"; move it all into CSS. Seriously. Don't even play with the idea of leaving it as is.

Now, about changing styles dynamically using JavaScript. Don't add or remove style attributes, and (almost) never add or remove other attributes. Instead, add and remove CSS classes. Also, you should better add all event handlers dynamically. It will help to better isolate HTML from scripts. So, we are coming to your scripting. How to do it all?

One very good way to do so is using jQuery. Rememeber, jQuery is designed with compatibility in mind. In practice, you will have to check up compatibility of features only rarely, as jQuery takes care about that.

This is how you can add/toggle styles:
http://api.jquery.com/addClass/[^],
http://api.jquery.com/removeClass/[^],
http://api.jquery.com/toggleClass/[^];
see also:
http://api.jquery.com/css/[^],
http://api.jquery.com/category/css/[^].

Events in jQuery are handled very elegantly, in a kind of in-place form, all set up in one single event when a document is ready. You will immediately see how to do it if you learn basics of jQuery (highly recommended):
http://en.wikipedia.org/wiki/JQuery[^],
http://jquery.com[^],
http://learn.jquery.com[^],
http://learn.jquery.com/using-jquery-core[^],
http://learn.jquery.com/about-jquery/how-jquery-works[^] (start from here).

Arain, remember that jQuery is designed with compatibility in mind.

—SA