0

ユーザー入力を受け入れる HTML フォームがあります。

<form action="script_conv.php" method="post">
Convert: <input type="number" name="input" id="input">
<select name="unit1" id="unit1">
<option value="w">Words</option>
<option value="l">Lines</option>
<option value="p">Pages</option>
<option value="r">Recorded Minutes</option>
<option value="f">Finished Minutes</option>
</select>
to
<select name="unit2" id="unit2">
<option value="w">Words</option>
<option value="l">Lines</option>
<option value="p">Pages</option>
<option value="r">Recorded Minutes</option>
<option value="f">Finished Minutes</option>
</select>
<input type="submit">
</form>

PHP スクリプトはユーザー データを取得し、いくつかの計算を実行します。

<?php
$input=$_POST["input"];
$unit1=$_POST["unit1"];
$unit2=$_POST["unit2"];

(bunch of if...else statements)

echo "<ul>";
echo "<li>$cat1f</li>";
echo "<li>$cat2f</li>";
echo "<li>$cat3f</li>";
echo "</ul>";
?>

これはすべて正常に機能しますが、もちろん、関数の結果は新しいページに返されます。関数の結果を同じページに追加したいと思います。これには AJAX/jQuery が必要になることはわかっていますが、試したことはありません。誰でも私にいくつかのガイダンスを与えることができますか?

とても有難い！

4

3 に答える 3

0

test.php(html) を試してください:-

<form method='post'>
Convert: <input type="number" name="input" id="input">
<select name="unit1" id="unit1">
<option value="w">Words</option>
<option value="l">Lines</option>
<option value="p">Pages</option>
<option value="r">Recorded Minutes</option>
<option value="f">Finished Minutes</option>
</select>
to
<select name="unit2" id="unit2">
<option value="w">Words</option>
<option value="l">Lines</option>
<option value="p">Pages</option>
<option value="r">Recorded Minutes</option>
<option value="f">Finished Minutes</option>
</select>
<input type="button" onclick="getvalue();">
</form>

test.php (スクリプト関数):-

<script src="http://localhost:8004/js/jquery-1.9.1.js"></script>
<script>
function getvalue() {
       var input= document.getElementById('input').value;
    var unit1=document.getElementById('unit1').value;
    var unit2=document.getElementById('unit2').value;

        $.ajax({
        type: "POST",
        url: "http://localhost:8004/test/test.php",
        data: { input: input,unit1:unit1, unit2:unit2,fun:'getvalue' }
        }).done(function( data ) 
        {
            alert(data);
        }); 
}

</script>

この (test.php) ファイルの上部にある php コード:-

<?php if(isset($_REQUEST['fun']) == 'getvalue') 
{
echo $_REQUEST['input'].$_REQUEST['unit1'].$_REQUEST['unit2'];
exit();
}
?>

終了する必要があります。そうしないと、このファイルのすべてのデータが表示されるため、php で実行するために php を使用する別の方法を使用します。

からアクションを削除<form method="post">し、同じページで応答を取得する

于 2013-05-13T05:18:52.377 に答える
0

これを試して：

$(function(){
    $('form').submit(function(e){
        e.preventDefault();

        $.post('/path/to/your/php', $(this).serialize(), function(response){
            // do something with the response
        });
    });
});
于 2013-05-13T04:43:48.870 に答える