根据选择框中的选择显示文本

问题描述:

How can I run a PHP query which only runs when an option is chosen from a select dropdown but also which refreshes each time a different option is chosen?

For example, here is the HTML:

<html>
<head>
<script type="text/javascript" src="/hr/includes/jui/js/jquery-ui-1.8.20.min.js"</script>
<script>
$(document).ready(function() {
    $('#select_box_1').change(function() {
       if($(this).val() != '')
        $.ajax({
            type: 'get',
            url: 'balance1.php',
            data: 'value' + $(this).val() ,
            success: function(data) {
                $("#result-div").html(data);
            }
        });
     }
    });
});
</script>
</head>

<body>

<form name="form" id="form" method="post" action="validate.php">

<div id="select_box_1">
<select name="drop_down">
<option value="">Please choose</option>
<option value="1">John</option>
<option value="2">Bob</option>
<option value="3">Mike</option>
</select>
</div>

<div id="result-div">

</div>

<input type="submit">

</form>

</body>

</html>

balance1.php

<?php 
print "GET Value:".$_GET['value'];
?>

I would like to run a query below the select box depending on the value chosen - for example, when nothing is chosen there is no query ran. If the user chooses John from the list then the query runs where the id=1 and displays results for John. If the user then chooses Bob, the query should run again where the id=2 and so on?

如何运行PHP查询,该查询仅在从选择下拉列表中选择一个选项时运行,但同时刷新每个选项 时间选择了不同的选项? p>

例如,这里是HTML: p>

 &lt; html&gt; 
&lt; head&gt; \  n&lt; script type =“text / javascript”src =“/ hr / includes / jui / js / jquery-ui-1.8.20.min.js”&lt; / script&gt; 
&lt; script&gt; 
 $(document)  .ready(function(){
 $('#select_box_1')。change(function(){
 if($(this).val()!='')
 $ .ajax({
 type  :'get',
 url:'balance1.php',
 data:'value'+ $(this).val(),
 success:function(data){
 $(“#result-div  “).html(数据); 
} 
}); 
} 
}); 
}); 
&lt; / script&gt; 
&lt; / head&gt; 
 
&lt; body&gt; 
  
&lt; form name =“form”id =“form”method =“post”action =“validate.php”&gt; 
 
&lt; div id =“select_box_1”&gt; 
&lt; select name =“drop_down”  &gt; 
&lt; option value =“”&gt;请选择&l  t; / option&gt; 
&lt; option value =“1”&gt; John&lt; / option&gt; 
&lt; option value =“2”&gt; Bob&lt; / option&gt; 
&lt; option value =“3”&gt; Mike&lt;  / option&gt; 
&lt; / select&gt; 
&lt; / div&gt; 
 
&lt; div id =“result-div”&gt; 
 
&lt; / div&gt; 
 
&lt; input type =“submit”&gt  ; 
 
&LT; /形式&GT; 
 
&LT; / BODY&GT; 
 
&LT; / HTML&GT; 
 代码>  PRE> 
 
 

balance1.php p> \ n

 &lt;?php 
print“GET Value:”。$ _ GET ['value']; 
?&gt; 
  code>  pre> 
 
 

我想在选择框下面运行一个查询,具体取决于所选的值 - 例如,当没有选择任何内容时,没有查询运行。 如果用户从列表中选择John,则查询将在id = 1的位置运行,并显示John的结果。 如果用户然后选择Bob,那么查询应该再次运行,其中id = 2,依此类推? p> div>

This is working:

[...]
<select name="drop_down" id="sel_something">
[...]

$('#sel_something').change(function() {
    if($(this).val() != '') {
        $.ajax({
            type: 'get',
            url: 'someurl',
            data: { 'value' : $(this).val() } ,
            success: function(data) {
                // do your stuff
            }
        });
    }
});

I gave an id to the select and modified the data line (and added a few syntax corrections).

Try something like this:

$("#select_box_1").change(function(){

    if ($(this).val() != "") {

      $.ajax({
         type: "POST",
         url: "foo.php",
         data: "id=" + $("#select_box_1").val(),
         success: function(msg){
           $("#result").text(msg);
         }
      });

    }

});

i suggest you to use jquery.ajax, which is way more powerful than you think mate ! below is the example code to make it working

$('#select_box_1').change(function() {
   if($(this).val() != '')
    $.ajax({
        type: 'get',
        url: 'URL To Your PHP Script',
        data: 'value' + $(this).val() ,
        success: function(data) {
            $("#result-div").html(data);
        }
    });
 }
});

EDIT : $_GET['value'] will hold the value in your php script, you can query database using that value and return your result or output to ajax call and then you can simply populate the data in your html view

If you are reloading the page everytime the value is changes in the dropdown, then you can use onchange attribute in your SELECT tag.

Reload the page when value is changed and set a GET variable in the URL. If this GET variable is NULL then do not process the PHP code ... else process accordingly.