how to change 2nd drop down contens when a item selected from first dropdown list ?

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • nixan
    New Member
    • Apr 2008
    • 4

    how to change 2nd drop down contens when a item selected from first dropdown list ?

    hi every one im using php for developing a project.
    now im having big problem,
    i have three drop down lists(lets say DD1,DD2,DD3) they will show item from database.
    for example DD1 have(it will load from database AND DD2,DD3 remain empty @ beginning) Books,Cars,Film s.
    assume that i have selected Cars then DD2 have to show Sports car, Regular cars,..ect.
    Like that if i select an item from DD2 the DD3 should change according to that.


    can anyone explain how can i complete this task???

    thanks in advance.
  • Markus
    Recognized Expert Expert
    • Jun 2007
    • 6092

    #2
    Originally posted by nixan
    hi every one im using php for developing a project.
    now im having big problem,
    i have three drop down lists(lets say DD1,DD2,DD3) they will show item from database.
    for example DD1 have(it will load from database AND DD2,DD3 remain empty @ beginning) Books,Cars,Film s.
    assume that i have selected Cars then DD2 have to show Sports car, Regular cars,..ect.
    Like that if i select an item from DD2 the DD3 should change according to that.


    can anyone explain how can i complete this task???

    thanks in advance.
    You'd use an ajax call to query a seperate php page and then have the results of the php page populate the drop down.
    You'll have to read a tutorial on ajax - w3schools has a good one

    Comment

    • nixan
      New Member
      • Apr 2008
      • 4

      #3
      thanks markusn00b,
      but i dont have any idea about AJAX & i didnt use any coding in AJAX.
      cant it done by php itself?

      Comment

      • Atli
        Recognized Expert Expert
        • Nov 2006
        • 5062

        #4
        Hi.

        PHP can not edit anything client-side once the page has been loaded. So, it can't be used to respond to any client-side events, such as drop-down changes.

        Markus' suggestion would be my nr. 1 solution as well. It simply makes a HTTP request, requesting additional data from a PHP document. (See w3schools.com for a simple AJAX tutorial)

        You could of course have PHP create a Javascript array, containing the data, and have Javascript switch out the data when the drop-down boxes change. I wouldn't advice this tho if you have loads of data to handle, the AJAX solution would be better.

        Comment

        • Markus
          Recognized Expert Expert
          • Jun 2007
          • 6092

          #5
          Originally posted by nixan
          thanks markusn00b,
          but i dont have any idea about AJAX & i didnt use any coding in AJAX.
          That is why you read tutorials.

          Regards.

          Comment

          • ronverdonk
            Recognized Expert Specialist
            • Jul 2006
            • 4259

            #6
            Originally posted by markusn00b
            That is why you read tutorials.

            Regards.
            Like the following one on Ajax chained select

            Ronald

            Comment

            • coolsti
              Contributor
              • Mar 2008
              • 310

              #7
              Doh to me. All the time I have been reading everyone's jibe about Ajax and not knowing what in the world this is. So I took a look to see just now.

              You can do the very same thing (maybe with a bit more coding effort on your part) by just including a hidden iframe on your main page calling its own separate php scripts that do all your behind the scenes database queries and other tasks. So if you really do not wish to get into Ajax, just use a combo of a hidden iframe and some javascript to do needed behind the scenes queries and repopulations of main page drop down lists.

              There is also another way to handle the parent -> child drop down list thing, which does not require background queries and which I use a lot in my application. You basically get all the possible information for the drop down lists from the database when you present the main page, and store them in javascript arrays, and then let javascript repopulate the drop down lists using the "onchange" event. This works well when the number of choices and number of lists in the chain are not too large. It then does not require any client server interaction (and avoids that latency) when the user is clicking around in the lists. To set this up does require a bit of javascript but it works nicely. If you would use this often, you can create some PHP class that creates and manages the creation of HTML and Javascript code for parent->child or parent->child->child lists. I did this some time back and now it is a breeze for me to include a new one on a new page.

              Comment

              • sethupnr
                New Member
                • Sep 2007
                • 26

                #8
                [code=html]
                <!--
                ----------------------------
                database: demo1;
                table: demo_table;
                fields(demo_tab le)
                item varchar(20);
                list varchar(20);
                ----------------------------
                -->
                <html>
                <head>
                <title>Untitl ed Document</title>
                <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
                <script type="text/javascript">
                function getItem(sel)
                {
                var itemCode = sel.options[sel.selectedInd ex].value;
                //alert(itemCode) ;
                var url= "http://localhost/onchange1.php?i tem="+itemCode;
                window.location =url;

                }

                </script>
                </head>

                <body>

                <form action="" method="post">
                <table>
                <tr>
                <td>Item </td>
                <td><select id="item" name="item" onchange="getIt em(this)">
                <option value="">Select </option>
                <option value="pr">Prin ter</option>
                <option value="ri" >Ribbon</option>
                </select>
                </td>
                </tr>
                <tr>
                <td>List </td>
                <td><select id="item_list" name="item_list " >
                <option value="">Select </option>
                <?php
                $i_code=$_REQUE ST['item'];

                $con = mysql_connect(" localhost","roo t","");
                mysql_select_db ("demo1",$co n);

                $query="select list from demo_table where item='$i_code'" ;
                $res=mysql_quer y($query);
                $num=mysql_num_ rows($res);
                for($i=0;$i<$nu m;$i++)
                {
                $data=mysql_fet ch_array($res);
                $v=$data[0].$i;
                echo "<option value='$data[0]'>".$data[0]."</option>";
                }
                ?>
                </select>
                </td>
                </tr>
                </table>
                </form>
                </body>
                </html>
                [/code]
                Last edited by Atli; Apr 5 '08, 07:37 PM. Reason: Added [code] tags.

                Comment

                • Atli
                  Recognized Expert Expert
                  • Nov 2006
                  • 5062

                  #9
                  Hi,sethupnr.

                  Please use &#91;code] tags when posting code examples. Failing to do so will make your code next to unreadable and adds extra work for us moderators who have to clean up after you.

                  &#91;code] ...Code goes here... &#91;/code]
                  &#91;code=ph p] ...PHP code goes here... &#91;/code]

                  Thank you.

                  Comment

                  • nixan
                    New Member
                    • Apr 2008
                    • 4

                    #10
                    hi thanks for reply to my problem.
                    special thanks to sethupnr its very useful to me as a begginner. and also thanks to markusn00b, for gude me to study about AJAX.

                    thanks.

                    Comment

                    Working...