www.webdeveloper.com
Results 1 to 4 of 4

Thread: IE you are killing me ... or perhaps it is my stupidity

  1. #1
    Join Date
    Jan 2008
    Location
    Surprise, AZ
    Posts
    119

    IE you are killing me ... or perhaps it is my stupidity

    My head is hurting from hitting the wall over and over and over and ...

    (Using IE7 here ... no choice) I am trying to set the attribute of onclick for a defined href. I can run a function from the js, but cannot actually set a value. I would like the href to be built as
    Code:
    <a class="nouona" href="javascript:void(0)" id="moreCodes" onclick="addLoadEvent()">+</a>
    It seems that I can do
    Code:
    a.attachEvent('onclick', document.getElementById('moreCodes').onclick);
    but this is not setting the onclick value, it is just running the function. I would like to see the onclick value.

    Code:
    var a = document.createElement("a");
           var linkText = document.createTextNode("+");
           a.appendChild(linkText);
           a.href = "javascript:void(0)";
           a.setAttribute("id", 'moreCodes');
    	   a.setAttribute("class", 'nouona');
           col3.appendChild(a);
    As I am typing this I am realizing that I probably don't make much sense, but hopefully someone can understand what I am trying to say ... I want to set the Attribute of onClick without actually calling the function at the same time ...

  2. #2
    Join Date
    Jan 2008
    Location
    Surprise, AZ
    Posts
    119
    Perhaps seeing the whole code will make my ramblings from yesterday make sense to people that aren't already in my head:
    HTML Code:
    <html>
    <head>
    <title>test</title>
    <style>
    .nouona
    {
       text-decoration: none;
    }
    </style>
    
    <script type="text/javascript">
    function fileFields()
    {
        document.getElementById('moreCodes_1').onclick = function()
        {
    
    		if (window.event.srcElement.id == "moreCodes_1") {
    	 
           var table = document.getElementById("ecTable");
           var row   = table.insertRow(-1);
           var col1  = row.insertCell(0);
                col1.innerHTML="&nbsp;";
    
           var col2  = row.insertCell(1);
           var i = parseFloat(this.lastChild.id)+1;
    
           var select = document.createElement("select");
           select.setAttribute("name", 'eCode_a' + i);
           select.setAttribute("id", i);
    
           var option;
    
           option = document.createElement("option");
           option.setAttribute("value", "");
           option.innerHTML = "";
           select.appendChild(option);
    
           option = document.createElement("option");
           option.setAttribute("value", "00");
           option.innerHTML = "No Action (00)";
           select.appendChild(option);
    
           option = document.createElement("option");
           option.setAttribute("value", "01");
           option.innerHTML = "907 (01)";
           select.appendChild(option);
    
           option = document.createElement("option");
           option.setAttribute("value", "06");
           option.innerHTML = "Felony Juvenile Arrest (06)";
           select.appendChild(option);
    
           option = document.createElement("option");
           option.setAttribute("value", "09");
           option.innerHTML = "Hazardous Citation (09)";
           select.appendChild(option);
    
           col2.appendChild(select);
    
           var col3  = row.insertCell(2);
           var input = document.createElement("input");
           input.setAttribute("type", 'text');
           input.setAttribute("name", 'eCode_b' + i);
           input.setAttribute("id", i);
           input.setAttribute("size", "5");
           col3.appendChild(input);
    
           col3.appendChild(document.createTextNode('\u00A0'));	//Add a space
    	   
           var a = document.createElement("a");
           var linkText = document.createTextNode("+");
           a.appendChild(linkText);
           a.href = "javascript:void(0)";
           a.setAttribute("id", 'moreCodes_' + i);
           a.setAttribute("class", 'nouona');
    //       a.attachEvent("onclick",  runit());
           col3.appendChild(a);
         }
        }
    }
    
    function runit()
    {
    	addLoadEvent();
    }
    
    function addLoadEvent(func) {
       var oldonload = window.onload;
       if (typeof window.onload != 'function') {
           window.onload = func;
       } else {
           window.onload = function() {
               if (oldonload) {
                   oldonload();
               }
           func();
           }
       }
    }
    
    addLoadEvent(function() {  fileFields(); });
    </script>
    
    </head>
    <body>
    		   <table id="ecTable" border=1>
    		    <tr>
    			 <th></th>
    			 <th>Code</th>
    			 <th>Count</th>
    			</tr>
    			<tr>
    			 <td>Enforcement Codes</td>
    			 <td>
    		    <select name="eCode_a1" id="1">
                        <option value=""></option>
                        <option value="00">No Action (00)</option>
                        <option value="01">907 (01)</option>
                        <option value="06">Felony Juvenile Arrest (06)</option>
                        <option value="09">Hazardous Citation (09)</option>
                        </select>
    			 </td>
    			 <td>
                <input type="text" name="eCode_b1" id="1" size=5 />
                <a class="nouona" href="javascript:void(0)" id="moreCodes_1" onclick="addLoadEvent();">+</a>
    			 </td>
    			</tr>
    		   </table>
    
    </body>
    </html>
    So, technically I have two "issues":
    1. I can't seem to make the onclick work on anything except the first href. (This was recently modified to increment the id#, but I'm not sure how to make everything work with this.
    2. How can I remove the hardcoded html table that I have created and automatically have .js create the header and first row? Something on the onload?

  3. #3
    Join Date
    Jan 2008
    Location
    Surprise, AZ
    Posts
    119
    alright ... I remember a time when this used to be an active site for responses ... not so much today - figured it out, well the first piece anyway, i'll get to piece 2 later:
    HTML Code:
    <html>
    <head>
    <title>test</title>
    <style>
    .nouona
    {
       text-decoration: none;
    }
    </style>
    
    <script type="text/javascript">
    function fileFields()
    {
        document.getElementById('addCodes').onclick = function()
        {
         if (window.event.srcElement.id == "addCodes") {
    
    	   var table = document.getElementById("ecTable");
           var row   = table.insertRow(-1);
    	   var col1  = row.insertCell(0);
               col1.innerHTML="&nbsp;";
    
    	   var col2  = row.insertCell(1);
           var i = document.getElementById("ecTable").getElementsByTagName("tr").length -1;
    	   
           var select = document.createElement("select");
           select.setAttribute("name", 'eCode_a' + i);
           select.setAttribute("id", i);
    
           var option;
    
           option = document.createElement("option");
           option.setAttribute("value", "");
           option.innerHTML = "";
           select.appendChild(option);
    
           option = document.createElement("option");
           option.setAttribute("value", "00");
           option.innerHTML = "No Action (00)";
           select.appendChild(option);
    
           option = document.createElement("option");
           option.setAttribute("value", "01");
           option.innerHTML = "907 (01)";
           select.appendChild(option);
    
           option = document.createElement("option");
           option.setAttribute("value", "06");
           option.innerHTML = "Felony Juvenile Arrest (06)";
           select.appendChild(option);
    
           option = document.createElement("option");
           option.setAttribute("value", "09");
           option.innerHTML = "Hazardous Citation (09)";
           select.appendChild(option);
    
    	   col2.appendChild(select);
    
    	   var col3  = row.insertCell(2);
           var input = document.createElement("input");
           input.setAttribute("type", 'text');
           input.setAttribute("name", 'eCode_b' + i);
           input.setAttribute("id", i);
           input.setAttribute("size", "5");
           col3.appendChild(input);
    
           col3.appendChild(document.createTextNode('\u00A0'));	//Add a space
    	   
           var a = document.createElement("a");
           var linkText = document.createTextNode("+");
           a.appendChild(linkText);
           a.href = "javascript:void(0)";
           a.setAttribute("id", 'addCodes_' + i);
    	   a.setAttribute("class", 'nouona');
           a.onclick = function() { runit(); };
           col3.appendChild(a);
    	 }
        }
    }
    
    function runit ()
    {
    	document.getElementById('addCodes').click();
    }
    
    function addLoadEvent(func) {
       var oldonload = window.onload;
       if (typeof window.onload != 'function') {
           window.onload = func;
       } else {
           window.onload = function() {
               if (oldonload) {
                   oldonload();
               }
           func();
           }
       }
    }
    
    addLoadEvent(function() {  fileFields(); });
    </script>
    
    </head>
    <body>
    		   <table id="ecTable" border=1>
    		    <tr>
    			 <th></th>
    			 <th>Code</th>
    			 <th>Count</th>
    			</tr>
    			<tr>
    			 <td>Enforcement Codes</td>
    			 <td>
    		    <select name="eCode_a1" id="a1">
                <option value=""></option>
                <option value="00">No Action (00)</option>
                <option value="01">907 (01)</option>
                <option value="06">Felony Juvenile Arrest (06)</option>
                <option value="09">Hazardous Citation (09)</option>
                </select>
    			 </td>
    			 <td>
                <input type="text" name="eCode_b1" id="b1" size=5 />
                <a class="nouona" href="javascript:void(0)" id="addCodes" onclick="addLoadEvent();">+</a>
    			 </td>
    			</tr>
    		   </table>
    
    </body>
    </html>

  4. #4
    Join Date
    Dec 2011
    Location
    Centurion, South Africa
    Posts
    792
    Hey gift2women, sorry nobody has replied with any advice so far. If you still have problems with this code just say and we can sort it out.

    IE7 is completely capable of rendering this scenario in Javascript, if that's what you are asking.
    JavaScript: Learn | Validate | Compact | bionoid

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles