SitePoint Sponsor

User Tag List

Results 1 to 6 of 6

Hybrid View

  1. #1
    SitePoint Enthusiast
    Join Date
    Nov 2011
    Posts
    46
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    My code does not work in Internet Explorer but works on all other major browsers

    I have a function which allows the number of buttons selected depending on the number selected from the drop down menu. Problem is that this code works in all of the major browsers except for Internet Explorer (No Suprise). For example if user chose the number 3 from the dropdown menu, then user can only select 3 buttons.

    Why is it not working in Internet explorer and what can be used to make it work in Internet Explorer?

    Below is javascript functions:
    Code:
    function getButtons()
    {
    	document.getElementById("answerA").class="answerBtnsOff";
    	document.getElementById("answerA").setAttribute("class","answerBtnsOff");
    	document.getElementById("answerA").setAttribute("className","answerBtnsOff");
     
    	document.getElementById("answerB").class="answerBtnsOff";
    	document.getElementById("answerB").setAttribute("class","answerBtnsOff");
    	document.getElementById("answerB").setAttribute("className","answerBtnsOff");
     
    	document.getElementById("answerC").class="answerBtnsOff";
    	document.getElementById("answerC").setAttribute("class","answerBtnsOff");
    	document.getElementById("answerC").setAttribute("className","answerBtnsOff");
     
    	document.getElementById("answerD").class="answerBtnsOff";
    	document.getElementById("answerD").setAttribute("class","answerBtnsOff");
    	document.getElementById("answerD").setAttribute("className","answerBtnsOff");
     
    	document.getElementById("answerE").class="answerBtnsOff";
    	document.getElementById("answerE").setAttribute("class","answerBtnsOff");
    	document.getElementById("answerE").setAttribute("className","answerBtnsOff");
     
    	currenttotal=0;
    }
    function btnclick(btn)
    {
     	if(document.getElementById("numberDropId").value=="")
     	{
    	 	alert('You must first select the number of answers you require from the drop down menu');
    	 	return false;
    	}
    	if (btn.class=="answerBtnsOn")
    	{
    		btn.class="answerBtnsOff";
    		btn.setAttribute("class","answerBtnsOff");
    		btn.setAttribute("className","answerBtnsOff");
     
    		currenttotal--;
    		return false;
    	}
     	if(document.getElementById("numberDropId").value==currenttotal)
     	{
     	 	alert('You are not allowed beyond the limit of the number of answers you require, deselect other button');
     		return false;
     	}
    	if (btn.class=="answerBtnsOff")
    	{
    		btn.class="answerBtnsOn";
    		btn.setAttribute("class","answerBtnsOn");
    		btn.setAttribute("className","answerBtnsOn");
    		currenttotal++;
    		return false;
    	}
     
    }
    If you html code then this is below:

    Code:
    <form id="enter" action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>" method="post" onsubmit="return validateForm(this);" >
    <table id="middleDetails" border="1">
    <tr>
        <td>Question:</td> 
        <td rowspan="3">
            <textarea rows="5" cols="40" name="questionText"></textarea>
        </td>
        <td>Option Type:</td> 
        <td>
            <select name="optionDrop" onClick="getDropDown()">
    <option value="">Please Select</option>
    <option value="abc">ABC</option>
    <option value="abcd">ABCD</option>
    <option value="abcde">ABCDE</option>
    <option value="trueorfalse">True or False</option>
    <option value="yesorno">Yes or No</option>
    </select>
        </td>
    <tr>
    <td colspan="2"></td>
    <td>Number of Answers:</td>
    <td>
    <span id="na">N/A</span>
    <select name="numberDrop" id="numberDropId" onChange="getButtons()">
    <option value=""></option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    </select>
    </td>
    </tr>
    </table>
    </form>

  2. #2
    SitePoint Zealot
    Join Date
    Jan 2011
    Location
    Portland
    Posts
    148
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well there could be quite a few reason's this could not work but the 2 that pop to my head is some doc types don't work well in IE..So make sure you have the latest doc type heading.

    Also make sure you that your IE allows javascript

  3. #3
    Under Construction silver trophybronze trophy AussieJohn's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    776
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    setAttribute can be a little buggy in IE. (http://reference.sitepoint.com/javas...t/setAttribute)

    Do you perhaps have a test page to look at so we can see all the JS/HTML involved?
    var details = {
    . . web: "afterlight.com.au",
    . . photos: "jvdl.id.au",
    . . psa: "usethelatestversion.com"
    }

  4. #4
    Non-Member
    Join Date
    Apr 2011
    Location
    no fixed address
    Posts
    851
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    setAttribute normally works fine for me.

    But look in your browser's error console. The error console in my IE9 tells me exactly what your error is.

    And I get the same error in my FF8 error console.

    Another way to find your errors is to place alert() statements in your code to check values of variables and if parts of your code are reached. A couple of alert()'s in your code should quickly tell you where your problem is.


    Edit:


    oh and btw, you have a validation error in your html as well.

  5. #5
    SitePoint Enthusiast
    Join Date
    Nov 2011
    Posts
    46
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    http://jsfiddle.net/a4Def/9/

    This shows my code. The dropdows do not do its functions in jsfiddle but if you copy code to you html page then it should work.

  6. #6
    Non-Member
    Join Date
    Apr 2011
    Location
    no fixed address
    Posts
    851
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Post the error messages you're getting.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •