0

ajaxを使用していくつかの変数をphpページに送信し、それらをdivに表示しようとしていますが、機能していません。

HTMLコード：

<div id="center">
    <form>                                  
        <input type="text" id="toSearch" class="inputText" title="Search for ...">              
        <select name="thelist1" id="ecoElem" class="comboBox">
            <option>-- Ecosystem Element --</option>
        </select> 
        <select name="thelist2" id="ecoActor" class="comboBox">                         
            <option>-- Ecosystem Actor --</option>
        </select>   
        <input type="button" value="Search" id="searchButton" onclick="loadData();">
    </form>        
</div>
 <div id="resBox">
    </div>

loadData関数：

function loadData(){
            if(window.XMLHttpRequest){
                xmlhttp = new XMLHttpRequest();
            }
            else{
                xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
            }

            searchT = document.getElementById('toSearch').value;
            ecoElem = document.getElementById('ecoElem').value;
            ecoActor = document.getElementById('ecoActor').value;

            xmlhttp.onreadystatechange = function(){
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200){
                    document.getElementById('resBox').innerHTML = xmlhttp.responseText;
                }
            }

            xmlhttp.open("POST","databaseRead.php",true);
            xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
            xmlhttp.send("text=" + searchT + "&elem=" + ecoElem + "&actor=" + ecoActor);}

そして最後にphpページ：

<?php   
$searchT = $_POST['text'];
$ecoElem = $_POST['elem'];
$ecoActor = $_POST['actor'];
echo $searchT;
?>

それだけです、私はこれに数時間取り組んできましたが、それでもそれを理解することはできません。

4

2 に答える 2

0

JQuery を使用することもできます。

function loadData(){   
     var searchT = $('#toSearch').val(); 
     var toSearch = $('#ecoActor ').val();    
     var ecoActor = $('#ecoActor').val();
     $.post("databaseRead.php"),{ text:searchT, elem:toSearch, actor:ecoActor },
          function(data){
          $('#resBox').html(data);
     });
}
于 2012-06-13T17:50:56.623 に答える
0

onclickがfalseを返すようにボタンを変更してみてください（フォームを送信している場合）...

<input type="button" value="Search" id="searchButton" onclick="loadData();return false;">

また、テキスト ボックスの値を URL エンコードすることもできます。そうしないと、誰かが = または & を入力すると、すべてが台無しになります...

xmlhttp.send("text=" + encodeURIComponent(searchT) + "&elem=" + + encodeURIComponent(ecoElem) + "&actor=" + + encodeURIComponent(ecoActor));}
于 2012-06-13T14:23:29.487 に答える