Executing a method when clicking on a radio-button, newbie question

yoursurrogategod · August 1, 2012

Basically, the idea is that when the user clicks on "Muscle Testing Grades", the contents of the array "abbreviationsMuscleTestingGrades" is supposed to be displayed... but when I check it out in IE9 JavaScript debugger, the method setCategory does not get executed! Why is this happening?

<!-- A small search. -->

<!DOCTYPE html>
<html>
  <head>
    <style>
      div {
        color:blue;
      }
      span {
        color:red;
      }
    </style>
    <script src="http://code.jquery.com/jquery-latest.js">
    </script>
  </head>
  <body>
    <form>
      <h1>Medical Abbreviations</h1>
      <table border="0" cellpadding="0" cellspacing="2">
        <tr>
          <td>
            <input type="radio" name="category" value="normal"
                   id="normalRadio" onclick="setCategory('normal');"
                   checked>
          </td>
          <td colspan="2">
            <label for="normalRadio">Search:</label>
            <input type="text" size="18" name="searchText"
                   onchange="setCategory('normal');"
                   onKeyDown="setCategory('normal');">
          </td>
        </tr>
        <tr>
          <td>
            <input type="radio" name="category" value="symbols"
                   id="symbolsRadio" onclick="setCategory('symbols');">
          </td>
          <td colspan="2">
            <label for="symbolsRadio">All Symbols</label>
          </td>
        </tr>
        <tr>
          <td>
            <input type="radio" name="category" value="muscleTestingGrades"
                   id="muscleTestingGradesRadio"
                   onclick="setCategory('muscleTestingGrades');">
          </td>
          <td colspan="2">
            <label for="muscleTestingGradesRadio">Muscle Testing Grades</label>
          </td>
        </tr>
        <tr>
          <td>
            <input type="radio" name="category" value="discouraged"
                   id="discouragedRadio" onclick="setCategory('discouraged');"
                   onchange="setCategory('discouraged');">
          </td>
          <td colspan="2">
            <label for="discouragedRadio">Discouraged</label>
          </td>
        </tr>
        <tr>
          <td>
            <input type="radio" name="category" value="doNotUse"
                   id="doNotUseRadio" onclick="setCategory('doNotUse');"
                   onchange="setCategory('doNotUse');">
          </td>
          <td colspan="2">
            <label for="doNotUseRadio">Do Not Use</label>
          </td>
        </tr>
      </table>
      <div class="browseLink">
        <p><a href="2012.htm">Browse 2012 Abbreviations</a></p>
        <p>If you would like to add an<br>
           abbreviation or make a correction,<br>
           please fill out a ticket with this<br>
           URL in the description and it will<br>
           be forwarded to the correct<br>
           affiliate HIS manager for action.</p>
      </div>
    </form>
    <script>
      function makeStructFactory(names)
      {
        var names = names.split(' ');
        var count = names.length;

        function constructor()
        {
          for(var i = 0; i < count; i++)
          {
            this[names[i]] = arguments[i];
          }
        }

        return constructor;
      }

      var Item = makeStructFactory("ACRONYM VALUE PIC");

      var abbreviationsNormal =
        new Array(
          new Item('A Fib', 'Atrial fibrillation', 1),
          new Item('A&O', 'Alert & oriented', 1),
          new Item('A&Ox3', 'Alert & oriented to time/place/person', 1),
          new Item('A&Ox4', 'Alert & oriented to time/place/person/date', 1),
          new Item('A&P', 'Anterior and posterior', 1),
          new Item('A/C', 'Assist/control', 1),
          new Item('A/G ratio', 'Albumin/globulin ratio', 1),
          new Item('A/O', 'Add on', 1),
          new Item('A/O', 'As ordered', 1),
          new Item('A/P', 'Anteroposterior (x-ray)', 1),
          new Item('A<sub>2</sub>', 'Aortic second sound', 1),
          new Item('AA', 'Amino acids', 1),
          new Item('AAA', 'Abdominal aortic aneurysm', 1),
          new Item('AAA', 'Axillo-axillary axis', 1),
          new Item('AAROM', 'Activate assisted range of motion', 1),
          new Item('AB', 'Abdomen', 1),
          new Item('AB', 'Antibody', 1),
          new Item('ABD', 'Abduction', 1),
          new Item('ABD', 'Abdomen', 1),
          new Item('ABG', 'Arterial blood gases', 1),
          new Item('ABNL', 'Abnormal', 1),
          new Item('ABO', 'A system of classifying blood groups', 1),
          new Item('ABR', 'Auditory brainstem response (testing)', 1),
          new Item('ABS', 'Abscess', 1),
          new Item('ABX', 'Antibiotics', 1));

