how make javascript for this

Collapse
X
Collapse
 
  • Page of 1
  • Filter
  • Time
  • Show
Clear All
new posts
Previous template Next
    #1

    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.
    Tags: javacode, javascript, php
    #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.e. with change()
          .change() | jQuery API Documentation
          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

                    Previous template Next
                    Working...
                    X