|
| |
|
|
1eagle
Posts: 53 Joined: 1/16/2006 From: the foothills of the Colorado Rockies Status: offline
|
Help, there is no attribute "name" - 1/25/2006 2:27:08
This site has been a wealth of information for my learning css and now that my website is viewable again in FF. I would like to know if there is an attribute that meets xhtml strict for the two following scripts. Both scripts fail xhtml strict for the same reason from with in the form tags - there is no attribute - "name"? The first script is for a timer as follows; In the head section I have placed the following; <script type="text/javascript">
var count = 1;
function counter()
{
document.counter.burglary.value = count++;
}
</script> In the body section I have the following; <object><form class="center" name="counter" action="counter"><p><input type="text" size="1" name="burglary" style="font-size:12pt;" /></p></form></object> The second is for a drop message form. The head information; if (document.getElementById){
document.write('<style type="text/css">\n')
document.write('.dropcontent{display:none;}\n')
document.write('</style>\n')
}
function contractall(){
if (document.getElementById){
var inc=0
while (document.getElementById("dropmsg"+inc)){
document.getElementById("dropmsg"+inc).style.display="none"
inc++
}
}
}
function expandone(){
if (document.getElementById){
var selectedItem=document.dropmsgform.dropmsgoption.selectedIndex
contractall()
document.getElementById("dropmsg"+selectedItem).style.display="block"
}
}
if (window.addEventListener)
window.addEventListener("load", expandone, false)
else if (window.attachEvent)
window.attachEvent("onload", expandone) The body information; <form class="center" name="dropmsgform" action="dropmsg"> I have no problems with the function of the scripts and they do validate with xhtml transitional, I would just like all pages in my website to be valid xhtml strict. I use the two scripts on several pages, if it would help you can view the timer at http://www.providerofchoice.net/burglary-statistics.htm and the drop message form at http://www.providerofchoice.net/home-alarm-system-faq.htm Thanks
|
|
|
|
Kitka
Posts: 2520 Joined: 1/31/2002 From: Australia Status: offline
|
RE: Help, there is no attribute "name" - 1/25/2006 4:00:01
quote:
tags - there is no attribute - "name" The "name" attribute has been deprecated in xhtml. The "id" attribute is the suggested replacement. See W3C: http://www.w3schools.com/xhtml/xhtml_syntax.asp
_____________________________
Kitka **It is impossible to make anything foolproof because fools are so ingenious.**
|
|
|
|
Tailslide
Posts: 6272 Joined: 5/10/2005 From: Out here on the raggedy edge Status: offline
|
RE: Help, there is no attribute "name" - 1/25/2006 5:30:44
Hi Afraid I'm not good enough with JS to work out the dom-friendly version of the count up script - Kitka's right, the only thing you can use "name" with in a valid XHTML strict document is a form input element. I'd stick with the transitional doctype on that page until you find a better script. Far as the second bit goes - still not good enough with the JS but I've got a slightly more accessible and easier to understand alternative that might do the trick and it's valid XHTML 1.0 strict: >> Test Page Basically it's showing and hiding various divs using JS but if you switch JS off it still works - sort of! The markup is: <h2>Here is a list of frequently asked Home Alarm questions</h2>
<ol id="toggle">
<li><a href="#faq1">After Alarming my system, how long do I have to leave?</a></li>
<li><a href="#faq2">How long do I have to turn the system off after I enter the house?</a></li>
<li><a href="#faq3">How do I arm the system without the motion detector?</a></li>
<li><a href="#faq4">What should I do if I accidentally trigger my system?</a></li>
</ol>
<div id="toggleable">
<div id="faq1">
<p>1. The exit time is programmable. Typically this time is set anywhere from 30 to 60 seconds.</p>
</div> <!-- end faq1 -->
<div id="faq2">
<p>2. Most new systems have a home or stay mode. When you arm the system to the stay or home mode the system automatically bypasses the motion detector allowing free movement around the home. Other systems will automatically bypass interior devices when you arm the system and do not open any of the entry/exit points.</p>
</div> <!-- end faq1 -->
<div id="faq3">
<p>3. Just confidently enter your code at the keypad to silence the siren. If your home is monitored you will need to call your monitoring dispatch center and notify them with your name and pass code.</p>
</div> <!-- end faq1 -->
<div id="faq4">
<p>4. The exit time is programmable. Typically this time is set anywhere from 30 to 60 seconds.</p>
</div> <!-- end faq1 -->
</div><!-- end toggleable -->
And the JS (from Bobby Van der Sluis) which is kept in an external .js file is here:
if (document.getElementById && document.getElementsByTagName && document.createElement) {
document.write('<link rel="stylesheet" type="text/css" href="js_hide.css" />');
window.onload = initShowHide;
}
function initShowHide() {
// Hide the container with all toggleable elements
document.getElementById('toggleable').style.display = 'none';
var as = document.getElementById('toggle').getElementsByTagName('a');
for (var i = 0; i < as.length; i++) {
as.onclick = function() {
toggle(this);
return false;
}
}
}
function toggle(s) {
// Retrieve the id of the toggleable section
var id = s.href.match(/#(\w.+)/)[1];
// Clone the activated toggleable element from the content pool
var clone = document.getElementById(id).cloneNode(true);
// This clone will be wrapped in a generated container element called 'cloneDiv'
// Try to get a reference to an existing container element
var cloneDiv = document.getElementById('cloneDiv');
// In case the container element already exists
if (cloneDiv) {
// Replace the previously cloned toggleable element with the new one
cloneDiv.replaceChild(clone, cloneDiv.firstChild);
}
// In case the container element isn't created yet
else {
// Create the container element
var cloneDiv = document.createElement('div');
// Add the id attribute and set its value
cloneDiv.setAttribute('id', 'cloneDiv');
// Put the cloned element in the cloned container
cloneDiv.appendChild(clone);
// Append the cloned container to the body of the document
document.body.appendChild(cloneDiv);
}
}
_____________________________
"My strategy is so simple an idiot could have devised it" Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project
|
|
|
|
1eagle
Posts: 53 Joined: 1/16/2006 From: the foothills of the Colorado Rockies Status: offline
|
RE: Help, there is no attribute "name" - 1/25/2006 23:24:01
Thanks, I have tried using the "id" rather than the "name" and this renders the script inoperable. Thanks for the test page it was helpful. This is what I would like to have as my intention is to keep visitors from having to scroll or bounce back and forth thru the questions. I have been working on the script you provided and the only problem I have is that when you click on a question, the answer pops up at the bottom of the page outside of the container and content area. You can view the work in progress I have tried placing height restrictments as well as different "div" restraints and positions. All attempts I can think of make no difference short of being inoperable. Any other pointers or there again am I just code-blind and missing something?
|
|
|
|
Tailslide
Posts: 6272 Joined: 5/10/2005 From: Out here on the raggedy edge Status: offline
|
RE: Help, there is no attribute "name" - 1/26/2006 5:44:26
Hi again Apologies for apparently just giving you a different set of problems to think about!! There seems to be something weird going on there - can't see what would cause it. Worse there's a conflict between the JS and the flash file which causes the dropdown thingy to fail in IE. I swapped it to another script to see if that works better - the show/hide div things do appear in the right place as required BUT there's still a conflict with the flash movie. You can see it here: http://www.littleblueplane.com/test/faqform-new.htm working without the Flash movie there. Once you add the flash it stops working. *sigh* Maybe someone else can think of a way to get the Flash not to interfere with the JS onload event. If it were two JS onloads then that would be easy to fix but I don't know about the Flash stuff. Sorry for making your life harder!
_____________________________
"My strategy is so simple an idiot could have devised it" Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project
|
|
|
|
1eagle
Posts: 53 Joined: 1/16/2006 From: the foothills of the Colorado Rockies Status: offline
|
RE: Help, there is no attribute "name" - 1/26/2006 22:48:03
quote:
ORIGINAL: Bobby Don't sweat it... Have you been talking to my wife... she is continuously telling me, " Don't sweat it dear its not that big of a deal, don't be so picky." Thank you, your comment brought a smile to my face, and the wife thought it was hilarious that someone that doesn't even know me would be telling me the same thing. quote:
ORIGINAL: Tailslide Apologies for apparently just giving you a different set of problems to think about!! No apologies required. Your change done the trick. Not sure what is causing the problem for you. I have the codes installed the same way you have them and I have no problems with the page acting as it should in FF or IE. If ok with you I kept the same name you used for the "js" page. I have it installed and working at http://www.providerofchoice.net/home-alarm-system-faq.htm I will be changing the other faq pages this weekend. Also the current color scheme is the one you had missed over in critiques. Thank you Edit, A couple more what is? style="clear:both; and <!-- div name -->
< Message edited by 1eagle -- 1/26/2006 23:15:21 >
|
|
|
|
1eagle
Posts: 53 Joined: 1/16/2006 From: the foothills of the Colorado Rockies Status: offline
|
RE: Help, there is no attribute "name" - 1/29/2006 12:39:08
OK I have been doing some digging around and have found the answer for the problem with XHTML Strict validation for the "name=" attribute needing to be "id=". In the first example for the timer I had; <script type="text/javascript">
var count = 1;
function counter()
{
document.counter.burglary.value = count++;
}
</script> The only thing that required changing was the line document.counter.burglary.value Valid code now looks like; <script type="text/javascript">
var count = 1;
function counter()
{
document.getElementById("counter").burglary.value = count++;
}
</script> Body <form class="center" id="counter" action="counter"> Valid code for the second script required the same addition to the line var selectedItem=document.dropmsgform.dropmsgoption.selectedIndex if (document.getElementById){
document.write('<style type="text/css">\n')
document.write('.dropcontent{display:none;}\n')
document.write('</style>\n')
}
function contractall(){
if (document.getElementById){
var inc=0
while (document.getElementById("dropmsg"+inc)){
document.getElementById("dropmsg"+inc).style.display="none"
inc++
}
}
}
function expandone(){
if (document.getElementById){
var selectedItem=document.getElementById("dropmsgform").dropmsgoption.selectedIndex
contractall()
document.getElementById("dropmsg"+selectedItem).style.display="block"
}
}
if (window.addEventListener)
window.addEventListener("load", expandone, false)
else if (window.attachEvent)
window.attachEvent("onload", expandone) Body <form class="center" id="dropmsgform" action="dropmsg"> Hope this helps out for anyone else having the same problem.
< Message edited by 1eagle -- 1/29/2006 12:45:46 >
|
|
New Messages |
No New Messages |
Hot Topic w/ New Messages |
Hot Topic w/o New Messages |
Locked w/ New Messages |
Locked w/o New Messages |
|
Post New Thread
Reply to Message
Post New Poll
Submit Vote
Delete My Own Post
Delete My Own Thread
Rate Posts
|
|
|