SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Evangelist
    Join Date
    May 2003
    Posts
    595
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Changing the value in a hidden field

    Hi,

    There is a hidden field defined as:

    Code:
    <input type="hidden" name="testCat" value="0">
    The "value" of a dropdown, called "SelCategory" is actually the index of an array as follows:

    Code:
    function Category(type, name, price)
      {
      this.type = type;
      this.name = name;
      this.price = price;
      }
    
      var CategoryList = new Array();
      CategoryList[0] = new Category("Sel","--Select--","Sel");
      CategoryList[1] = new Category("2","Accounting","25");
      // etc,etc
      CategoryList[5] = new Category("2","Email","26");
    In this example, the value of SelCategory is 5. I need to get the 3rd element of the index (which is value '26'), and set the hidden field to _that_ value. The JS code I can get to work is only hard coded, like:

    Code:
    frm.testCat.value = CategoryList[5].price;
    ...or
    frm.testCat.value = "26";
    The JS code that doesn't work (tried 4 different methods):

    Code:
    frm.testCat.value = CategoryList[frm.SelCategory.value].price;
    
    var temp = frm.SelCategory.value
    frm.testCat.value = CategoryList[temp].price;
    
    var temp = (frm.selCategory.value) ? CategoryList[frm.selCategory.value].price : '';
    frm.testCat.value = temp;
    
    var temp = CategoryList[frm.selCategory.value];
    frm.testCat.value = temp.price;
    Obviously my errors are in syntax somewhere, I don't see why, for instance, the first 'try' in the example code above, didn't work.

    Thanks,

    Peter

  2. #2
    SitePoint Evangelist Mr. Brownstone's Avatar
    Join Date
    May 2002
    Location
    Relative
    Posts
    452
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by jehoshua
    Code:
    <input id="testCat" type="hidden" name="testCat" value="0">
    Code:
    document.getElementById ( 'testCat' ).value = CategoryList[5].price;
    The required changes are emboldened for you.
    Of course, that's just my opinion. I could be wrong.

  3. #3
    SitePoint Evangelist
    Join Date
    May 2003
    Posts
    595
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Changing the value in a hidden field

    Hi,

    Tried your suggestions; I had to change:

    Code:
    document.getElementById ( 'testCat' ).value = CategoryList[5].price;
      ... to
    document.getElementById ( 'testCat' ).value = CategoryList[frm.SelCategory.value].price;
    because I can't have values hard coded, but need to retrieve the current value for "frm.SelCategory.value". Also, "frm" is used a lot in the code and works, it is evaluated on initialisation of the form (onload) as:

    Code:
    frm = document.getElementById(formId);
    The changes didn't work, but thanks anyway.

    Peter

  4. #4
    SitePoint Evangelist Mr. Brownstone's Avatar
    Join Date
    May 2002
    Location
    Relative
    Posts
    452
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try frm.SelCategory.selectedIndex instead of .value.
    Of course, that's just my opinion. I could be wrong.

  5. #5
    SitePoint Evangelist
    Join Date
    May 2003
    Posts
    595
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Changing the value in a hidden field

    Hi,

    Well, it seems to work now, but I still don't understand ??

    This works and sets the hidden field to a value of 26 (correct):

    Code:
    showCatInfo(frm.selCategory.value);
    
    function showCatInfo(index)
      {
      var prod = CategoryList[index];
      frm.testCat.value = prod.price;
      }
    but I can't see why this won't work ??

    Code:
    frm.testCat.value = CategoryList[frm.SelCategory.value].price;
    This code sets the hidden value to 25 (incorrect), which indicates it is evaluating the index as 1 ?

    Code:
    var temp = CategoryList[frm.selCategory.value];
    frm.testCat.value = temp.price;
    Beats me

    Peter

  6. #6
    SitePoint Evangelist
    Join Date
    May 2003
    Posts
    595
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Changing the value in a hidden field

    Hi,

    Quote Originally Posted by Mr. Brownstone
    Try frm.SelCategory.selectedIndex instead of .value.
    That changed the hidden value to "Sel"

    Thanks,

    Peter

  7. #7
    SitePoint Evangelist
    Join Date
    May 2003
    Posts
    595
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Changing the value in a hidden field

    Hi,

    This code _now_ works:

    Code:
    frm.testCat.value = CategoryList[frm.selCategory.value].price;
    I think I need to go back to bed and get up again. It was all a timing problem, as when 'categories' change, I call a function to repopulate the OPTION dropdown for subcategories. The above code was in the Category function; it should have been in the subcategory function (... doh ! )

    Thanks,

    Peter

  8. #8
    SitePoint Evangelist Mr. Brownstone's Avatar
    Join Date
    May 2002
    Location
    Relative
    Posts
    452
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    LOL, sorry for not being useful. It was late last night and I saw this thread and thought, “Hey, I could probably do this one...”

    Edit:

    Note to self: Read and digest question/code before answering post in future.
    Of course, that's just my opinion. I could be wrong.

  9. #9
    SitePoint Evangelist
    Join Date
    May 2003
    Posts
    595
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Changing the value in a hidden field

    Hi,

    The only problem remaining with this now, is when a related dropdown is 'empty' (value equals null I guess).

    When I select a category from the dropdown list, and there are no subcategories, the form still displays the label 'Sub Category:' and the dropdown is empty. The code for category and sub category:

    Code:
    <tr>
      <td>
      <b>Category:</b>
      </td>
      <td>
      <select id="selCategory" name="selCategory" onChange="getSubCategories(this.value)">
      </select><em>*</em>
      </td>
      </tr>
    <tr>
      <td>
      <b>Sub Category:</b>
      </td>
      <td>
      <select id="selSubCategory" name="selSubCategory" onChange="showSubCatInfo(this.value)">
      </select><em>*</em>
      </td>
    </tr>
    When I use Mozilla and display the Page Info, there is no value for field name selSubCategory. The JS function that repopulates the sub category dropdown list as follows:

    Code:
    function getSubCategories(categoryid)
      {
      var subcat = CategoryList[frm.selCategory.value].categoryid
      var current = (frm.selSubCategory.value) ? SubCategoryList[frm.selSubCategory.value].subcatname : '';
    
      for(i = frm.selSubCategory.length - 1; i >= 0; i--)
         {
         frm.selSubCategory.options[i] = null;
         }
      for(i = 0; i < SubCategoryList.length; i++)
         {
         var prod = SubCategoryList[i];
         if(prod.categoryid == subcat)
           { 
           frm.selSubCategory.options[frm.selSubCategory.options.length] = new Option(prod.subcatname, i, (prod.subcatname==current), (prod.subcatname==current));
           }
         }
    
      frm.category.value = CategoryList[frm.selCategory.value].categoryid;
    
      if (frm.selSubCategory.value)
         {
         var prod2 = SubCategoryList[index];
         div3.innerHTML = '<p>' + index + '  ' + prod2.subcatname + '  ' + prod2.subcatid + '</p>';
         frm.subcategory.value = SubCategoryList[index].subcatid;
         }
      else
         {
         frm.subcategory.value = "0";
      }
    I'm using the 'innerHTML to debug, and the values for subcategory are not being changed when the category has no subcategories. As you can see, I'm trying to "force" the value of 'subcategory' (hidden field) to zero if the dropdown is empty. Is the problem something to do with all the OPTIONS being removed, and the property doesn't actually exist ? I've even tried:

    Code:
    var temp = document.getElementById ( 'subcategory' ).value;
    but it returns the incorrect value, of 2 ? I did put an ID on the 'subcategory' (hidden) field. I have been using Javascript console to debug and no errors are appearing. Using Mozilla's Javascript debugger doesn't seem to let me step through the code, even though I set breakpoints ?

    Hoping someone can shed some light on this please.

    Thanks,

    Peter


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •