CODEWITHSUNDEEP
phpjavascript
Sizwe
Sizwe

Reputation: 108

Display data retrived from a dropdown

I need help. I want to display three data values that will be selected by a user from 3 dropdowns. I have created three dropdown lists in which a user will select 3 different options for each from the database then whatever the user will select must appear in a table. For example if user selects 111 for selection_id and 222 for fixture_id then Jesty for name it should appear as 111 222 Jesty in a table. For now I have only the drop downs that retrieve information from a data base then display dop downs.... Wat I need a way to display user selection, or javascript that will print to the user what he selected

Here is my 3 dropdown list 

require "config.php"; //Database connection
    $resource_selections = mysql_query("SELECT DISTINCT selection_id FROM selections ORDER BY selection_id ASC");
    $selections = array();
    while($row = mysql_fetch_row($resource_selections)){
        $selections[] = $row[0];    
    } 
    $resource_fixtures = mysql_query("SELECT DISTINCT fixture_id FROM selections ORDER BY selection_id ASC"); 
    $fixtures = array();
    while($row = mysql_fetch_row($resource_fixtures)){
        $fixtures[] = $row[0];
    } 
    $resource_names   = mysql_query("SELECT DISTINCT name FROM selections ORDER BY selection_id ASC");    
    $names = array();
    while($row = mysql_fetch_row($resource_names)){
        $names[] = $row[0];
    }
    if(count($selections) <= 0 || count($fixtures) <= 0 || count($names) <= 0){
        echo 'No results have been found.';
    } else {

        // Display form
        echo '<form name="form" method="post" action="selection.php">';

        //SelectionID dropdown:
        echo "<select name='selection_id' id='selections' >"; 
        foreach($selections as $selection) echo "<option id='$selection'>$selection</option>";
        echo '</select>';

        //FixtureID dropdown
        echo "<select name='fixture_id' id='fixtures' >"; 
        foreach($fixtures as $fixture) echo "<option id='$fixture'>$fixture</option>";
        echo '</select>';

        //Name dropdown
        echo "<select name='name' id='names' >"; 
        foreach($names as $name) echo "<option id='$name'>$name</option>";
        echo '</select>';

        echo "<input type='submit' name='submit' value='Submit' />";




        echo '</form>';



    }


    ?>

Upvotes: 4

Views: 562

Answers (2)

sAnS
sAnS

Reputation: 1163

You may try like this

    <script type="text/javascript">

    function mergeval(val,flag)
    {
      if(flag==1)
      document.getElementById('mvalue1').innerHTML = val ;
      else if(flag==2)
      document.getElementById('mvalue2').innerHTML = val;
      else if(flag==3)
      document.getElementById('mvalue3').innerHTML = val;
    }

    </script>
<?php
session_start();
$_SESSION['values']=!empty($_SESSION['values']) ? $_SESSION['values']:array();
if(!empty($_REQUEST['selection_id'])&&!empty($_REQUEST['fixture_id'])&&!empty($_REQUEST['name']))
{
 $_SESSION['values'][] = array('id'=>$_REQUEST['selection_id'],'fid'=>$_REQUEST['fixture_id'],'name'=>$_REQUEST['name']);
}
$dispval ="<table>";

foreach(@$_SESSION['values'] as $key=>$val)
{

$dispval .="<tr><td>".$val['id']."&nbsp;".$val['fid']."&nbsp;".$val['name']."</td></tr>";

}
$dispval .="</table>";
echo $dispval;

?>
    <?php
    require "config.php"; //Database connection
        $resource_selections = mysql_query("SELECT DISTINCT selection_id FROM selections ORDER BY selection_id ASC");
        $selections = array();
        while($row = mysql_fetch_row($resource_selections)){
            $selections[] = $row[0];    
        } 
        $resource_fixtures = mysql_query("SELECT DISTINCT fixture_id FROM selections ORDER BY selection_id ASC"); 
        $fixtures = array();
        while($row = mysql_fetch_row($resource_fixtures)){
            $fixtures[] = $row[0];
        } 
        $resource_names   = mysql_query("SELECT DISTINCT name FROM selections ORDER BY selection_id ASC");    
        $names = array();
        while($row = mysql_fetch_row($resource_names)){
            $names[] = $row[0];
        }
        if(count($selections) <= 0 || count($fixtures) <= 0 || count($names) <= 0){
            echo 'No results have been found.';
        } else {

            // Display form
            echo '<form name="form" method="post" action="selection.php">';

            //SelectionID dropdown:
            echo "<select name='selection_id' id='selections' onchange='javascript:mergeval(this.value,1)'>"; 
            foreach($selections as $selection) echo "<option id='$selection'>$selection</option>";
            echo '</select>';

            //FixtureID dropdown
            echo "<select name='fixture_id' id='fixtures' onchange='javascript:mergeval(this.value,2)' >"; 
            foreach($fixtures as $fixture) echo "<option id='$fixture'>$fixture</option>";
            echo '</select>';

            //Name dropdown
            echo "<select name='name' id='names' onchange='javascript:mergeval(this.value,3)'>"; 
            foreach($names as $name) echo "<option id='$name'>$name</option>";
            echo '</select>';

            echo "<input type='submit' name='submit' value='Submit' />";




            echo '</form>';



        }


        ?>
    <table>
    <tr><td >&nbsp;<span id="mvalue1"></span>&nbsp;<span id="mvalue2"></span>&nbsp;<span id="mvalue3"></span></td></tr>
    </table>

Upvotes: 1

Kashyap
Kashyap

Reputation: 391

you can achieve it using jquery functions, im pasting code for you. Here is a script:

     <script language="JavaScript" type="text/javascript">
     $(document).ready(function(){
         $(".testval1").live('change',function(){
         var x = $(this).val();
         if(x!='')
         {
            $(".displaydata").append("<td>"+x+"</td>");
         }
         });
     });
    </script>

here is html

 <body>
 <form>
    <select name='testval1' class='testval1'>
       <option value=''>select data</option>
       <option value="110">110</option>
       <option value="111">111</option>
    </select>
  <select name='testval2' class='testval1'>
      <option value=''>select data</option>
      <option value="2223">2223</option>
      <option value="222">222</option>
  </select>
  <select name='testval3' class='testval1'>
      <option value=''>select data</option>
      <option value="Jestysd">Jestysd</option>
      <option value="Jesty">Jesty</option>
  </select>
  <table class="displaydata">
  </table>
  </form>

you need to add jquery-1.9.1.min.js for this.. all the best

Upvotes: 0

Related Questions