...
PDA

ie choking on script

NancyJ
07-09-2007, 02:27 PM
IE wont render the page with the javascript.
If I take out the link to the script the page renders fine but with the script the whole page is blank.

In FF it renders perfectly. The page validates and there are no script errors come up. The 'view source' shows the source is there but the page is blank.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>My Application!</title>
<link href="/default_style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src = "/scripts/ajax.js" />
</head>
<body>
<form action = "/users/create" method="post">
<label for = "users_id"></label> <input type = "hidden" name = "users[id]" id = "users_id" value = "" /><br />

<label for = "users_name">Name</label> <input type = "text" name = "users[name]" id = "users_name" value = "" /><br />

<label for = "users_display_name">Display Name</label> <input type = "text" name = "users[display_name]" id = "users_display_name" value = "" /><br />

<label for = "users_email_address">Email Address</label> <input type = "text" name = "users[email_address]" id = "users_email_address" value = "" /><br />

<label for = "users_password">Password</label> <input type = "password" name = "users[password]" id = "users_password" value = "" /><br />

<label for = "users_height">Height</label><span id = "users_height"><select name = "users[height_feet]" id = "users_height_feet">
<option value = "3" >3</option>
<option value = "4" >4</option>
<option value = "5" selected = "selected" >5</option>
<option value = "6" >6</option>
<option value = "7" >7</option>
</select>
feet <select name = "users[height_inches]" id = "users_height_inches">
<option value = "0" >0</option>
<option value = "1" >1</option>
<option value = "2" >2</option>
<option value = "3" >3</option>
<option value = "4" >4</option>
<option value = "5" >5</option>
<option value = "6" >6</option>
<option value = "7" selected = "selected" >7</option>
<option value = "8" >8</option>
<option value = "9" >9</option>
<option value = "10" >10</option>
<option value = "11" >11</option>
</select>
inches</span><br />

<label for = "users_frame_size">Frame Size</label> <select name = "users[frame_size]" id = "users_frame_size" ><option value = "0">Small</option>
<option value = "1">Medium</option>
<option value = "2">Large</option>
</select>
<br />

<label for = "users_start_weight">Start Weight</label> <input type = "text" name = "users[start_weight]" id = "users_start_weight" size = "3" value = "" />lbs<br />

<label for = "users_goal_weight">Goal Weight</label> <input type = "text" name = "users[goal_weight]" id = "users_goal_weight" size = "3" value = "" />lbs <a style = "cursor:pointer" onclick = "suggest_weight();">suggest</a><br />

<label for = "users_gender">Gender</label>
<select name = "users[gender]" id = "users_gender" ><option value = "f">Female</option>
<option value = "m">Male</option>
</select>
<br />

