asked on

JavaScript Code which works only IN IE

Hi Experts,
Below is the Code which creates a new line of textfields, say if the row has specified 4 textfields, the below code creates additional line same as above when i click the [Add] button.

The Following code is working only in IE, it does not work in any other Browser:

Can anyone Guide what is wrong

var delName = "ID=oth4del";
var t = oth4;
t.str = "\r\n      <td><table class=\"query\" width=\"100%\">\r\n          <tr>\r\n            <td><input type=\"text\" name=\"q269r1491i~\" size=\"22\" maxlength=\"50\">\r\n            </td>\r\n            <td><input type=\"text\" name=\"q270r1447i~\" size=\"22\" maxlength=\"50\">\r\n            </td>\r\n            <td><input type=\"text\" name=\"q2765r6758i~\" size=\"22\" maxlength=\"50\">\r\n              </font></td>\r\n          </tr>\r\n        </table></td>\r\n      ";
t.str = '<table width="100%"><tr chooserroot="true"><td><input type="button" value="Del" onclick="delrow(this)" '+delName+'></td>'+t.str+'</tr></table>';
t.cnt = 1;
document.multis.push(t);

Open in new window

Error i get is this:

TypeError: m.lastChild.insertAdjacentHTML is not a function
[Break On This Error]

m.lastChild.insertAdjacentHTML('beforeBegin', m.str.replace(/~/g,++m.cnt));

This is used for adding a Row:

function addrow(b)
{
var m = findparent(b,"div");
m.lastChild.insertAdjacentHTML('beforeBegin', m.str.replace(/~/g,++m.cnt));
}

Rainer Jeschor

Hi,
sorry but the code snippet you added contains only a delete button.

Also without the rest of the page (html+javascript) it is impossible to support you in an effective way.
Can you please attach the whole page (html+scripts) or post a link to check the page online?

Thanks and HTH
Rainer

Coast Line

ASKER

Its an Intranet Site but let me give you code for Add button too

the following functions get Called:

<table align="center"><tr><td><input type="button" value="Add" onclick="addrow(this)" ID="insurance1Add"
></td></tr></table>


document.multis = new Array();

function findparent(e,tn) {
  while(e && e.parentNode && e.tagName && e.tagName.toLowerCase()!=tn) e = e.parentNode;
  return e;
}

function addrow(b) 
{
  var m = findparent(b,"div");  
  m.lastChild.insertAdjacentHTML('beforeBegin', m.str.replace(/~/g,++m.cnt));    
 }
///////////////////////////////////DEL ROW
function delrow(b)
{
  var table = findparent(b,"table");
  //var t = findparent(b,"div");
  //alert(t.cnt);
  //alert(table.cnt);
  table.parentNode.removeChild(table);  
}

Open in new window

Uncaught TypeError: Object #<Text> has no method 'insertAdjacentHTML'

Also i checked again in Chrome and it gave me error on: when addRow is called

Rainer Jeschor

Hi,
still without the whole html (== DOM) it is hard to help you. From the last posted code block there is e.g. no DIV around the table hence I am not sure if your findparent function will return anything.

There error results from that m is not a DOM node.

Does the following show you the alert?

function addrow(b) 
{
  var m = findparent(b,"div");  
  if (typeof m !== undefined || m !== null)
  {
    m.lastChild.insertAdjacentHTML('beforeBegin', m.str.replace(/~/g,++m.cnt));    
  }
  else
  {
    alert('m is not defined/null');
  }
}

Open in new window

HTH
Rainer

Coast Line

ASKER

i added your code but it does not go to the alert, it just displays me this error:

TypeError: m.lastChild.insertAdjacentHTML is not a function

Coast Line

ASKER

This is the kind of Code which is generated with HTML

<DIV ID="Div_Insurance" >
        <SPAN id="INSURANCE" style="display:inline;">
        

<div ID="insurance1"
 >


