• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 643
  • Last Modified:

HTML Listbox selectedItem problem.

I am using IE6.0.
Below is a small excerpt from my html code.  I have 3 listboxes.  The user only selects one site item from the Site listbox.  They select multiple items from the Equipment listbox and  only one item can be chosen from the Reason listbox.  I want to display the 2 items selected out of the 5 items from the Equipment listbox in a message box when I press a submit button.  Thought this would work.  See the rest of my code below:

An INPUT tag calls the "selectedItem(this.form)" javascript function.  I think this code is the problem.
     if (form.lstEquip[count].selected){
     equip=form.lstEquip.options[count].text;
     equip_reason=GetReason(form);
     alert (site + " " + equip + " " + equip_reason);}

For some reason, after it finds the first selected item, it quits without going to the next item selected in the listbox.  See the rest of my code below:

<html>
<body>
<form name=form1>
.
.
.
<P><!--Site Listbox.  Onclick and OnChange update the equipment box.-->
  <SELECT id=lstSite
  style="LEFT: 1px; WIDTH: 75px; TOP: 3px; HEIGHT: 219px"
   onclick=loadEquip(); onchange=loadEquip(); size=15></SELECT>
 <!--Equipment Listbox-->
 <SELECT
 id=lstEquip style="WIDTH: 100px; HEIGHT: 218px"
   onclick=previewEntries(); onchange=previewEntries(); multiple
   size=15></SELECT>
<!--Reason Listbox-->
 <SELECT id=lstReasons
  style="WIDTH: 160px; HEIGHT: 217px" onclick=previewEntries();
 onchange=previewEntries(); size=15></SELECT>
 </P>
.
.
.
<tr>
            <TD>From:&nbsp;&nbsp;<INPUT onkeypress=onlyDigits() id=tmFrm
              onblur="fmtTime(this);updTime(); " onkeyup=updTime();
              onfocus=this.select(); size=5
              name=tmFrm></INPUT>&nbsp;&nbsp;&nbsp;&nbsp;
              To:&nbsp;&nbsp;<INPUT
              onkeypress=onlyDigits() id=tmTo onblur="fmtTime(this);updTime(); " 
              onkeyup=updTime(); onfocus=this.select(); size=5
              name=tmTo></INPUT>&nbsp;&nbsp;&nbsp;&nbsp;
              <INPUT onClick="selectedItem(this.form)" type=button value=Save></INPUT>
            </td>
</tr>
.
.
.
</form>
</body>
</html>
<script language="javascript">
function selectedItem(form){
    var site = "";
    //Get the Site from the listbox.
    for (count = 0; count < form.lstSite.length; count++) {
    if (form.lstSite[count].selected){
     site=form.lstSite.options[count].text;
    }}
   
    //Get the Equipment from the listbox.
    var equip="";
    var equip_reason="";
    for (count = 0; count < form.lstEquip.length; count++) {
    //The statements below is the problem.  The statement below not does determine
   //if the next item in the listbox is selected or not.  If the item is selected, I want the
   //values to be displayed
   //in a message.  The equipment listbox has muliple items.  So for each equipment
   //item, there should be the site, the equipment item selected, and a reason.  The site
   //and reason will always be the same value.
     if (form.lstEquip[count].selected){
     equip=form.lstEquip.options[count].text;
     equip_reason=GetReason(form);
     alert (site + " " + equip + " " + equip_reason);
     }}
}

function GetReason(form){
    //Get the Reasons from the listbox.
    var reason = "";
    for (count = 0; count < form.lstReasons.length; count++) {
    if (form.lstReasons[count].selected){
     return reason=form.lstReasons.options[count].text;
    }}
 }
</script>


Thanks in Advance
The Firebird

0
BirdsOfFire1
Asked:
BirdsOfFire1
  • 7
  • 4
1 Solution
 
archrajanCommented:
can u post the html from ur view source, right now cannot debug because there are no options in the select boxes
0
 