//      var abbreviationsSymbols =
//        new Array();

      var abbreviationsMuscleTestingGrades =
        new Array(
          new Item('0', 'Zero', 0),
          new Item('T or 1', 'Trace', 0),
          new Item('P- or 2-', 'Poor Minus', 0),
          new Item('P or 2', 'Poor', 0),
          new Item('P+ or 2+', 'Poor Plus', 0),
          new Item('F- or 3-', 'Fair Minus', 0),
          new Item('F or 3', 'Fair', 0),
          new Item('F+ or 3+', 'Fair Plus', 0),
          new Item('G- or 4-', 'Good Minus', 0),
          new Item('G or 4', 'Good', 0),
          new Item('G+ or 4+', 'Good Plus', 0),
          new Item('N or 5', 'Normal', 0));

//      var abbreviationsDiscouraged =
//        new Array();

//      var abbreviationsDoNotUse =
//        new Array();

      var foo = 1;
      function setCategory(category)
      {
        if(category == 'normal')
        {
        }
        else if(category == 'symbols')
        {
          document.write('<table>');


          document.write('</table>');
        }
        else if(category == 'muscleTestingGrades')
        {
          document.write('<table>');

          for(i = 0; i < abbreviationsMuscleTestingGrades; i++)
          {
            document.write('<tr>');

            document.write('<td>');
            document.write(abbreviationsMuscleTestingGrades[i].ACRONYM);
            document.write('</td>');

            document.write('<td>');
            document.write(abbreviationsMuscleTestingGrades[i].VALUE);
            document.write('</td>');

            document.write('</tr>');
          }

          document.write('</table>');
        }
        else if(category == 'discouraged')
        {
        }
        else if(category == 'doNotUse')
        {
        }
      }

      document.write('<p>Hello world!</p>');
    </script>
  </body>
</html>

Psycho · August 1, 2012

The problem also exists in FF. But first, one suggestions.

I see you are passing a value that is the same as the field name to the function. Instead of passing the value with each call to setCategory(), just pass a reference to the object.

            <input type="radio" name="category" value="muscleTestingGrades"
                   id="muscleTestingGradesRadio"
                   onclick="setCategory(this);">

