选项

时间:2016-08-30 05:29:17

标签: php mysql html5

我一直在努力解决这个问题,作为最后的手段,我在这里寻求帮助。 我正在使用选项标签来显示4个选项。当我选择一个选项时,它会加载一个.php文件。我的代码不是太优雅,但它确实有用。

<select name="history" class="button">
<option value="1" selected>Today</option>
<option value="2">Yesterday</option>
<option value="3">This Month</option>
<option value="4">This Year</option>
</select>

<div id="txtHint"><b></b></div>
<script> 
   $('[name="history"]').on('change', function() {
   var ajaxMethod = "today.php";
   switch($(this).val())
   {
   case "1":
     ajaxMethod = "today.php";
     break;
   case "2":
     ajaxMethod = "yesterday.php";
     break;                
   case "3":
     ajaxMethod = "monthly.php";
     break;                
   case "4":
     ajaxMethod = "yearly.php";
     break;      
   }
   $("#txtHint b").load(ajaxMethod);
});
</script>

所有.php文件都有相同的表,但会生成不同的mysql查询。 当我刷新页面时,它会清除块,我必须再次选择一个选项。页面加载时是否可以将选项加载为默认值?否则我在做出选择之前有一个空块。 我尝试在块中使用表,并让每个文件只查询mysql,但这不起作用。 任何建议将不胜感激

为了完整性,我已经包含了today.php

<?php
    $result = mysqli_query($con, "
        SELECT  max(Tmax), min(Tmin), max(R)  
        FROM  alldata
        WHERE DATE(DateTime) = CURDATE()
        "
    );
    while ($row = mysqli_fetch_array($result)) {
      $maxTemp = $row['max(Tmax)'];
      $minTemp = $row['min(Tmin)'];
      $totalRain = $row['max(R)'];
    }
?>
   <table id="historical">
    <tr>
        <td>
        </td>
        <td>
            <?php echo 'Maximum'?>
        </td>
        <td>
            <?php echo 'Minimum'?>
        </td>       
     </tr>
     <tr>
        <td>
            <img src="images/temp.png">
        </td>
        <td>
            <?php echo $maxTemp." °C"?>
        </td>
        <td>
            <?php echo $minTemp." °C"?>
        </td>       
    </tr>
    <tr>
        <td>
            <img src="images/rain.png">
        </td>
        <td>
            <?php echo $totalRain." °C"?>
        </td>       
    </tr>
</table>

2 个答案:

答案 0 :(得分:0)

刷新页面时恢复所选选项..尝试

1.从DB中获取数据以在加载页面时选择默认选项。 (如果将选项值存储在DB中)。

  1. 或使用会话或cookie临时存储选定的数据。并选择默认选项w.r to session或cookie data。

答案 1 :(得分:0)

经过大量测试后,这是符合目的的代码。 它可能会帮助其他用户。

<select id="recordsSelector" class="button">
                                <option value="today" selected>
                                    <?php echo "Today"?>
                                </option>
                                <option value="yesterday">
                                    <?php echo "Yesterday"?>
                                </option>
                                <option value="thisMonth">
                                    <?php echo "This Month"?>
                                </option>
                                <option value="thisYear">
                                    <?php echo "This Year"?>
                                </option>
                            </select>


                <script type="text/javascript" src="js/jquery.js"></script>           
                <script>
                    stationData('<?php echo $defaultStats?>');
                    function stationData(period){
                        $(".records").html("");
                        if(period=="today"){
                            $("#almanacheading").html("Today");
                        }
                        if(period=="yesterday"){
                            $("#almanacheading").html("Yesterday");
                        }
                        if(period=="thisMonth"){
                            $("#almanacheading").html("This Month");
                        }
                        if(period=="thisYear"){
                            $("#almanacheading").html("This Year");
                        }
                        $.ajax({
                            url : "almanac.php?period="+period,
                            dataType : 'json',
                            success : function (json) {
                                $("#historyTMax").html(json['maxT']);
                                $("#historyTMin").html(json['minT']);

                                $("#historyHMax").html(json['maxH']);
                                $("#historyHMin").html(json['minH']);

                                $("#historyDMax").html(json['maxD']);
                                $("#historyDMin").html(json['minD']);

                                $("#historyPMax").html(json['maxP']);
                                $("#historyPMin").html(json['minP']);
                            },
                        });
                    }
                    $("#recordsSelector").change(function(){
                        period = $(this).val();
                        stationData(period);
                    });
                    $("#recordsSelector").val('<?php echo $defaultStats?>');    
                </script>