如何使用文檔就緒功能從php中填充組合框？

這裏是php代碼。在這個代碼中，站名和id和隨機的乘客都被生成了。如何使用文檔就緒功能從php中填充組合框？

<?php 

include_once('RestUtils.php'); 
include_once('Passengers.php'); 

class Station implements JsonSerializable 
{ 
private $id; 
private $name; 
private $passengers; 

public function __construct($id, $name) 
{ 
    $this->setId($id); 
    $this->setName($name); 
    $this->passengers = array(); 
} 

//getters and setters 
public function jsonSerialize() 
{ 
    $data = array(); 
    $data['id'] = $this->id; 
    $data['name'] = $this->name; 
    $data['passengers'] = $this->passengers; 
    return $data; 
} 
} 

$stations = generateStations(); 

$data = RestUtils::processRequest(); 

switch($data->getMethod()) 
{ 
// Get item 
case 'get': 
    if(isset($data->getRequestVars()['stationId'])) 
    { 
     // Prepare information for a specific station 
     $station = getStationWithId($stations, $data->getRequestVars()  
['stationId']); 
     if($station != null) 
     { 
      echo RestUtils::sendResponse(200, json_encode($station),  
'application/json'); 
     } 
     else 
     { 
      echo RestUtils::sendResponse(404, 'Station not found!'); 
     } 
    } 
    else 
    { 
     // Prepare station list 
     echo RestUtils::sendResponse(200, json_encode($stations),  
    'application/json'); 
    } 

    break; 
    } 

function generateStations() 
{ 
$stations = array(); 
for($i = 1; $i <= 5; $i++) 
{ 
    $stations[] = new Station($i, 'İstasyon ' . $i); 

    $passengerIds = array(); 
    foreach(generatePassengers() as $j) 
    { 
     $passengerIds[] = $j->getId(); 
    } 
    $stations[$i - 1]->setPassengers($passengerIds); 
} 

return $stations; 
} 

function generatePassengers() 
{ 
$passengers = array(); 

$numberOfPassengers = rand(0, 20); 

for($i = 0; $i < $numberOfPassengers; $i++) 
{ 
    $from = rand(0, 5); 

    $to = rand(0, 5); 

    $arrivalTime = rand(0, 100); 

    $waitingTime = rand(0, 100); 

    $passengers[] = new Passenger($i, $from, $to, $arrivalTime, $waitingTime); 
} 

return $passengers; 
} 

function getStationWithId($stations, $id) 
{ 
foreach ($stations as $i) 
{ 
    if($i->getId() == $id) 
    { 
     return $i; 
    } 
} 

return null; 
} 

?>

我想，以填補所產生的站名和站ID的組合框網頁時使用的文件準備function.After，當用戶選擇用姓名和身份證一站，他可以看到有多少乘客裝是否在那個車站，乘客的ID也應該從Station.php返回。通常我在html代碼中有這個選擇選項，它只是顯示站點在選擇它們時沒有做任何事情。

<select name="selectStation" id="selectStation" ></select>

我試過以下;

 $(document).ready(function() { 
     $.getJSON("Stations.php", function(jsonData){ 

     $.each(jsonData, function(key,value) { 

     $('#selectStation') 
    .append($("<option></option>") 
    .attr("value",key) 
    .text(value)); 

}); 
});

}）;

我將組合框的值作爲Object Object.Why發生了什麼？根據Stations.php.Thanks，如何在頁面加載時填充組合框。任何回覆將不勝感激。

來源

2013-04-10 ntf

您有幾個基本選項。（1）在使用javascript從JSON填充列表之前，抓取所有需要的數據並創建一個包含數據的JSON表示的JavaScript元素。（2）使用php（3）輸出正確的選項已經加載了，在填充相關列表之前啓動一個將檢索所需數據的ajax調用。我會建議＃2，但我會不時使用＃1。 – enhzflep 2013-04-10 13:59:06

@enhzflep謝謝reply.I必須使用第三個選項，我必須使用文檔準備功能和ajax調用它，但我不知道如何：/ – ntf 2013-04-10 14:06:47

好的，這裏有一些示例代碼，將做我認爲你想要的。注意：您仍然需要添加事件偵聽器來處理選擇框的更改事件。我會把它留給你。

文件1：ajaxAfterLoad.html

<!DOCTYPE html> 
<html> 
<head> 
<script src="script/AjaxRequest.js"></script> 
<script> 
function byId(e){return document.getElementById(e);} 
function newEl(tag){return document.createElement(tag);} 
function newTxt(txt){return document.createTextNode(txt);} 


window.addEventListener('load', mInit, false); 

function mInit() 
{ 
    AjaxRequest.get({ 'url':'makeJSON.php', 'onSuccess': onAjaxRequestDone }); 
} 

function makeSelectElementFromJSON(elemId, jsonText) 
{ 
    var srcData = JSON.parse(jsonText); 
    var result = newEl('select'); 
    result.setAttribute('id', elemId); 
    var i, curOpt; 
    for (i=0; i<srcData.length; i++) 
    { 
     curOpt = newEl('option'); 
     curOpt.setAttribute('value', srcData[i].value); 
     curOpt.appendChild(newTxt(srcData[i].text)); 
     result.appendChild(curOpt); 
    } 
    return result; 
} 

function onAjaxRequestDone(req) 
{ 
    var span = newEl('span'); 
    span.innerHTML = req.responseText; 
    byId('rawOutput').innerHTML = req.responseText; 

    byId('ajaxOutput').appendChild(makeSelectElementFromJSON('jsonSelectBox1', req.responseText)); 
} 
</script> 
<style> 
</style> 
</head> 
<body> 
    <h2>Below will be loaded by ajax</h2> 
    <div id='rawOutput'></div> 
    <div id='ajaxOutput'></div> 
</body> 
</html>

文件2：makeJSON.php

<?php 

    $resultList = null; 

    for ($i=0; $i<10; $i++) 
    { 
     $curItem = null; 
     $curItem->value = $i; 
     $curItem->text = "Item " . ($i+1); 
     $resultList[] = $curItem; 
    } 
    printf("%s", json_encode($resultList)); 
?>

文件3：AjaxRequest.js 從http://ajaxtoolbox.com/request/source.php下載此文件

來源

2013-04-10 15:25:10 enhzflep

可以根據我的PHP代碼轉換php代碼？ – ntf 2013-04-10 17:29:29

是的，但我不會。如果你不能這樣做，你就不理解代碼，這使得它的功能副本本質上毫無價值。如果這是爲了學校/大學，目的就是學習。如果它是爲了生意，你提供多少美元？ _進一步的問題表明了嘗試和理解的願望將得到回答。 - - 另外，我不使用jQuery - 我沒有學習它，所以我可以做你的工作，除非$看起來足夠令人興奮。 – enhzflep 2013-04-10 17:38:50

Thanks.I將嘗試瞭解您的代碼。我是JavaScript新手，我必須努力學習。 – ntf 2013-04-10 17:46:07

如何使用文檔就緒功能從php中填充組合框？

回答

相關問題