archrajanCommented:
Try this line:
 if (form.lstEquip[count].selected && form1.lstEquip[count+1].selected)
instead of

 if (form.lstEquip[count].selected)
0
 
archrajanCommented:
the above code i posted will not work, can u post some html so that we can get a better idea abt what u r looking for?
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
BirdsOfFire1Author Commented:
To: archrajan
This html should work.

<table border="0">
<tr>
    <td>
      <select name=lstSite id=lstSite size="10" style="width:150px;">
             <option>LA</option>
             <option>MS</option>
             <option>AL</option>
             <option>TX1</option>
             <option>TX2</option>
             <option>FL1</option>
             <option>FL2</option>
     </select>
    </td>
   
    <td>
         <select id=lstEquip name="lstEquip" size="10" style="width:150px;">
              <option value="1">Computer</option>
              <option value="2">Tape Drive</option>
              <option value="3">Bulbs</option>
         </select>
     </td>
     <td>
         <select id=lstReasons name="lstReason" size="10" style="width:150px;">
              <option value="1">Power Outage</option>
              <option value="2">Personnel</option>
              <option value="3">EquipmentFailure</option>
         </select>
     </td>
</tr>
</table>
0
 
BirdsOfFire1Author Commented:
To:  archrajan
I nothing when I ran this code.   When I excluded the last part of this code, one equipment selection displayed in the message.

 if (form.lstEquip[count].selected && form1.lstEquip[count+1].selected)


Thanks for your help.
The FireBird
0
 
archrajanCommented:
can u also explain what u r looking to do? with this example can u explain? so that we cud help u more efficiently
0
 
archrajanCommented:
Is this what u want???
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<script language="javascript">
function selectedItems(obj)
 {
 var sel = "The selected Items are:"
 for(i =0; i <obj.length;i++)
 {
 if(obj.options[i].selected)
 {
 var sel = sel + "\n"+obj.options[i].text
 }
 }
 alert(sel);
 }
</script>
</HEAD>

<BODY>
<table border="0">
<tr>
    <td>
      <select name=lstSite id=lstSite size="10" style="width:150px;" >
             <option>LA</option>
             <option>MS</option>
             <option>AL</option>
             <option>TX1</option>
             <option>TX2</option>
             <option>FL1</option>
             <option>FL2</option>
     </select>
    </td>
   
    <td>
         <select id=lstEquip name="lstEquip" size="10" style="width:150px;" multiple>
              <option value="1">Computer</option>
              <option value="2">Tape Drive</option>
              <option value="3">Bulbs</option>
         </select>
     </td>
     <td>
         <select id=lstReasons name="lstReason" size="10" style="width:150px;">
              <option value="1">Power Outage</option>
              <option value="2">Personnel</option>
              <option value="3">EquipmentFailure</option>
         </select><br>
             <input type = "button" value = "click to see selected Items" onclick = "selectedItems(document.getElementById('lstEquip'))">
     </td>
</tr>
</table>

</BODY>
</HTML>
0
 
BirdsOfFire1Author Commented:
I found what the problem was.  When I renamed the count variable in the GetReason function to count2, it started working.  See the code below:

function GetReason(form){
    //Get the Reasons from the listbox.
    var reason = "";
    for (count = 0; count < form.lstReasons.length; count++) {
    if (form.lstReasons[count].selected){
     return reason=form.lstReasons.options[count].text;
    }}
 }


Thanks
The FireBird
0
 
archrajanCommented:
Ok Great!
0
 
BirdsOfFire1Author Commented:
To:  archrajan

For coming to my aid, I will attempt to give you some points.

Thanks again,
The FireBird


0
 
archrajanCommented:
Thats ok, Not a problem, you solved it yourself, so points does not matter!
0
 
PAQ_ManCommented:
Question Closed, 500 points refunded.
PAQ_Man
Community Support Moderator
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 7
  • 4
Tackle projects and never again get stuck behind a technical roadblock.
Join Now