SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Addict
    Join Date
    Aug 2009
    Posts
    200
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Help required :)

    Hi, I have a simple little jquery script that when a certain value from a dropdown is selected it loads specific content.

    jQuery:

    Code:
    <script type="text/javascript">
    $(function() { 
       $('#category_id').change(function(){ 
          $('.statecontent').hide(); 
          $('#' + $(this).val()).show();     
       }); 
    });
    </script>
    category_id form element:

    Code:
    <select name="category_id" id="category_id">
    <option>-- Please Select --</option>
    <option value="0">None</option>
    <?php foreach (get_list(3, 0, '') as $category) { ?>
    <option value="<?php echo $category['category_id']; ?>"><?php echo $category['category_name']; ?></option><?php } ?>
    </select>
    HTML div with content:

    HTML Code:
    <div id="1" class="statecontent" style="display: none;">CONTENT HERE</div>
    Everything works absolutely fine, which is great. - But the issue I am having when you select certain options from the drop the content should load the same as another.

    For instance, selecting value="1" shares the same content as value="2" and value="3" - this little script is set to select the id of an element. - I tried changing it so it reads the class, as I know you can have more than 1 class on an element, but this did not work. - I could just duplicate the code and change the id tags to the relevent value, but the content within the div tag is check boxes which is part of the form, and I know you cannot have 2 form elements of the same name.

    I am assuming that PHP would be used to do this? If any body knows of another way to do this, or how to solve this I would very much appreciate it!

    Thank you,

    Paul
    Last edited by jpopuk; Oct 4, 2011 at 12:15. Reason: Minor changes and spelling

  2. #2
    SitePoint Wizard silver trophybronze trophy Cups's Avatar
    Join Date
    Oct 2006
    Location
    France, deep rural.
    Posts
    6,869
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    I think your problem is that in terms of html you are generating this;

    <option id="1">category one</option>

    And then you are trying to access the "1" with jquery

    $('#' + $(this).val()).show();

    Which will not work as variables must start with a letter or an underscore, though they can contain a number.

    So this would be valid:

    <option id="id_1">category one</option>

    so you need to slightly refactor your PHP

    <option value="id_<?php echo $category['category_id']; ?>">

    Substitute the id_ for something else if you wish.

    Divide and conquer as ever.

    You should always get a working html/JS copy with real concrete values debugged and working before adding PHP/Mysql into the mix.


    EDIT

    When the form is posted you simply have to split("_", $incoming_option); to access the chosen number:
    PHP Code:
    $id =  split("_"$incoming_option);

    echo (int) 
    $id[1];  // typecast 2nd part of array to be an integer for security's sake 


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
  •