nestcape nac and ie

[Tezler]

http://www.tjsaynor.com/test/Main_Site.htm

Hello guys. Problems with cross browser.
My site above runs fine in internet explorer however in netscape which it must run in too i have problems!
The html code is not the target at the minute llthough i know the style sheets will not work because of the ID instead of class. This is being sorted at the minute.

My target on here is the JAVASCRIPT, the javascript did not run and i wondered if you guys could help my out to get it running on both!
In the version i did try though in netscape the javascript was imported using SRC, would this have been the problem or can you guys see things that will not work in netscape in the souce javascript above?

Cheers, id like this one to meet the brief if possible! actually does say IE5 and netscape4 i think but IE and NETSCAPE will do fine.

Cheers for your help in advance

[cmorbutts]

LOL, I tried accessing your page but it asked me for a username and password.

[blufive]

The URL you've given requires a password to access, so we can't see anything.

[Tezler]

ooops ill sort out and post new link!
http://tjsaynor.com/help/Main_Site.htm

[Tezler]

any body ?????? is it the inner html that dont work with netscape ?

Please advise ASAP as deadline coming, thanks pps

TJ

[cmorbutts]

I had a look at it with Netscape 7 and it appeared to be working okay. What version of Netscape did you test with.

If you need it to work wiht Netscape 4 therein lies your problem. Netscape 4 doesn't do divs... it calls 'em layers. So if you need to get it working with Netscape 4, then do a search in Google to see what you can do to get your page going. THere should be plenty of examples on the net.

[Tezler]

mmmmmmmmm, netscape 7 i tried it on bit like i say i did with version i looked at include it using SRC in the tag!
THE code did run then and update display?

yeh IE 5 and netscape 4 i would like it to work in! you sure it wont work then in netscape 4 ? what is it then which wont work in netscape? any ideas and easy ways i can make it work in netscape 4?

pain in the @s LOL this is! why my tutor chose old browsers?

[Tezler]

WELL people, i mailed my tutor who i asked if he could kindly guide me in whch part is not working in netscape!
HE sent the error back what the browser displays of:

 JavaScript Error: http://tjsaynor.com/help/Main_Site.htm,
line 75:
 
illegal character ' ' ('\40') in window name Kestrel Moon. 
 
when the submit button is pressed

CANT understand what problem line 75 has, runs through the .name of the array displaying each one at a time.
is it that i have
name = company[i].name
and the var name is conflicting?

ALSO you know how i can get of old browsers to check the compatibility?

cheers

EDIT:
Just looked at it and this line aint needed as the name isnt needed in the calculations. mmmmmmm. JUST need netscape to view and play in.

[MikeFoster]

Hi abcdef,

Making a page cross-browser is non-trivial and should be part of the design/development process from the start. I will offer a few tips on dhtml for NN4:

1) In NN4, for every DIV or SPAN positioned 'absolute' or 'relative' there will be a Layer object created. I don't think this will work with TDs (but I'm not 100% sure). Therefore I suggest you put a DIV inside each TD and use the ID on the DIV instead of the TD. You'll need a CSS class to apply to these DIVs which will provide at least: "position:relative;". Note that NN4 can be problematic with positioned elements in tables ;)

2) Your javascript must support the different APIs of the browsers you need to support. To do this I use a dhtml library instead of re-creating branching routines for each new project. The following are some functions from my library. You will need these (or others which provide similar functionality) for cross-browser dhtml. If you want to use these and have questions about them just let me know. (BTW, I haven't tested xInnerHTML() ;)) If you can't use these because of other restrictions then study these to learn how to implement your own cross-browser code.

In your code...
- instead of document.getElementById(id) use xGetElementById(id).
- instead of assigning a string to element.innerHTML call xInnerHTML(id, htmlString).

// Functions from the X library, licensed LGPL

function xGetElementById(e) {
  if(typeof(e)!='string') return e;
  if(document.getElementById) e=document.getElementById(e);
  else if(document.all) e=document.all[e];
  else if(document.layers) e=xLayer(e);
  else e=null;
  return e;
}

// only for nn4. called only by xGetElementById
function xLayer(id,root) {
  var i,layer,found=null;
  if (!root) root=window;
  for(i=0; i<root.document.layers.length; i++) {
    layer=root.document.layers[i];
    if(layer.id==id) return layer;
    if(layer.document.layers.length) found=xLayer(id,layer);
    if(found) return found;
  }
  return null;
}

function xInnerHTML(ele, sHtml)
{
  if (!(ele = xGetElementById(ele))) return;
  if (typeof(ele.innerHTML)=='string') {
    if (typeof(sHtml)=='string') ele.innerHTML = sHtml;
    else return ele.innerHTML;
  }
  else if (document.layers) { // nn4
    if (typeof(sHTML)=='string') {
      if (sHtml=="") sHtml=" ";
      ele.document.open();
      ele.document.write(sHtml);
      ele.document.close();
    }
    else return "";
  }
}

You can download old versions of many different browsers at http://browsers.evolt.org/

[Tezler]

Sorry Mike, You've blown me away with all that.
What is a DIV ? and as for your library, lost. You lost me from the start.
Sorry for being so simple.

[MikeFoster]

Don't apologize, we all have to start from the beginning.

There is no easy way to make your page look and work the same in NN4, IE4+, Gecko, Opera, etc.

If you want to experiment with my code, try...

1) insert my X functions into a script element in the head. Then in your code...
- instead of document.getElementById(id) use xGetElementById(id).
- instead of assigning a string to element.innerHTML call xInnerHTML(id, htmlString).

