使用下拉菜单查询mysql

时间:2013-05-23 03:32:24

标签: php html mysql

初学者;我搜索了很多例子,仍然需要一些帮助。 我希望用户从下拉框中选择一个选项,该选项将在mysql中查询表。我不明白如何(在我的html文件中)显示getprojectstatus.php中的select语句。

<html>
<head>
    <title>Status Dashboard</title>
</head>

<body style="background:#19245e url('images/fade.png')repeat-x;font-size:12px;font-family: Arial;line-height:18px;color:#FFFFFF;">
    <script>
        function displayProject(option)
            {
            var x;
            if (option=='sciplay')
            {                        
             x="show Sciplay selected, show notes, status, etc..."
            }

            else if (option=='oklahoma')
            {
             x="show OK selected, show..."
            }

            else if (option=='northdakota')
            {
             x="show North Dakota selected, show..."
            }

            else if (option=='audit')
            {
             x="show Audit selected, show..."
            }

            else if (option=='sggaming')
            {                           
             x="show SG Gaming selected, show..."
            }

            else if (option=='all')
            {
             x="..."//(option=(1+2+3+4+5))
            }
            document.getElementById("demo").innerHTML=x;
            }

    </script>

    <div align="center">
        <TABLE BORDER="1">
        <TR>
            <TD><img src='images/header.png'/>
            </TD>
        </TR>

        <TR>
            <TD>
                <TABLE BORDER="0" bgcolor="C0C0C0" align="left">
                    <TH>Projects
                    </TH>
                    <TR>
                        <TD>
                            <FORM action="getprojectstatus.php" method="post">
                                <SELECT onload="displayProject(this.value);" onchange="displayProject(this.value);">
                                    <OPTION VALUE='all'>ALL</OPTION>
                                    <OPTION VALUE='sciplay'>Sciplay</OPTION>
                                    <OPTION VALUE='oklahoma'>Oklahoma</OPTION>
                                    <OPTION VALUE='northdakota'>North Dakota</OPTION>
                                    <OPTION VALUE='audit'>Audit SSAE16</OPTION>
                                    <OPTION VALUE='sggaming'>SG Gaming</OPTION>
                                </SELECT>
                            </FORM>
                        </TD>
                    </TR>

                </TABLE>
            </TD>
        </TR>

        <TR>
            <TD>
                <p id="demo">
                </p>
            </TD>
        </TR>

        </TABLE>

    </div>
</body>

和我的getprojectstatus.php文件:

<?php
//create connection variables
$host=`localhost`;
$user=`dashboard`;
$pw=`password`;
$db=`status`;
//create connection
$con=mysqli_connect("$host", "$user", "$pw", "$db");
//check connection
if (mysqli_connect_errno($con))
{
 echo "Failed to connect to MySQL: " . mysqli_connect_error();
}

//take input from form and store as var queries
$option= $_POST['option'];

if ($option == 'sciplay')
{
 $queries = "SELECT * FROM status where project=1"
}

else if ($option == 'oklahoma')
{
 $queries = "SELECT * FROM status where project=2"
}

else if ($option == 'northdakota')
{
 $queries = "SELECT * FROM status where project=3"
}

else if ($option == 'audit')
{
 $queries = "SELECT * FROM status where project=4"
}

else if ($option == 'sggaming')
{
 $queries = "SELECT * FROM status where project=5"
}

else ($option == 'all')
{
 $queries = "SELECT * FROM status"
}

//store query as var result
$queries=$query;
$result=@mysqli_query($con,"$query");
//echo var result in table format
echo "<table border='1'>
<tr>
<th>Project</th>
<th>Subject</th>
<th>Status</th>
</tr>";

while($row = mysqli_fetch_array($result))
{
echo "<tr>";
echo "<td>" . $row['project'] . "</td>";
echo "<td>" . $row['subject'] . "</td>";
echo "<td>" . $row['entry'] . "</td>";
echo "</tr>";
}
echo "</table>";
//close mysql connection
mysqli_close($con);
?>

提前感谢您的帮助!

2 个答案:

答案 0 :(得分:2)

好的,所以看起来你还没有完全掌握基于网络的系统中使用的客户端/服务器模型(我们一开始都在那里)。

