Why does adding Doctype Remove Table?

mfleming · December 15, 2010

Hi.

I have a simple page that uses ajax, php, mysql to get database entries and displays them in a table by a limited number of results.

ie. it only shows 10 entries at a time.

Anyways, as soon as I had ANY DOCTYPE to the document, the table no longer shows up in Firefox. It will how ever show up in IE8 or if I remove the DOCTYPE.

http://www.nessphysiotherapy.com/testing/apaging_new.php

http://www.nessphysiotherapy.com/testing/apaging_new_nodoctype.php

DOCTYPE SET:

<!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">
<head>
<title>Ness Physiotherapy and Sports Injury Clinic Web site - Site Map</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />

<meta name="description" content="Ness Physiotherapy and Sports Injury Clinic Our mission is to provide quality, evidenced based service in a safe, friendly, professional environment." />
<meta name="keywords" content="pain,rehabilitation,rehab,exercise,manipulation,musculoskeletal,pain,management,massage therapy,physiotherapy,sports injury,injury,injured,chronic pain,quality care,quality life,muscle balance,spinal fitness assessment, BMR PT, CAFCI, RMT" />
<!--Ness Physiotherapy and Sports Injury Clinic is owned by Sean Springer, Tamara Silvari and Charles Dirks. -->
<meta name="language" content="EN" />
<meta name="copyright" content="Ness Physiotherapy and Sports Injury Clinic" />
<meta name="robots" content="ALL" />
<meta name="document-classification" content="Health" />
<meta name="document-classification" content="Health" />
<meta name="document-rights" content="Copyrighted Work" />
<meta name="document-type" content="Public" />

<meta name="document-rating" content="General" />
<meta name="document-distribution" content="Global" />
<link rel="shortcut icon" href="../favicon.ico" type="image/x-icon" />
<script type="text/javascript" src="../scripts/preloadimages.js"></script>
<script type="text/javascript" src="../scripts/p7exp.js"></script>
<script type="text/javascript" src="../scripts/formajax.js"></script>
<!--[if lte IE 7]>
<style>
#menuwrapper, #p7menubar ul a {height: 1%;}
a:active {width: auto;}
</style>
<![endif]-->
<!--[if IE 5]>
<style type="text/css"> 
/* place css box model fixes for IE 5* in this conditional comment */
.twoColFixRtHdr #sidebar1 { width: 220px; }
</style>
<![endif][if IE]>
<style type="text/css"> 
/* place css fixes for all versions of IE in this conditional comment */
.twoColFixRtHdr #sidebar1 { padding-top: 30px; }
.twoColFixRtHdr #mainContent { zoom: 1; }
/* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
</style>
<![endif]-->
<link href="../css/p7exp.css" rel="stylesheet" type="text/css" />
<link href="../css/basiclayout.css" rel="stylesheet" type="text/css" />
<link href="../css/general.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="../css/form_member_admin.css"/>

</head>

<body class="twoColFixRtHdr" onload="ajaxFunction('fw')">
<form id="myForm" action="ajaxFunction(this.form); return false">
<div>
  <input type="hidden" name="st" value="0" ></input>
  </div>
  <table>
  <tr>
    <td><input type="button" id="back" value="Prev" onclick="ajaxFunction('bk'); return false" /></td>
    <td align="right"><input type="button" value="Next" id="fwd" onclick="ajaxFunction('fw');  return false" /></td>
  </tr>

<tr>
  <td colspan="2"><div id="txtHint"><b>Records will be displayed here</b></div></td>
</tr>
</table>
</form>
</body>
</html>

DOCTYPE REMOVED:

<head>
<title>Ness Physiotherapy and Sports Injury Clinic Web site - Site Map</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />

<meta name="description" content="Ness Physiotherapy and Sports Injury Clinic Our mission is to provide quality, evidenced based service in a safe, friendly, professional environment." />
<meta name="keywords" content="pain,rehabilitation,rehab,exercise,manipulation,musculoskeletal,pain,management,massage therapy,physiotherapy,sports injury,injury,injured,chronic pain,quality care,quality life,muscle balance,spinal fitness assessment, BMR PT, CAFCI, RMT" />
<!--Ness Physiotherapy and Sports Injury Clinic is owned by Sean Springer, Tamara Silvari and Charles Dirks. -->
<meta name="language" content="EN" />
<meta name="copyright" content="Ness Physiotherapy and Sports Injury Clinic" />
<meta name="robots" content="ALL" />
<meta name="document-classification" content="Health" />
<meta name="document-classification" content="Health" />
<meta name="document-rights" content="Copyrighted Work" />
<meta name="document-type" content="Public" />
<meta name="document-rating" content="General" />
<meta name="document-distribution" content="Global" />

<link rel="shortcut icon" href="../favicon.ico" type="image/x-icon" />
<script type="text/javascript" src="../scripts/preloadimages.js"></script>
<script type="text/javascript" src="../scripts/p7exp.js"></script>
<script type="text/javascript" src="../scripts/formajax.js"></script>
<!--[if lte IE 7]>
<style>
#menuwrapper, #p7menubar ul a {height: 1%;}
a:active {width: auto;}
</style>
<![endif]-->
<!--[if IE 5]>
<style type="text/css"> 
/* place css box model fixes for IE 5* in this conditional comment */
.twoColFixRtHdr #sidebar1 { width: 220px; }
</style>
<![endif][if IE]>
<style type="text/css"> 
/* place css fixes for all versions of IE in this conditional comment */
.twoColFixRtHdr #sidebar1 { padding-top: 30px; }
.twoColFixRtHdr #mainContent { zoom: 1; }
/* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
</style>
<![endif]-->
<link href="../css/p7exp.css" rel="stylesheet" type="text/css" />
<link href="../css/basiclayout.css" rel="stylesheet" type="text/css" />
<link href="../css/general.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="../css/form_member_admin.css"/>

</head>
<body class="twoColFixRtHdr" onload="ajaxFunction('fw')">
<form id="myForm" action="ajaxFunction(this.form); return false">

<div>
  <input type="hidden" name="st" value="0" ></input>
  </div>
  <table>
  <tr>
    <td><input type="button" id="back" value="Prev" onclick="ajaxFunction('bk'); return false" /></td>
    <td align="right"><input type="button" value="Next" id="fwd" onclick="ajaxFunction('fw');  return false" /></td>
  </tr>

<tr>
  <td colspan="2"><div id="txtHint"><b>Records will be displayed here</b></div></td>
</tr>
</table>
</form>
</body>
</html>

What on earth would be causing this? I have validated the page with W3C with VALID markup.

Any suggestions on this one? If I can't find any solutions I guess I will just leave off the DOCTYPE and hope for the best....

mfleming · December 16, 2010

Fixed.

I needed to modify the javascript file in regards to names/ID for forms.

In formajax.js, change both occurrences of

myForm.st.value

to

document.forms.myForm.st.value

Since this is really a JS question, I'll move this thread.

from Kravvitz

Sign In

Why does adding Doctype Remove Table?

Recommended Posts

mfleming

Link to comment

Share on other sites

mfleming

Link to comment

Share on other sites

Archived

Browse

Activity

Important Information