2) try #1 first and test in as many browsers as possible (especially NN4), then try the DIV idea:
Here is a TD from your page:

<td bgcolor="#B8C5C8" id="name0">Ipswitch Union</td>

Change it (and the other similar TDs) to...

<td bgcolor="#B8C5C8"><div id="name0" class='companies'>Ipswitch Union</div></td>

To go along with this you'll need the following in the style element in the head (in nn4 the div won't inherit styles so you may have to put them in this class):

.companies {
  position:relative;
  margin:0; padding:0;
}

Try the above, then post back with specific questions about where you are having problems.

[MikeFoster]

By the way, try to use at least version 4.7x of NN.

[MikeFoster]

Also...

make a backup copy of your project before you start making these changes

[Tezler]

OK then > LOL, watch the mess i make of this:
READY, STEADY GO ............ post after changes!

[Tezler]

http://www.tjsaynor.com/help/Main_Site_changes.htm
Hi back with Problems already, if i had to guess me not following instructions properly!
your functions are in the script now and i changed the code of the writing to cells to what you indicated or what i followed! in IE i get values of undefined, and in netscape! i get errors! no undefined at all.
Is this the only way to go ? just that for a first project i cant see him wanting us to do all the functions etc as you did.

TJ

[MikeFoster]

Change this...

xGetElementById('name'+i).innerHTML = xInnerHTML('name' + i, company[i].name);

To this...

xInnerHTML('name' + i, company[i].name);

This:
xInnerHTML(eleId, htmlString);
is the cross-browser equivalent of this:
document.getElementById(eleId).innerHTML = htmlString;

Is this the only way to go ?

You're using document.getElementById and innerHTML. If you want that to work on NN4, IE4+, Gecko, etc. then my X functions (or yours or someone else's functions that accomplish the same thing) are required.

You're doing extremely well for a "first project", but for such a first project I would use form controls instead of DHTML. Then use CSS to style the form controls. Inside each TD you'd have a text field:

<form name='form0' onsubmit='return false'>
<table>
  <tr>
    <td>
      <input name='name0' type='text' value=''>
    </td>
  </tr>
  <tr>
    <td>
      <input name='name1' type='text' value=''>
    </td>
  </tr>
</table>
</form>

These text fields can be updated with new text in a very cross-browser way with only simple javascript - nothing as complicated as what you're about to get into

For example, the following updates the above text fields:

var f = document.forms['form0'];
for (var i = 0; i < maxFields; ++i) {
  f.elements['name' + i].value = 'I am text field ' + i;
}

This code is very cross-browser. What makes the DHTML approach so complicated is the fact that you have to support NN4. So, the next project your given, the very first thing you should ask is what browsers you have to support And when you post a question here at the forum, be sure to tell us first that you have to support NN4 - then we'll run far away :jk:

Let us know how you want to proceed.

[MikeFoster]

Oops. Just realised I had a typo in the code for xInnerHTML. I've corrected it.

[Tezler]

LOL > like it like it ! i willl from now on promise!
I like the sound of this new way, really do! isn't that still DHTML though because javascript is still being used? i have my wires crossed?
Still a little worried on what to do to go about this ?
the form is the input details! do i create another form you say in the CELLS to the right so this new way writes to them?
Here i go again simple TEZ

Cheers Mike, massive help

[Tezler]

at the moment in IE too MIKE when i get JS error, if i click on the error icon bottom left window pops up then goes off though straight away!
Annoying big time, means i cant read errors!

[Tezler]

HI, would prob prefer to go second way but did try the other way too ! works perfect again in IE but in netscape 4.7 which i now have! the javascript dont run! there is no error though still! weird!

[MikeFoster]

isn't that still DHTML though because javascript is still being used?

There's a fine line between what is dhtml and what is not.

do i create another form you say in the CELLS to the right so this new way writes to them?

Look at my example above. The form element completely encloses the table element. Each TD contains an input element.

There's no page at the address you've provided, so I can't see your page.

[Tezler]

Hi Mike sorry been out playing that SNOOKER again, we WON so thumbs up!!!!

Ok then, ill post a link right here in 5 seconds so you can see the other code, like i say works in IE but not NN but gives no error which i cant work out!

http://www.tjsaynor.com/help/Main_Site_changes.htm

Ill post it up but would like to go other way prob so ill have a go at that with input in TD's after i put link up. Then work on CSS

tar

[Tezler]

And back with the other and boy o boy is that simpler LOL > works in NN4 too which is nice.

link: http://www.tjsaynor.com/help/Main_Site_diff_way.htm

works all good, Now onto CSS i think i need!, how i format so both works in NN and IE.
font inside text fields. No border. etc. any where i can view what is available to tweak?
ALSO and the pain at the moment, the length? how do you do length of field so works in both NN and IE ?
in NN, stretches to end, looks nasty! what method do i use on the text field and also in the <td> and <tr> ?

Thanks,
TJ