how make javascript for this

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    how make javascript for this

    if select category then show subcategories of this selected category

    <select name="category">
    <option value="0">Select Category</option>
    <option value="abc">ABC</option>
    <option value="123">123</option>
    <option value="abc">abc</option>
    </select>

    if i select ABC category then show only this category subcategories:-
    <select name="subcategory" id="ABC">
    <option value="0">Select Sub-Category</option>
    <option value="A">A</option>
    <option value="B">B</option>
    <option value=C">C</option>
    </select>

    if i select 123 category then show only this category subcategories:-
    <select name="subcategory" id="123">
    <option value="0">Select Sub-Category</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    </select>

    if i select abc category then show only this category subcategories:-
    <select name="subcategory" id="abc">
    <option value="0">Select Sub-Category</option>
    <option value="a">a</option>
    <option value="b">b</option>
    <option value="c">c</option>
    </select>


    how make javascript for this please help me thank you.

    #2
    i'm not very good in javascript coding, but if you use jquery it can be easily done.
    Advertise your mobile site for FREE with AdTwirl

    Comment


      #3
      Originally posted by GumSlone View Post
      i'm not very good in javascript coding, but if you use jquery it can be easily done.
      how in jquery?

      Comment


        #4
        i.e. with change()
        .change() | jQuery API Documentation
        Advertise your mobile site for FREE with AdTwirl

        Comment


          #5
          Originally posted by GumSlone View Post
          i cant understand

          Comment


            #6
            like this:
            HTML Code:
            <!DOCTYPE html>
            <html>
            <head>
              <script src="http://code.jquery.com/jquery-latest.js"></script>
            </head>
            <body>
            <select name="category"> 
             <option value="0">Select Category</option> 
             <option value="abc">ABC</option> 
             <option value="123">123</option> 
             <option value="bca">bca</option> 
             </select>
              <div id="sub"></div>
            <script>
            $("select[name='category']").change(function () {
              var html ='';
              var val = $("select[name='category'] option:selected").val();
              if(val=='abc')
              {
                html = '<select name="subcategory" id="ABC">  <option value="0">Select Sub-Category</option>  <option value="A">A</option>  <option value="B">B</option>  <option value=C">C</option>  </select>';
              }
              else if(val=='123')
              {
                html = '<select name="subcategory" id="123">  <option value="0">Select Sub-Category</option>  <option value="1">1</option>  <option value="2">2</option>  <option value="3">3</option>  </select>';
              }
              else if(val=='bca')
              {
                html = '<select name="subcategory" id="bca">  <option value="0">Select Sub-Category</option>  <option value="b">b</option>  <option value="c">c</option>  <option value="a">a</option>  </select>';
              }
              $("#sub").html(html);
            })
            .change();
            </script>
             
            </body>
            </html>
            you can also use ajax request on change for the subcategories html code
            Advertise your mobile site for FREE with AdTwirl

            Comment


              #7
              might be best to make your own javascript for it shouldn't be very complicated to create its only a simple feature

              Comment


                #8
                Originally posted by ori View Post
                might be best to make your own javascript for it shouldn't be very complicated to create its only a simple feature
                i doubt that he can do it, he even does not understand the documentation and examples from jquery
                Advertise your mobile site for FREE with AdTwirl

                Comment


                  #9
                  v1.2

                  javascript version:
                  PHP Code:
                  <select onchange="showdd(this.value)" name="category"
                  <
                  option value="0">Select Category</option
                  <
                  option value="ABC">ABC</option
                  <
                  option value="123">123</option
                  <
                  option value="abc">abc</option
                  <
                  option value="win">win</option
                  </
                  select

                  <
                  p id="someId"></p

                  <
                  script type="text/javascript">
                  function 
                  showdd(choice// Scripted by Something Else On Coding-Talk.com 
                  {
                      var 
                  html "";
                      if(
                  choice=="ABC")
                      {
                          
                  html '<select name="subcategory" id="ABC"><option value="0">Select Sub-Category</option><option value="A">A</option><option value="B">B</option><option value=C">C</option></select>';
                      }
                      if(
                  choice=="123")
                      {
                          
                  html '<select name="subcategory" id="123"><option value="0">Select Sub-Category</option><option value="1">1</option><option value="2">2</option><option value="3">3</option></select>';
                      }
                      if(
                  choice=="abc")
                      {
                          
                  html '<select name="subcategory" id="abc"><option value="0">Select Sub-Category</option><option value="a">a</option><option value="b">b</option><option value="c">c</option></select>';
                      }
                          if(
                  choice=="win")
                      {
                                 
                  html 'CONGRATULATIONS you have WON the chance to earn some credits by watching this video for 5 mins lol';
                      }
                      
                  document.getElementById('someid').innerHTML html;
                  }
                  </
                  script
                  Last edited by something else; 02.03.13, 16:16. Reason: v1.2

                  Comment


                    #10
                    Originally posted by something else View Post
                    javascript version:
                    PHP Code:



                    <select onchange="showdd(this.value)" name="category"
                    <
                    option value="0">Select Category</option
                    <
                    option value="ABC">ABC</option
                    <
                    option value="123">123</option
                    <
                    option value="abc">abc</option
                    </
                    select
                    <
                    p id="someid"></p>
                    <
                    script type="text/javascript">
                    function 
                    showdd(choice)
                    {
                        var 
                    html "";
                        if(
                    choice=="ABC")
                        {
                            
                    html '<select name="subcategory" id="ABC"><option value="0">Select Sub-Category</option><option value="A">A</option><option value="B">B</option><option value=C">C</option></select>';
                        }
                        if(
                    choice=="123")
                        {
                            
                    html '<select name="subcategory" id="123"><option value="0">Select Sub-Category</option><option value="1">1</option><option value="2">2</option><option value="3">3</option></select>';
                        }
                        if(
                    choice=="abc")
                        {
                            
                    html '<select name="subcategory" id="abc"><option value="0">Select Sub-Category</option><option value="a">a</option><option value="b">b</option><option value="c">c</option></select>';
                        }
                        
                    document.getElementById('someid').innerHTML html;
                    }
                    </
                    script
                    thanx to all

                    Comment

                    Working...
                    X