<label for = "users_date_of_birth">Date Of Birth</label> <span id = "users_date_of_birth"><select name = "users[date_of_birth][days]" id = "users_date_of_birth_days">
<option value = "01" >01</option>
<option value = "02" >02</option>
<option value = "03" >03</option>
<option value = "04" >04</option>
<option value = "05" >05</option>
<option value = "06" >06</option>
<option value = "07" >07</option>
<option value = "08" >08</option>
<option value = "09"selected = "selected" >09</option>
<option value = "10" >10</option>
<option value = "11" >11</option>
<option value = "12" >12</option>
<option value = "13" >13</option>
<option value = "14" >14</option>
<option value = "15" >15</option>
<option value = "16" >16</option>
<option value = "17" >17</option>
<option value = "18" >18</option>
<option value = "19" >19</option>
<option value = "20" >20</option>
<option value = "21" >21</option>
<option value = "22" >22</option>
<option value = "23" >23</option>
<option value = "24" >24</option>
<option value = "25" >25</option>
<option value = "26" >26</option>
<option value = "27" >27</option>
<option value = "28" >28</option>
<option value = "29" >29</option>
<option value = "30" >30</option>
<option value = "31" >31</option>
</select>
<select name = "users[date_of_birth][months]" id = "users_date_of_birth_months">
<option value = "01" >January</option>
<option value = "02" >February</option>
<option value = "03" >March</option>
<option value = "04" >April</option>
<option value = "05" >May</option>
<option value = "06" >June</option>
<option value = "07"selected = "selected" >July</option>
<option value = "08" >August</option>
<option value = "09" >September</option>
<option value = "10" >October</option>
<option value = "11" >November</option>
<option value = "12" >December</option>
</select>
<select name = "users[date_of_birth][years]" id = "users_date_of_birth_years">
<option value = "1900" >1900</option>
<option value = "1901" >1901</option>
<option value = "1902" >1902</option>
<option value = "1903" >1903</option>
<option value = "1904" >1904</option>
<option value = "1905" >1905</option>
<option value = "1906" >1906</option>
<option value = "1907" >1907</option>
<option value = "1908" >1908</option>
<option value = "1909" >1909</option>
<option value = "1910" >1910</option>
<option value = "1911" >1911</option>
<option value = "1912" >1912</option>
<option value = "1913" >1913</option>
<option value = "1914" >1914</option>
<option value = "1915" >1915</option>
<option value = "1916" >1916</option>
<option value = "1917" >1917</option>
<option value = "1918" >1918</option>
<option value = "1919" >1919</option>
<option value = "1920" >1920</option>
<option value = "1921" >1921</option>
<option value = "1922" >1922</option>
<option value = "1923" >1923</option>
<option value = "1924" >1924</option>
<option value = "1925" >1925</option>
<option value = "1926" >1926</option>
<option value = "1927" >1927</option>
<option value = "1928" >1928</option>
<option value = "1929" >1929</option>
<option value = "1930" >1930</option>
<option value = "1931" >1931</option>
<option value = "1932" >1932</option>
<option value = "1933" >1933</option>
<option value = "1934" >1934</option>
<option value = "1935" >1935</option>
<option value = "1936" >1936</option>
<option value = "1937" >1937</option>
<option value = "1938" >1938</option>
<option value = "1939" >1939</option>
<option value = "1940" >1940</option>
<option value = "1941" >1941</option>
<option value = "1942" >1942</option>
<option value = "1943" >1943</option>
<option value = "1944" >1944</option>
<option value = "1945" >1945</option>
<option value = "1946" >1946</option>
<option value = "1947" >1947</option>
<option value = "1948" >1948</option>
<option value = "1949" >1949</option>
<option value = "1950" >1950</option>
<option value = "1951" >1951</option>
<option value = "1952" >1952</option>
<option value = "1953" >1953</option>
<option value = "1954" >1954</option>
<option value = "1955" >1955</option>
<option value = "1956" >1956</option>
<option value = "1957" >1957</option>
<option value = "1958" >1958</option>
<option value = "1959" >1959</option>
<option value = "1960" >1960</option>
<option value = "1961" >1961</option>
<option value = "1962" >1962</option>
<option value = "1963" >1963</option>
<option value = "1964" >1964</option>
<option value = "1965" >1965</option>
<option value = "1966" >1966</option>
<option value = "1967" >1967</option>
<option value = "1968" >1968</option>
<option value = "1969" >1969</option>
<option value = "1970" >1970</option>
<option value = "1971" >1971</option>
<option value = "1972" >1972</option>
<option value = "1973" >1973</option>
<option value = "1974" >1974</option>
<option value = "1975" >1975</option>
<option value = "1976" >1976</option>
<option value = "1977" >1977</option>
<option value = "1978" >1978</option>
<option value = "1979" >1979</option>
<option value = "1980" >1980</option>
<option value = "1981" >1981</option>
<option value = "1982" >1982</option>
<option value = "1983" >1983</option>
<option value = "1984" >1984</option>
<option value = "1985" >1985</option>
<option value = "1986" >1986</option>
<option value = "1987" >1987</option>
<option value = "1988" >1988</option>
<option value = "1989" >1989</option>
<option value = "1990" >1990</option>
<option value = "1991" >1991</option>
<option value = "1992" >1992</option>
<option value = "1993" >1993</option>
<option value = "1994" >1994</option>
<option value = "1995" >1995</option>
<option value = "1996" >1996</option>
<option value = "1997" >1997</option>
<option value = "1998" >1998</option>
<option value = "1999" >1999</option>
<option value = "2000" >2000</option>
<option value = "2001" >2001</option>
<option value = "2002" >2002</option>
<option value = "2003" >2003</option>
<option value = "2004" >2004</option>
<option value = "2005" >2005</option>
<option value = "2006" >2006</option>
<option value = "2007"selected = "selected" >2007</option>
<option value = "2008" >2008</option>
<option value = "2009" >2009</option>
<option value = "2010" >2010</option>
<option value = "2011" >2011</option>
<option value = "2012" >2012</option>
<option value = "2013" >2013</option>
<option value = "2014" >2014</option>
<option value = "2015" >2015</option>
<option value = "2016" >2016</option>
<option value = "2017" >2017</option>
</select>
</span><br />

<input type = "submit" name = "submit" value = "Submit" /></form>
</body>
</html>


var xmlHttp
var field

function suggest_weight()
{
frame = document.getElementById('users_frame_size')[document.getElementById('users_frame_size').selectedIndex].value;
height_feet = document.getElementById('users_height_feet')[document.getElementById('users_height_feet').selectedIndex].value;
height_inches = document.getElementById('users_height_inches')[document.getElementById('users_height_inches').selectedIndex].value;
url = '/suggest_weight.php?frame='+frame+'&height_feet='+height_feet+'&height_inches='+height_inches;
changeField(url, 'users_goal_weight');

}
function changeField(url,fieldName)
{
field = fieldName;
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
}

function stateChanged()
{

if (xmlHttp.readyState==4)
{
document.getElementById(field).value=xmlHttp.responseText;
}
}

onload = function()
{
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
// Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}
Nightfire
07-09-2007, 03:03 PM
IE might be fussy over the spacing in

src = "/scripts/ajax.js"

as a guess, try deleting the spacing
koyama
07-09-2007, 03:31 PM
IE might be fussy over the spacing in
src = "/scripts/ajax.js"
as a guess, try deleting the spacing
Nahh... that doesn't really matter. Not even to IE.

It looks like the problem is that this:

<script type="text/javascript" src = "/scripts/ajax.js" />
should be changed to this:

<script type="text/javascript" src = "/scripts/ajax.js"></script>
I don't know if the original version is technically correct?
Arbitrator
07-09-2007, 07:10 PM
Nahh... that doesn't really matter. Not even to IE.I seems that such syntax is well‐formed XML too. I don’t know about HTML though.

I don't know if the original version is technically correct?When you serve XHTML as HTML (fake XHTML) instead of as XML, you cannot get away with using XML self‐closing syntax except for empty elements. (Technically, you can’t get away with that either, but major browsers have never parsed HTML as SGML.) <script …/> ends up being interpreted as an unclosed start tag (the slash is incorrectly stripped by major browsers); the source code for everything thereafter ends up being processed as one large, erroneous script since the browser perceives the script end tag to be missing. There are some more “technically”s to go with that, but I’ll spare you from those explanations.
koyama
07-09-2007, 07:56 PM
Thank you very much for your explanation, Arbitrator.

I surely hope that I will get a full understanding of the underlying technical details. I have bookmarked this post of yours together with some of your other related posts that I have collected. Thanks to you I now feel sufficiently armed for gaining new knowledge on this field.

EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum