只有当我点击选择框时,如何从数据库中获取刷新的选项值?

时间:2016-08-20 08:55:52

标签: javascript php

我想只在点击选择框时才从数据库中获取刷新的选项值。

假设两名服务员同时打开相同的订单面板页面。然后表格no:2在两个面板中都显示为免费。

现在服务员预订了表号:2。然后另一位服务员点击选择框时,他不会在选项中得到表:2。

<select name="table_id" class="form-control tablename">
<option disabled="disabled">Select Table</option>
<?php $result =  mysql_query("select * from rtable r
inner join table_status as ts 
on ts.status_id=r.status_id  
where ts.status!='Booked'
order by r.table_id desc")or die(mysql_error()); 
while ($row=mysql_fetch_array($result)){ ?>
<option value="<?php echo $row['table_id'];?>"><?php echo $row['table_name']; ?></option>
<?php } ?>
</select>

Select Table Image

table_status

rtable

3 个答案:

答案 0 :(得分:1)

在php中创建函数以生成选项(发送html不是很好的做法,但我正在调整此示例)。在这个特定的例子中,我建议创建 functions.php 文件,然后添加 printSelectOptions 函数声明:

function printSelectOptions(){

  $result =  mysql_query("select * from rtable r
  inner join table_status as ts 
  on ts.status_id=r.status_id  
  where ts.status!='Booked'
  order by r.table_id desc")or die(mysql_error()); 

  echo "<option disabled='disabled'>Select Table</option>";

  while ($row=mysql_fetch_array($result)){

    echo "<option value=".$row['table_id'].">".$row['table_name']."</option>";
  }

}

上面的函数打印所有选择的html选项。

在生成选择时使用它函数(请记住,使用printSelectOptions时,functions.php应该包含在任何文件中)

<?php
//db connection code
require_once("functions.php");//here we add our function to be available in this file

?>

<select name="table_id" class="form-control tablename">
<?php printSelectOptions() ?>
</select>

在前端绑定您的选择(javascript代码):

document.addEventListener("DOMContentLoaded", function(event) {

 var select=document.querySelector("select"); //this is pure selector gets first select on page

 //function sends ajax and refresh options of select
 function refreshOptions(){

     //send ajax request
     select.innerHTML="<option>Loading..</option>"; //loading info

     var xmlhttp=new XMLHttpRequest();
     xmlhttp.open("GET", 'yourSecondPHPScript.php');//here example url where we get updated options
     xmlhttp.onreadystatechange = function() {
         if (xmlhttp.readyState == XMLHttpRequest.DONE) {
             if(xmlhttp.status == 200){
                 select.innerHTML = xmlhttp.responseText;//set new options
             }else{
                 console.log('Error: ' + xmlhttp.statusText )
                 select.innerHTML="<option>Connection problem</option>";
             }
         }
     }
     xmlhttp.send();  

 };

 //bind our select
 select.addEventListener("focus",function(){

     refreshOptions();        

 });

});

最后创建示例 yourSecondPHPScript.php 并在其中使用函数:

 <?php
 //db connection code
 require_once("functions.php");//here we add our function to be available in this file

 printSelectOptions();//outputs options

为了确保用户除了检查焦点之外不会采用相同的表格,在一些订单提交中再次检查它。因此,如果表被刷新选择(通过使用refreshOptions()的ajax)并显示该表被采取的信息。

最后一件事是在服务器端保护它,在php(PHP CODE)中创建一些检查功能:

function tableCanBeTaken($optionId){

  //this code adds **and** to query with id to check but optionId should be validate before using in query

  $result =  mysql_query("select * from rtable r
  inner join table_status as ts 
  on ts.status_id=r.status_id  
  where ts.status!='Booked'
  and ts.table_id=$optionId ")or die(mysql_error()); 


  return mysql_fetch_array($result); //if row exists - will be false if not exists row with table_id==$optionId and not booked

  }

}

然后使用它(PHP代码):

if (tableCanBeTaken($youOptionId)){

    //here code for taking option

}else{

    //here option is taken

}

答案 1 :(得分:0)

在选择框的焦点事件中调用ajax。在调用成功时,将数据(可用表)附加到选择输入。然后,将选择框选项保留为“正在加载”。希望这有帮助!

答案 2 :(得分:0)

@Maciej Sikora

问题得到解决。无法从另一个文件(如yourSecondPHPScript)调用printSelectOptions()函数。 并且还需要从url中删除反斜杠。

<?xml version="1.0" encoding="utf-8"?>
...
<uses-permission android:name="android.permission.NFC" />
<uses-feature
    android:name="android.hardware.nfc"
    android:required="true" />
...
<activity 
        android:name=".nfc.ui.NfcActivity"
        android:launchMode="singleTop">
        <intent-filter>
            <action android:name="android.nfc.action.NDEF_DISCOVERED"/>
            <category android:name="android.intent.category.DEFAULT"/>
            <data android:mimeType="text/plain"/>
        </intent-filter>
    </activity>
...

我只需将相同的代码粘贴到yourSecondPHPScript.php中,如下所示

xmlhttp.open("GET", 'yourSecondPHPScript.php');