Form Input Question

[cjl]

Hey all:

I have the following html and javascript:

HTML:
<form name="searchme" action="" onKeyPress="checkSection('searchme');">

JAVASCRIPT:
function checkSection(submitter)
{
changeAnatomy(submitter);
}

function changeAnatomy(submitter)
{
if (document[submitter].query.value.slice(0,2) == '00')
{
document.getElementById('anatomy_table').innerHTML = '<div
class="table_title">Anatomy</div><br> 00 - All<br></div>';
}
}

What I want is that when the user enters two digits and they are '00',
the innerHTML will be changed. What I get is a change only after a
third digit (any digit) is entered. BTW - I know that the checkSection
function looks redundant, but other code to validate the input will go
in there soon.

Where am I going wrong?

-CJL

 

[Evertjan.]

cjl wrote on 29 okt 2005 in comp.lang.javascript:

Hey all:

I have the following html and javascript:

HTML:
<form name="searchme" action="" onKeyPress="checkSection('searchme');">

JAVASCRIPT:
function checkSection(submitter)
{
changeAnatomy(submitter);
}

function changeAnatomy(submitter)
{
if (document[submitter].query.value.slice(0,2) == '00')
{
document.getElementById('anatomy_table').innerHTML = '<div
class="table_title">Anatomy</div><br> 00 - All<br></div>';
}
}

What I want is that when the user enters two digits and they are '00',
the innerHTML will be changed. What I get is a change only after a
third digit (any digit) is entered. BTW - I know that the checkSection
function looks redundant, but other code to validate the input will go
in there soon.

Where am I going wrong?

The 0 is not there yet at onkeypress? Try onkeyup.

btw: cann't you do this simpler?

 

[cjl]

Evertjan:

The 0 is not there yet at onkeypress? Try onkeyup.

Thank you, onkeyup worked.

btw: can't you do this simpler?

Probably.

I have a search form that requires the user to input a six digit code.
There are three tables on the page: Section, Etiology, and Anatomy.
The section and etiology tables are static. However, the anatomy table
must change depending on which section is selected. For example, if
the "Neuro" section digits are keyed then the anatomy table must have
choices for "brain", "head and neck", and "spine". There are 11
different sections, so I need 11 different anatomy tables.

I can't think of another way to do this, but there must be simpler and
more elegant solutions. Any help is appreciated.

-CJL

 

[Evertjan.]

cjl wrote on 29 okt 2005 in comp.lang.javascript:

Thank you, onkeyup worked.


Probably.

I have a search form that requires the user to input a six digit code.
There are three tables on the page: Section, Etiology, and Anatomy.
The section and etiology tables are static. However, the anatomy table
must change depending on which section is selected. For example, if
the "Neuro" section digits are keyed then the anatomy table must have
choices for "brain", "head and neck", and "spine". There are 11
different sections, so I need 11 different anatomy tables.

I can't think of another way to do this, but there must be simpler and
more elegant solutions. Any help is appreciated.

What I mean by simpler is:

HTML:
<form name="searchme" action="" onKeyPress="checkSection('searchme');">

use "this" wherever possible:

<form action="" onKeyPress="changeAnatomy(this);">

<div id=xxx class="table_title"></div>

JAVASCRIPT:

function checkSection(submitter) {
changeAnatomy(submitter);
}

why the intermediate function?


function changeAnatomy(submitterObj) {
if (submitterObj.query.value.slice(0,2) == '00') {

document.getElementById('anatomy_table').innerHTML =
'<div class="table_title">Anatomy</div><br> 00 - All<br></div>';

innerHTML-ing the asymetrical end part of a <div></div> seems illogical,
and I would use <div> and not <br>, but that depends on the css styles,
and only inserting the text looks cleaner and less rpone to mistakes:

document.getElementById('xxx').innerHTML = 'Anatomy'
document.getElementById('yyy').innerHTML = ' 00 - All'
}
}

 

[Randy Webb]

cjl said the following on 10/29/2005 1:02 PM:

Evertjan:





Thank you, onkeyup worked.




Probably.

I have a search form that requires the user to input a six digit code.
There are three tables on the page: Section, Etiology, and Anatomy.
The section and etiology tables are static. However, the anatomy table
must change depending on which section is selected. For example, if
the "Neuro" section digits are keyed then the anatomy table must have
choices for "brain", "head and neck", and "spine". There are 11
different sections, so I need 11 different anatomy tables.

I can't think of another way to do this, but there must be simpler and
more elegant solutions. Any help is appreciated.

Select lists or Radio Buttons. They choose the anatomy, they get the table.

 

[cjl]

Evertjan and Randy:

Thank you very much, your points are well taken.

I will rethink my approach, and make it cleaner. I'm going to skip all
the innerHTML mumbo jumbo, and just show / hide some <div>s.

-CJL