Then in the function setCategory you can reference the value using .name of the referenced object.

      function setCategory(obj)
      {
          category = obj.name;

That should cut down on a lot of repetitive, hard-coded values.

Now, as to your problem the branch of logic for the 'muscleTestingGrades' value you have this

for(i = 0; i < abbreviationsMuscleTestingGrades; i++)

The problem is that abbreviationsMuscleTestingGrades is not a number. I think you are looking for the length property

for(i = 0; i < abbreviationsMuscleTestingGrades.length; i++)

However, there seems to be some other problems as well. I think the script is getting put in an infinite loop or something.

yoursurrogategod · August 2, 2012

The problem also exists in FF. But first, one suggestions.

I see you are passing a value that is the same as the field name to the function. Instead of passing the value with each call to setCategory(), just pass a reference to the object.
            <input type="radio" name="category" value="muscleTestingGrades"
                   id="muscleTestingGradesRadio"
                   onclick="setCategory(this);">
Then in the function setCategory you can reference the value using .name of the referenced object.
      function setCategory(obj)
      {
          category = obj.name;
That should cut down on a lot of repetitive, hard-coded values.

Now, as to your problem the branch of logic for the 'muscleTestingGrades' value you have this
for(i = 0; i < abbreviationsMuscleTestingGrades; i++)
The problem is that abbreviationsMuscleTestingGrades is not a number. I think you are looking for the length property
for(i = 0; i < abbreviationsMuscleTestingGrades.length; i++)
However, there seems to be some other problems as well. I think the script is getting put in an infinite loop or something.

Thanks. This is what I have now:

<!-- A small search. -->

<!DOCTYPE html>
<html>
  <head>
    <style>
      div {
        color:blue;
      }
      span {
        color:red;
      }
    </style>
    <script src="http://code.jquery.com/jquery-latest.js">
    </script>
  </head>
  <body>
    <form>
      <h1>Medical Abbreviations</h1>
      <table border="0" cellpadding="0" cellspacing="2">
        <tr>
          <td>
            <input type="radio" name="category" value="normal"
                   id="normalRadio" onclick="setCategory('this');"
                   checked>
          </td>
          <td colspan="2">
            <label for="normalRadio">Search:</label>
            <input type="text" size="18" name="searchText"
                   onchange="setCategory('this');"
                   onKeyDown="setCategory('this');">
          </td>
        </tr>
        <tr>
          <td>
            <input type="radio" name="category" value="symbols"
                   id="symbolsRadio"
                   onclick="setCategory('this');">
          </td>
          <td colspan="2">
            <label for="symbolsRadio">All Symbols</label>
          </td>
        </tr>
        <tr>
          <td>
            <input type="radio" name="category" value="muscleTestingGrades"
                   id="muscleTestingGradesRadio"
                   onclick="setCategory('this');">
          </td>
          <td colspan="2">
            <label for="muscleTestingGradesRadio">Muscle Testing Grades</label>
          </td>
        </tr>
        <tr>
          <td>
            <input type="radio" name="category" value="discouraged"
                   id="discouragedRadio"
                   onclick="setCategory('this');"
                   onchange="setCategory('this');">
          </td>
          <td colspan="2">
            <label for="discouragedRadio">Discouraged</label>
          </td>
        </tr>
        <tr>
          <td>
            <input type="radio" name="category" value="doNotUse"
                   id="doNotUseRadio"
                   onclick="setCategory('this');"
                   onchange="setCategory('this');">
          </td>
          <td colspan="2">
            <label for="doNotUseRadio">Do Not Use</label>
          </td>
        </tr>
      </table>
      <div class="browseLink">
        <p><a href="2012.htm">Browse 2012 Abbreviations</a></p>
        <p>If you would like to add an<br>
           abbreviation or make a correction,<br>
           please fill out a ticket with this<br>
           URL in the description and it will<br>
           be forwarded to the correct<br>
           affiliate HIS manager for action.</p>
      </div>
    </form>
    <script>
      function makeStructFactory(names)
      {
        var names = names.split(' ');
        var count = names.length;

        function constructor()
        {
          for(var i = 0; i < count; i++)
          {
            this[names[i]] = arguments[i];
          }
        }

        return constructor;
      }

      var Item = makeStructFactory("ACRONYM VALUE PIC");

      var abbreviationsNormal =
        new Array(
          new Item('A Fib', 'Atrial fibrillation', 1),
          new Item('A&O', 'Alert & oriented', 1),
          new Item('A&Ox3', 'Alert & oriented to time/place/person', 1),
          new Item('A&Ox4', 'Alert & oriented to time/place/person/date', 1),
          new Item('A&P', 'Anterior and posterior', 1),
          new Item('A/C', 'Assist/control', 1),
          new Item('A/G ratio', 'Albumin/globulin ratio', 1),
          new Item('A/O', 'Add on', 1),
          new Item('A/O', 'As ordered', 1),
          new Item('A/P', 'Anteroposterior (x-ray)', 1),
          new Item('A<sub>2</sub>', 'Aortic second sound', 1),
          new Item('AA', 'Amino acids', 1),
          new Item('AAA', 'Abdominal aortic aneurysm', 1),
          new Item('AAA', 'Axillo-axillary axis', 1),
          new Item('AAROM', 'Activate assisted range of motion', 1),
          new Item('AB', 'Abdomen', 1),
          new Item('AB', 'Antibody', 1),
          new Item('ABD', 'Abduction', 1),
          new Item('ABD', 'Abdomen', 1),
          new Item('ABG', 'Arterial blood gases', 1),
          new Item('ABNL', 'Abnormal', 1),
          new Item('ABO', 'A system of classifying blood groups', 1),
          new Item('ABR', 'Auditory brainstem response (testing)', 1),
          new Item('ABS', 'Abscess', 1),
          new Item('ABX', 'Antibiotics', 1));

//      var abbreviationsSymbols =
//        new Array();

      var abbreviationsMuscleTestingGrades =
        new Array(
          new Item('0', 'Zero', 0),
          new Item('T or 1', 'Trace', 0),
          new Item('P- or 2-', 'Poor Minus', 0),
          new Item('P or 2', 'Poor', 0),
          new Item('P+ or 2+', 'Poor Plus', 0),
          new Item('F- or 3-', 'Fair Minus', 0),
          new Item('F or 3', 'Fair', 0),
          new Item('F+ or 3+', 'Fair Plus', 0),
          new Item('G- or 4-', 'Good Minus', 0),
          new Item('G or 4', 'Good', 0),
          new Item('G+ or 4+', 'Good Plus', 0),
          new Item('N or 5', 'Normal', 0));

//      var abbreviationsDiscouraged =
//        new Array();

//      var abbreviationsDoNotUse =
//        new Array();

      function setCategory(obj)
      {
        var category = obj.name;

        if(category == 'normal')
        {
        }
        else if(category == 'symbols')
        {
          document.write('<table>');


          document.write('</table>');
        }
        else if(category == 'muscleTestingGrades')
        {
          document.write('<table>');

          for(i = 0; i < abbreviationsMuscleTestingGrades.length; i++)
          {
            document.write('<tr>');

            document.write('<td>');
            document.write(abbreviationsMuscleTestingGrades[i].ACRONYM);
            document.write('</td>');

            document.write('<td>');
            document.write(abbreviationsMuscleTestingGrades[i].VALUE);
            document.write('</td>');

            document.write('</tr>');
          }

          document.write('</table>');
        }
        else if(category == 'discouraged')
        {
        }
        else if(category == 'doNotUse')
        {
        }
      }

      document.write('<p>Hello world!</p>');
    </script>
  </body>
</html>

One thing that I noticed is that while running this in Firebug, function setCategory(obj) does not get called. I loaded the method and then clicked on the muscle radio button and... nothing! What am I doing wrong in this respect? Why isn't this method getting called?

yoursurrogategod · August 2, 2012

The problem also exists in FF. But first, one suggestions.

I see you are passing a value that is the same as the field name to the function. Instead of passing the value with each call to setCategory(), just pass a reference to the object.
            <input type="radio" name="category" value="muscleTestingGrades"
                   id="muscleTestingGradesRadio"
                   onclick="setCategory(this);">
Then in the function setCategory you can reference the value using .name of the referenced object.
      function setCategory(obj)
      {
          category = obj.name;
That should cut down on a lot of repetitive, hard-coded values.

Now, as to your problem the branch of logic for the 'muscleTestingGrades' value you have this
for(i = 0; i < abbreviationsMuscleTestingGrades; i++)
The problem is that abbreviationsMuscleTestingGrades is not a number. I think you are looking for the length property
for(i = 0; i < abbreviationsMuscleTestingGrades.length; i++)
However, there seems to be some other problems as well. I think the script is getting put in an infinite loop or something.

Psycho, category = obj.name; sets the variable category to "undefined" when I ran it. I tested with alerts sprinkled around my code. Passing in the string gives me the exact value to set against.

My one problem is that when the table gets printed out, the search page is gone. Researching this topic next.

Psycho · August 2, 2012

Psycho, category = obj.name; sets the variable category to "undefined" when I ran it. I tested with alerts sprinkled around my code. Passing in the string gives me the exact value to set against.

Because you apparently didn't change the calls to the function to pass the field 'object' as I suggested: onclick="setCategory(this);. Hard coding all those passed values is a waste since you can simply reference the field name/id. Hard coding values like that will lead to problems in maintaining the code. Just one typo could create a bug that could be difficult to find.

My one problem is that when the table gets printed out, the search page is gone. Researching this topic next.

If you want the results on the page - without wiping out the current content, then don't use document.write(). Instead, create a div where you want the contents displayed. Then create content you want to display into a string variable. Lastly, put the content into the div using something like document.getElementById('ouputDivID').innerHTML = contentVar;

yoursurrogategod · August 2, 2012

Psycho, category = obj.name; sets the variable category to "undefined" when I ran it. I tested with alerts sprinkled around my code. Passing in the string gives me the exact value to set against.

Because you apparently didn't change the calls to the function to pass the field 'object' as I suggested: onclick="setCategory(this);. Hard coding all those passed values is a waste since you can simply reference the field name/id. Hard coding values like that will lead to problems in maintaining the code. Just one typo could create a bug that could be difficult to find.

Yes, you're right. I did not do it correctly. However when I put in the way you recommended, this is the error that I got in IE9 F12 dev tools:

SCRIPT5007: The value of the property 'setCategory' is null or undefined, not a Function object

Code at the bottom of the post.

My one problem is that when the table gets printed out, the search page is gone. Researching this topic next.

If you want the results on the page - without wiping out the current content, then don't use document.write(). Instead, create a div where you want the contents displayed. Then create content you want to display into a string variable. Lastly, put the content into the div using something like document.getElementById('ouputDivID').innerHTML = contentVar;

Thanks, that worked very well.

<!-- A small search. -->

<!DOCTYPE html>
<html>
  <head>
    <style>
      div {
        color:blue;
      }
      span {
        color:red;
      }
    </style>
    <meta http-equiv="X-UA-Compatible" content="IE=8;FF=3;OtherUA=4" /> 
    <script src="http://code.jquery.com/jquery-latest.js">
    </script>
  </head>
  <body>
    <form>
      <h1>Medical Abbreviations</h1>
      <table border="0" cellpadding="0" cellspacing="2">
        <tr>
          <td>
            <input type="radio" name="category" value="normal"
                   id="normalRadio" onclick="setCategory(this);"
                   checked>
          </td>
          <td colspan="2">
            <label for="normalRadio">Search:</label>
            <input type="text" size="18" name="searchText"
                   onchange="setCategory('normal');"
                   onKeyDown="setCategory('normal');">
          </td>
        </tr>
        <tr>
          <td>
            <input type="radio" name="category" value="symbols"
                   id="symbolsRadio"
                   onclick="setCategory(this);">
          </td>
          <td colspan="2">
            <label for="symbolsRadio">All Symbols</label>
          </td>
        </tr>
        <tr>
          <td>
            <input type="radio" name="category" value="muscleTestingGrades"
                   id="muscleTestingGradesRadio"
                   onclick="setCategory(this);">
          </td>
          <td colspan="2">
            <label for="muscleTestingGradesRadio">Muscle Testing Grades</label>
          </td>
        </tr>
        <tr>
          <td>
            <input type="radio" name="category" value="discouraged"
                   id="discouragedRadio"
                   onclick="setCategory(this);"
                   onchange="setCategory(this);">
          </td>
          <td colspan="2">
            <label for="discouragedRadio">Discouraged</label>
          </td>
        </tr>
        <tr>
          <td>
            <input type="radio" name="category" value="doNotUse"
                   id="doNotUseRadio"
                   onclick="setCategory(this);"
                   onchange="setCategory(this);">
          </td>
          <td colspan="2">
            <label for="doNotUseRadio">Do Not Use</label>
          </td>
        </tr>
      </table>
      <div class="browseLink">
        <p><a href="2012.htm">Browse 2012 Abbreviations</a></p>
        <p>If you would like to add an<br>
           abbreviation or make a correction,<br>
           please fill out a ticket with this<br>
           URL in the description and it will<br>
           be forwarded to the correct<br>
           affiliate HIS manager for action.</p>
      </div>
    </form>
    <div id="SearchResultsArea">
      <!-- <p>Hello world!</p> -->
    </div>
    <script>
      function makeStructFactory(names)
      {        var names = names.split(' ');
        var count = names.length;

        function constructor()
        {
          for(var i = 0; i < count; i++)
          {
            this[names[i]] = arguments[i];
          }
        }

        return constructor;
      }

      var Item = makeStructFactory("ACRONYM VALUE PIC");

      var abbreviationsNormal =
        new Array(
          new Item('A Fib', 'Atrial fibrillation', 1),
          new Item('A&O', 'Alert & oriented', 1),
          new Item('A&Ox3', 'Alert & oriented to time/place/person', 1),
          new Item('A&Ox4', 'Alert & oriented to time/place/person/date', 1),
          new Item('A&P', 'Anterior and posterior', 1),
          new Item('A/C', 'Assist/control', 1),
          new Item('A/G ratio', 'Albumin/globulin ratio', 1),
          new Item('A/O', 'Add on', 1),
          new Item('A/O', 'As ordered', 1),
          new Item('A/P', 'Anteroposterior (x-ray)', 1),
          new Item('A<sub>2</sub>', 'Aortic second sound', 1),
          new Item('AA', 'Amino acids', 1),
          new Item('AAA', 'Abdominal aortic aneurysm', 1),
          new Item('AAA', 'Axillo-axillary axis', 1),
          new Item('AAROM', 'Activate assisted range of motion', 1),
          new Item('AB', 'Abdomen', 1),
          new Item('AB', 'Antibody', 1),
          new Item('ABD', 'Abduction', 1),
          new Item('ABD', 'Abdomen', 1),
          new Item('ABG', 'Arterial blood gases', 1),
          new Item('ABNL', 'Abnormal', 1),
          new Item('ABO', 'A system of classifying blood groups', 1),
          new Item('ABR', 'Auditory brainstem response (testing)', 1),
          new Item('ABS', 'Abscess', 1),
          new Item('ABX', 'Antibiotics', 1));

//      var abbreviationsSymbols =
//        new Array();

      var abbreviationsMuscleTestingGrades =
        new Array(
          new Item('0', 'Zero', 0),
          new Item('T or 1', 'Trace', 0),
          new Item('P- or 2-', 'Poor Minus', 0),
          new Item('P or 2', 'Poor', 0),
          new Item('P+ or 2+', 'Poor Plus', 0),
          new Item('F- or 3-', 'Fair Minus', 0),
          new Item('F or 3', 'Fair', 0),
          new Item('F+ or 3+', 'Fair Plus', 0),
          new Item('G- or 4-', 'Good Minus', 0),
          new Item('G or 4', 'Good', 0),
          new Item('G+ or 4+', 'Good Plus', 0),
          new Item('N or 5', 'Normal', 0));

//      var abbreviationsDiscouraged =
//        new Array();

      var abbreviationsDoNotUse =
        new Array(
          new Item('Dig', 'Digitalis/digoxin: Write "digoxin"', 0),
          new Item('DTO', 'Deodorized Tincure of Opium: Write "Deodorized Tincture of Opium"', 0),
          new Item('DTO', 'Diluted Tincture of Opium: Write "Pediatric Morphine Oral Solution 0.4 mg/ml"', 0),
          new Item('gr-', 'Grain: Use the metric system', 0),
          new Item('IU', 'internation unit: Write "international units"', 0),
          new Item('Lack of leading zero ( .X mg)', 'Always use a zero before a decimal point (0.x mg)', 0),
          new Item('MS', 'morphine sulfate: Write "morphine"', 0),
          new Item('MSO4', 'morphine sulfate: Write "morphine"', 0),
          new Item('Nitro.', 'Nitroglycerin: Write "Nitroglycerin" or "Nitroprusside"', 0),
          new Item('qd or QD', 'daily: Write "daily"', 0),
          new Item('qid or QID', 'four times a day: Write "4XD"', 0),
          new Item('qod or QOD', 'every other day: Write "daily", 0),
          new Item('Trailing zero (X.0 mg)', 'Never write a zero by itself or after a decimal point (X mg)', 0),
          new Item('U', 'unit: Write "units"', 0),
          new Item('<img src=\'images/dram-maroon.gif\' alt=\'Dram\' title=\'\'>', 'Dram   Use the metric system', 0),
          new Item('<img src=\'images/minum-maroon.gif\' alt=\'Minum\' title=\'\'>', 'Minum   Use the metric system', 0),
          new Item('µg', 'micrograms: Write "micrograms"', 0));

//      alert('This is the name of the div: ' +
//        document.getElementById('SearchResultsArea').name);

      function setCategory(obj)
      {
        var category = obj.defaultValue;

        alert('In the setCategory method!  This is the category: ' + category);

        if(category == 'normal')
        {
        }
        else if(category == 'symbols')
        {
          document.write('<table>');
          document.write('</table>');
        }
        else if(category == 'muscleTestingGrades')
        {
          var HTMLToOutput = '<table>';

          for(i = 0; i < abbreviationsMuscleTestingGrades.length; i++)
          {
            HTMLToOutput = HTMLToOutput + '<tr>';

            HTMLToOutput = HTMLToOutput + '<td>';
            HTMLToOutput = HTMLToOutput +
              abbreviationsMuscleTestingGrades[i].ACRONYM;
            HTMLToOutput = HTMLToOutput + '</td>';

            HTMLToOutput = HTMLToOutput + '<td>';
            HTMLToOutput = HTMLToOutput +
              abbreviationsMuscleTestingGrades[i].VALUE;
            HTMLToOutput = HTMLToOutput + '</td>';

            HTMLToOutput = HTMLToOutput + '</tr>';
          }

          HTMLToOutput = HTMLToOutput + '</table>';

          document.getElementById('SearchResultsArea').innerHTML =
            HTMLToOutput;
        }
        else if(category == 'discouraged')
        {
          var HTMLToOutput = '<table>';



          HTMLToOutput = '</table>';

          document.getElementById('SearchResultsArea').innerHTML =
            HTMLToOutput;
        }
        else if(category == 'doNotUse')
        {
          var HTMLToOutput = '<table>';

          for(i = 0; i < abbreviationsDoNotUse.length; i++)
          {
            HTMLToOutput = HTMLToOutput + '<tr>';

            HTMLToOutput = HTMLToOutput + '<td>';
            HTMLToOutput = HTMLToOutput + abbreviationsDoNotUse[i].ACRONYM;
            HTMLToOutput = HTMLToOutput + '</td>';

            HTMLToOutput = HTMLToOutput + '<td>';
            HTMLToOutput = HTMLToOutput + abbreviationsDoNotUse[i].VALUE;
            HTMLToOutput = HTMLToOutput + '</td>';

            HTMLToOutput = HTMLToOutput + '</tr>';
          }

          HTMLToOutput = '</table>';

          document.getElementById('SearchResultsArea').innerHTML =
            HTMLToOutput;
        }
      }
    </script>
  </body>
</html>

yoursurrogategod · August 2, 2012

Oops, it's this.

function setCategory(obj)
{
var category = obj.name

And I got this error:

Line: 49
Error: The value of the property 'setCategory' is null or undefined, not a Function object

Psycho · August 2, 2012

If you are going to display the contents of the arrays the same way then there is a MUCH easier way then rewriting all that same code. Call the main function passing a parameter to determine which array to use, then use the same process to output the array.

Here's some sample code where you would only need to modify the switch statement to select the right array object.

    function setCategory(category)
    {
        var outputObj = false;

        //Select the array to use
        switch(category)
        {
            case 'muscleTestingGrades':
                outputObj = abbreviationsMuscleTestingGrades;
                break;
            case 'doNotUse':
                outputObj = abbreviationsDoNotUse;
                break;
        }

        //Check that a valid value was passed
        if(outputObj===false) { return false; }

        var outputLength = outputObj.length;
        var HTMLToOutput = '<table>';
        for(i = 0; i < outputLength; i++)
        {
            HTMLToOutput += '<tr>';
            HTMLToOutput += '<td>' + outputObj [i].ACRONYM + '</td>';
            HTMLToOutput += '<td>' + outputObj [i].VALUE + '</td>';
            HTMLToOutput += '</tr>';
        }
        HTMLToOutput += '</table>';

        var outputDiv = document.getElementById('SearchResultsArea');
        outputDiv.innerHTML = HTMLToOutput;
        return;
    }

yoursurrogategod · August 3, 2012

Thanks Psycho. That part now works the way I want it to work .

Sign In

Executing a method when clicking on a radio-button, newbie question

Recommended Posts

yoursurrogategod

Link to comment

Share on other sites

Psycho

Link to comment

Share on other sites

yoursurrogategod

Link to comment

Share on other sites

yoursurrogategod

Link to comment

Share on other sites

Psycho

Link to comment

Share on other sites

yoursurrogategod

Link to comment

Share on other sites

yoursurrogategod

Link to comment

Share on other sites

Psycho

Link to comment

Share on other sites

yoursurrogategod

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information