javascript not working on mozilla firefox

Question

0.00/5 (No votes)

See more:

I am using following code and it is working in internet explorer but not in mozilla firefox.

CSS

<style type="text/css">
    .abc
    {
        display:block;
    }
    .xyz
    {

        display:none;
    }

MSIL

</style>
    <script type="text/javascript" language="javascript">
    function show1(id)
    {
//
//    var e=document.getElementById('d1');
//    if(e)
//    {
//
    if(d1.style.display!='block')
    {
    d1.style.display='block';
    d2.style.display='none';
    d3.style.display='none';
    d4.style.display='none';
    }
    else
    {
    d1.style.display='none';
    }
    }
    //}
    function show2(id)
    {
    if(d2.style.display!='block')
    {
    d2.style.display='block';
    d1.style.display='none';
    d3.style.display='none';
    d4.style.display='none';
    }
    else
    {
    d2.style.display='none';
    }
    }

    function show3(id)
    {
    if(d3.style.display!='block')
    {
    d3.style.display='block';
    d1.style.display='none';
    d2.style.display='none';
    d4.style.display='none';
    }
    else
    {
    d3.style.display='none';
    }
    }

    function show4(id)
    {
    if(d4.style.display!='block')
    {
    d4.style.display='block';
    d1.style.display='none';
    d3.style.display='none';
    d2.style.display='none';
    }
    else
    {
    d4.style.display='none';
    }
    }
    </script>

<body
<form id="form1"  runat="server">
<div></div>

XML

<div id='h1' class="abc" onclick="show1('d1')" >
                     <a href="#" style="font-size: x-large; text-decoration: none; color: #9900CC;">Customers</a>
           </div>
           <div id='d1' class="xyz"
           <a href="Customers.aspx?action=mod" class="style5"  >View Customers</a><br />
           <a href="Customers.aspx?action=sav" class="style5"
                   >Add Customer</a>
           </div><br />

           <div id='h2' class="abc" onclick="show2('d2')" >
           <a href="#" style="font-size: x-large; text-decoration: none; color: #9900CC;">Engineers</a>
           </div>
           <div id='d2' class="xyz" >
           <a href="Engineer.aspx?action=mod" class="style5" >View Engineers</a><br />
           <a href="Engineer.aspx?action=sav" class="style5">Add Engineer</a>
           </div><br />

          <div id='h3' class="abc" onclick="show3('d3')" >

                  <a href="#" style="font-size: x-large; text-decoration: none; color: #9900CC;">Location</a>
                  </div>

           <div id='d3' class="xyz" >
           <a href="Country.aspx" class="style5" >Country</a><br />
           <a href="State.aspx" class="style5">State</a><br />
           <a href="City.aspx" class="style5">City</a>
           </div> <br />


           <div id='h4' class="abc" onclick="show4('d4')" >

                  <a href="#" style="font-size: x-large; text-decoration: none; color: #9900CC;">Licence</a>
                   </div>

           <div id='d4' class="xyz" >
           <a href="License.aspx?action=mod" class="style5" >View Licences</a><br />
           <a href="License.aspx?action=sav" class="style5">Add Licence</a>
           </div>
</form>
</body>

Posted 21-Oct-10 20:39pm

Rohit from Delhi

Updated 21-Oct-10 21:32pm

Dalek Dave

Add a Solution

Comments

Dalek Dave 22-Oct-10 3:32am

Minor Edit for Grammar.

2 solutions

Solution 1

Hi,
I have a example pls try to understand it and use it in your code
this is for validating only numbers ie it takes only numbers when you press the keys

C#

function browsercompatbility() {

    if (browserName == "Netscape") {
        document.onkeydown = keyDown;
        document.captureEvents(Event.KEYDOWN);
        eventkey = keycode;
    }
    else {
        key = parseInt(event.keyCode);
        eventkey = key;
    }
}

function validatenumbers() {

    browsercompatbility();
    if ((parseInt(eventkey) >= 47) && (parseInt(eventkey) <= 57)) {
        return true;
    }
    else { eventkey = 0; return false; }
    return true;
}

Posted 21-Oct-10 20:48pm

bgadarsh

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)

shakil0304003 · Accepted Answer · 2010-10-21T21:48:00

Solution 2

Use document.getElementById for get d1,d2,d3,d4.
You used 4 functions but all are quit same. It is also bad practice.
Try some thing like this

function show1(id)
    {
    if(document.getElementById(id).style.display!='block')
    {
    document.getElementById("d1").style.display='none';
    document.getElementById("d2").style.display='none';
    document.getElementById("d3").style.display='none';
    document.getElementById("d4").style.display='none';    
    document.getElementById(id).style.display='block';
    }
    else
    {
    document.getElementById(id).style.display='none';
    }
    }

Posted 21-Oct-10 21:48pm

shakil0304003

Updated 21-Oct-10 22:57pm

v2

Comments

Rohit from Delhi 22-Oct-10 4:05am

i tried to use this code but it is giving exception

Microsoft JScript runtime error: Object required

Rohit from Delhi 22-Oct-10 4:09am

it is giving error

Microsoft JScript runtime error: 'style.display' is null or not an object

Rohit from Delhi 22-Oct-10 4:13am

it was ok.
i modified it as

function show1(id) {

if (document.getElementById(id).style.display != 'block') {
document.getElementById("d1").style.display = 'none';
document.getElementById("d2").style.display = 'none';
document.getElementById("d3").style.display = 'none';
document.getElementById("d4").style.display = 'none';
document.getElementById(id).style.display = 'block';
}
else {
document.getElementById(id).style.display = 'none';
}
}

thanks

shakil0304003 22-Oct-10 4:55am

sorry, for my fault in my code, it occur because i wrote it in textbox, did not write it in a file & did not test it :(