这是一个快速的纲要,然后我们将讨论你的问题在哪里。

  1. 您打开浏览器并输入网址,然后按Enter键
  2. 您的浏览器向托管您输入的网址的服务器发送请求
  3. 服务器解析请求并加载请求的特定文件。出于我们的目的,这意味着运行PHP文件以最终生成HTML和javascript输出
  4. 它将此HTML(和javascript)发送到浏览器。没有可执行的PHP发送到浏览器,它都保留在服务器上。
  5. 您的浏览器会收到此HTML(和javascript)并显示它。
  6. 您的浏览器可以在页面上执行任何javascript,但如果它需要页面源中尚未包含的信息,则必须从服务器请求。它可以通过以下两种方式之一完成:a)您可以向服务器发送一个全新的请求,使用正确的参数,以便预先包含您想要的信息或b)您可以运行ajax请求来提取您的信息需要,然后将其插入您的页面
  7. 所以,乍一看,看起来在第5步和第6步之间发生故障,你已经在浏览器中加载了整个页面,它需要更多信息来自服务器但是你从来没有真正将该请求发送到服务器。如果您 将该请求发送到服务器(通过向表单添加提交按钮,或向您的displayProject()函数添加表单提交请求),那么您就没有了(目前)将新信息插入现有页面的方式。

    因此,您的问题有两个可能的答案:

    如果您想更好地了解如何编写PHP应用程序,因为您打算在将来执行更多此操作:

    ...然后你应该将这两个单独的文件重写为一个单独的文件。 (我已经完全删除了你的代码,我还没有任何检查错误)

    <?php
    //create connection variables
    $host=`localhost`;
    $user=`dashboard`;
    $pw=`password`;
    $db=`status`;
    //create connection
    $con=mysqli_connect("$host", "$user", "$pw", "$db");
    //check connection
    if (mysqli_connect_errno($con))
    {
        echo "Failed to connect to MySQL: " . mysqli_connect_error();
    }
    
    //take input from form and store as var queries
    $option= $_POST['option'];
    
    if ($option == 'sciplay')
    {
        $queries = "SELECT * FROM status where project=1"
    }
    
    else if ($option == 'oklahoma')
    {
        $queries = "SELECT * FROM status where project=2"
    }
    
    else if ($option == 'northdakota')
    {
        $queries = "SELECT * FROM status where project=3"
    }
    
    else if ($option == 'audit')
    {
        $queries = "SELECT * FROM status where project=4"
    }
    
    else if ($option == 'sggaming')
    {
        $queries = "SELECT * FROM status where project=5"
    }
    
    else ($option == 'all')
    {
        $queries = "SELECT * FROM status"
    }
    
    //store query as var result
    $queries=$query;
    $result=@mysqli_query($con,"$query");
    
    //The actual echo of the table display was moved to the area of the page it actually needs to go
    
    //close mysql connection
    mysqli_close($con);
    ?>
    <html>
    <head>
        <title>Status Dashboard</title>
    </head>
    
    <body style="background:#19245e url('images/fade.png')repeat-x;font-size:12px;font-family: Arial;line-height:18px;color:#FFFFFF;">
        <script>
        function displayProject(option)
            {
            var x;
            if (option=='sciplay')
            {                        
             x="show Sciplay selected, show notes, status, etc..."
            }
    
            else if (option=='oklahoma')
            {
             x="show OK selected, show..."
            }
    
            else if (option=='northdakota')
            {
             x="show North Dakota selected, show..."
            }
    
            else if (option=='audit')
            {
             x="show Audit selected, show..."
            }
    
            else if (option=='sggaming')
            {                           
             x="show SG Gaming selected, show..."
            }
    
            else if (option=='all')
            {
             x="..."//(option=(1+2+3+4+5))
            }
            document.getElementById("demo").innerHTML=x;
            }
    
        </script>
    
        <div align="center">
            <TABLE BORDER="1">
            <TR>
                <TD><img src='images/header.png'/>
                </TD>
            </TR>
    
            <TR>
                <TD>
                    <TABLE BORDER="0" bgcolor="C0C0C0" align="left">
                        <TH>Projects
                        </TH>
                        <TR>
                            <TD>
                                <!--
                                SOME CHANGES HERE: The form action is now pointing
                                to this same file, so that when you submit your form,
                                it goes back to this same file.
                                Also, I gave your select tag a "name" attribute so
                                that when you submit it, it'll actually be accessible
                                in the $_POST['option'] variable 
                                -->
                                <FORM action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">
                                    <SELECT name="option" onload="displayProject(this.value);" onchange="displayProject(this.value);">
                                        <OPTION VALUE='all'>ALL</OPTION>
                                        <OPTION VALUE='sciplay'>Sciplay</OPTION>
                                        <OPTION VALUE='oklahoma'>Oklahoma</OPTION>
                                        <OPTION VALUE='northdakota'>North Dakota</OPTION>
                                        <OPTION VALUE='audit'>Audit SSAE16</OPTION>
                                        <OPTION VALUE='sggaming'>SG Gaming</OPTION>
                                    </SELECT>
                                    <input type="submit" value="Reload Form">
                                </FORM>
                            </TD>
                        </TR>
    
                    </TABLE>
                </TD>
            </TR>
    
            <TR>
                <TD>
                    <!-- a <p> tag can't technically hold a <table> tag, but one thing at a time here -->
                    <p id="demo">
                        <?php
                        // I'm just lifting your structure out and placing it here for clarity purposes.
                        // really, you can just write these tags out in HTML directly,
                        // not go into PHP and echo them
                        echo "<table border='1'>
                            <tr>
                                <th>Project</th>
                                <th>Subject</th>
                                <th>Status</th>
                            </tr>";
    
                        while($row = mysqli_fetch_array($result))
                        {
                            echo "<tr>";
                            echo "<td>" . $row['project'] . "</td>";
                            echo "<td>" . $row['subject'] . "</td>";
                            echo "<td>" . $row['entry'] . "</td>";
                            echo "</tr>";
                        }
                        echo "</table>";
                        ?>
                    </p>
                </TD>
            </TR>
    
            </TABLE>
    
        </div>
    </body>
    

    ...所以,这里发生的事情是我已经改变它以便在同一个文件中使用构建数据。您的页面现在不需要来请求新信息,它就在那里,如果您想更改表单,那么您提交并再次请求整个页面,现在使用新信息。

    这一切都很好,但可能不完全是您希望页面如何工作的。也就是说,您应该了解该过程的功能,因为任何甚至基本复杂的PHP应用程序都需要至少部分地以这种方式工作。

    现在... 如果您只是希望此页面按照您希望的方式运行,即构建您的页面,然后请求新信息以在表单请求上更新您的页面:

    ...然后我们可以完成这件事。我再次没有检查错误。不过,首先要把它放在<head>标签中:

    <head>
        <title>Status Dashboard</title>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
    </head>
    

    ...我们将使用jquery,因为在我们的例子中,让我们只是担心运行ajax请求而不是费心设置所有必要的细节。然后你想将它添加到你的displayProject函数中(就在结束之前):

    $.ajax({
        url: 'getprojectstatus.php',
        type: 'post',
        data: 'option='+option,
        success: function(data) {
            $('#demo').html(data);
        }
    });
    

    ...所有正在发生的事情是你将你的“选项”选择发送到getprojectstatus.php,该文件正在为你的表生成HTML输出,然后一旦收到它,它就会运行“成功”,它只是将数据直接插入到具有“demo”id属性的元素中。您应该考虑将其更改为<div>,因为<p>可能会导致令人头疼。

答案 1 :(得分:0)

我不确定我是否正确理解了这个问题,但这可能对您有用:

<FORM action="getprojectstatus.php" method="post">
 <SELECT onload="displayProject(this.value);" onchange="displayProject(this.value);">
  <OPTION VALUE='none'>ALL</OPTION>
  <OPTION VALUE='1'>Sciplay</OPTION>
  <OPTION VALUE='2'>Oklahoma</OPTION>
  <OPTION VALUE='3'>North Dakota</OPTION>
  <OPTION VALUE='4'>Audit SSAE16</OPTION>
  <OPTION VALUE='5'>SG Gaming</OPTION>
 </SELECT>
</FORM>

然后在你的PHP文件中:

$option= $_POST['option'];

$queries = "SELECT * FROM status"
if ($option != 'none'){
 $queries = "SELECT * FROM status where project=".$option
}

我还建议研究一些PHP框架,可能是CodeIgniter并学习MVC模式。