<table border="1%" align="center" width="100%" style="display:none"><tr>
      <td><table class="query" width="100%">
          <tr>
            <td >Type</td>
            <td><select name="q2485i~">
                <option value="5581">Pharmaceutical</option>
                <option value="5582" selected>Long Term Care</option>
                <option value="5583">Home Care</option>
                <option value="5584">Other</option>
              </select>
            </td>
            <td>Other</td>
            <td><input type="text" name="q2764r6757i~" placeholder="Other Infomation" size="22" maxlength="50"></td>
          </tr>
          <tr>
            <td>Name of Insurance</td>
            <td><input type="text" name="q2438r5533i~" placeholder="Insurance Name" size="22" maxlength="50">
            </td>
            <td>Contact Person</td>
            <td><input type="text" name="q2439r5534i~" placeholder="Contact Person" size="22" maxlength="50">
            </td>
          </tr>
          <tr>
            <td>Address</td>
            <td><textarea cols="20" rows="4"  maxlength="50" name="q2440r5535i~" placeholder="Address"></textarea>
            </td>
            <td>Phone</td>
            <td><input type="text" name="q2441r5536i~" size="22" maxlength="50" onKeyUp="jm_phonemask(this)" onBlur="wphoneLength(this)"; placeholder="XXX-XXX-XXXX">
            </td>
          </tr>
          <tr>
            <td>Fax</td>
            <td><input type="text" name="q2442r5537i~" size="22" maxlength="50" onKeyUp="jm_phonemask(this)" onBlur="wphoneLength(this)"; placeholder="XXX-XXX-XXXX">
            </td>
            <td>Email</td>
            <td><input type="text" name="q2443r5538i~" size="22" maxlength="50" placeholder="xyz@xyz.xyz">
            </td>
          </tr>
        </table></td>
      </tr></table>

<table align="center"><tr><td><input type="button" value="Add" onclick="addrow(this)" ID="insurance1Add"
></td></tr></table>

</div>

<script>
var delName = "ID=insurance1del";
var t = insurance1;
t.str = "\r\n      <td><table class=\"query\" width=\"100%\">\r\n          <tr>\r\n            <td >Type</td>\r\n            <td><select name=\"q2485i~\">\r\n                <option value=\"5581\">Pharmaceutical</option>\r\n                <option value=\"5582\" selected>Long Term Care</option>\r\n                <option value=\"5583\">Home Care</option>\r\n                <option value=\"5584\">Other</option>\r\n              </select>\r\n            </td>\r\n            <td>Other</td>\r\n            <td><input type=\"text\" name=\"q2764r6757i~\" placeholder=\"Other Infomation\" size=\"22\" maxlength=\"50\"></td>\r\n          </tr>\r\n          <tr>\r\n            <td>Name of Insurance</td>\r\n            <td><input type=\"text\" name=\"q2438r5533i~\" placeholder=\"Insurance Name\" size=\"22\" maxlength=\"50\">\r\n            </td>\r\n            <td>Contact Person</td>\r\n            <td><input type=\"text\" name=\"q2439r5534i~\" placeholder=\"Contact Person\" size=\"22\" maxlength=\"50\">\r\n            </td>\r\n          </tr>\r\n          <tr>\r\n            <td>Address</td>\r\n            <td><textarea cols=\"20\" rows=\"4\"  maxlength=\"50\" name=\"q2440r5535i~\" placeholder=\"Address\"></textarea>\r\n            </td>\r\n            <td>Phone</td>\r\n            <td><input type=\"text\" name=\"q2441r5536i~\" size=\"22\" maxlength=\"50\" onKeyUp=\"jm_phonemask(this)\" onBlur=\"wphoneLength(this)\"; placeholder=\"XXX-XXX-XXXX\">\r\n            </td>\r\n          </tr>\r\n          <tr>\r\n            <td>Fax</td>\r\n            <td><input type=\"text\" name=\"q2442r5537i~\" size=\"22\" maxlength=\"50\" onKeyUp=\"jm_phonemask(this)\" onBlur=\"wphoneLength(this)\"; placeholder=\"XXX-XXX-XXXX\">\r\n            </td>\r\n            <td>Email</td>\r\n            <td><input type=\"text\" name=\"q2443r5538i~\" size=\"22\" maxlength=\"50\" placeholder=\"xyz@xyz.xyz\">\r\n            </td>\r\n          </tr>\r\n        </table></td>\r\n      ";
t.str = '<table width="100%"><tr chooserroot="true"><td><input type="button" value="Del" onclick="delrow(this)" '+delName+'></td>'+t.str+'</tr></table>';
t.cnt = 1;
document.multis.push(t);
</script>


      </SPAN>
      </DIV>

Open in new window

ASKER CERTIFIED SOLUTION

Rainer Jeschor

membership

Create a free account to see this answer

Signing up is free and takes 30 seconds. No credit card required.

See answer

Coast Line

ASKER

Hi, Changing the statement did not made any difference, i am still getting the same above error

Rainer Jeschor

Hi,
which browsers are you testing?
Rhis function is not available in Firefox, you have to code it differently.
A sample how to is here (example 2):
http://help.dottoro.com/ljmkgsnw.php

HTH
Rainer

Coast Line

ASKER

i want to make it cross browser compatible, in IE it works but in other browsers i does not

Coast Line

ASKER

even in chrome, it throws same error

Coast Line

ASKER

That did not helped But thanks for the guidance, i have solved it another way