Home/ Questions/Q 169421
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-11T12:37:40+00:00

I’m trying to update a span tag that is in a fieldset tag that

  • 0

I’m trying to update a span tag that is in a fieldset tag that is in a legend tag. The idea is to update the cost of a Software Item as components are selected. The code below works fine if I only have one software item (e.g. – Visual Studio 2008 Pro $2800), but if I add a second item in another fieldset, then when I try to update the span for that fieldset, it updates the span for the fieldset containing my Visual Studio Software. Any ideas what I’m doing wrong?

<script language='javascript' type='text/javascript'> $(document).ready(function() {     $('li').click(function() {                    var itemCost = 0;         $('legend').each(function() {             var SoftwareItem = $(this).text();             itemCost = GetItemCost(SoftwareItem);             $('input:checked').each(function() {                                var Component = $(this).next('label').text();                 itemCost += GetItemCost(Component);             });                         $('#ItemCostSpan').text('Item Cost = $ ' + itemCost);         });         function GetItemCost(text) {             var start = 0;             start = text.lastIndexOf('$');             var textCost = text.substring(start + 1);             var itemCost = parseFloat(textCost);             return itemCost;         }             }); }); </script>  <head runat='server'> <title></title> </head> <body> <form id='form1' runat='server'> <fieldset>    <legend>Visual Studio 2008 Pro   $2800</legend>      <ul class='AspNet-CheckBoxList-RepeatDirection-Vertical'>         <li class='AspNet-CheckBoxList-Item'>             <input id='CheckBoxList1_0' type='checkbox'   name='CheckBoxList1$0' value='first1' />             <label for='CheckBoxList1_0'>Software Assurance $300.00</label>         </li>         <li class='AspNet-CheckBoxList-Item'>             <input id='CheckBoxList1_1' type='checkbox' name='CheckBoxList1$1' value='second2' />             <label for='CheckBoxList1_1'>Another Component $255.25</label>         </li>             <li class='AspNet-CheckBoxList-Item'>             <input id='CheckBox1' type='checkbox' name='CheckBoxList1$1' value='second2' />             <label for='CheckBoxList1_1'>A Second Component $15.25</label>         </li>     </ul>     <span id='ItemCostSpan' style='background-color:White'>         </span>              </fieldset>     <fieldset>    <legend>Visio 2008 Pro   $415</legend>      <ul class='AspNet-CheckBoxList-RepeatDirection-Vertical'>         <li class='AspNet-CheckBoxList-Item'>             <input id='CheckBox2' type='checkbox' name='CheckBoxList1$0' value='first1' />             <label for='CheckBoxList1_0'>Software Assurance $40.00</label>         </li>         <li class='AspNet-CheckBoxList-Item'>             <input id='CheckBox3' type='checkbox' name='CheckBoxList1$1' value='second2' />             <label for='CheckBoxList1_1'>Another Component $25.55</label>         </li>             <li class='AspNet-CheckBoxList-Item'>             <input id='CheckBox4' type='checkbox' name='CheckBoxList1$1' value='second2' />             <label for='CheckBoxList1_1'>A Second Component $10.25</label>         </li>         </ul>             <span id='ItemCostSpan' style='background-color:White'></span>           </fieldset>      <span id='TotalCostSpan' style='background-color:White'></span>      </form>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Tag ids must be unique. You are updating the span with ID ‘ItemCostSpan’ of which there are two. Give the span a class and get it using find.

        $('legend').each(function() {         var SoftwareItem = $(this).text();         itemCost = GetItemCost(SoftwareItem);         $('input:checked').each(function() {                            var Component = $(this).next('label').text();             itemCost += GetItemCost(Component);         });                     $(this).find('.ItemCostSpan').text('Item Cost = $ ' + itemCost);     });
    • 0