1

JavaScriptの初心者ですが、ユーザーがクライアント側で行ったことを反映するJavaScript変数（配列）を取得し、送信時にPHPサーバーページに投稿する必要があります。

これをフォームの非表示フィールドに値として含めて、php ページに投稿することをお勧めします。ただし、JS 変数はユーザーによって動的に作成されるため、ページを更新する関数を呼び出さない限り、フォームに含めるページに書き込むことはできません。2 回のページ更新を避けるために、submit 関数でデータを取得し、同時にそれを php スクリプトに投稿することをお勧めします。私が正しく理解している場合、AJAXは必要ありません。送信時にページを一度リロードしても問題ないからです。2回リロードしたくないだけです。

以下は、Andrew によって提案された関数を使用して、js 変数と投稿を設定します。フォーム内の他の隠し変数を取得するとフォームが投稿されますが、おそらく変数の命名に誤りがあるため、js によって設定された変数を取得できません。

  <html>
     <head>
    <style type="text/css">
        select
        {
            width:100px;
        }
    </style>
    <script type="text/Javascript">
        function moveToRightOrLeft(side)
        {
            if (side == 1)
            {
                var list1 = document.getElementById('selectLeft');
                var list2 = document.getElementById('selectRight');
            }
            else
            {
                var list1 = document.getElementById('selectRight');
                var list2 = document.getElementById('selectLeft');
            }

            if (list1.options.length == 0)
            {
                alert('The list is empty');
                return false;
            }
            else
            {
                var selectedItem = list1.options[list1.selectedIndex];
                move(list2, selectedItem.value, selectedItem.text);
                list1.remove(list1.selectedIndex);
                if (list1.options.length > 0)
                    list1.options[0].selected = true;
            }
            return true;
        }

        function move(listBoxTo, optionValue, optionDisplayText)
        {
            var newOption = document.createElement("option");
            newOption.value = optionValue;
            newOption.text = optionDisplayText;
            listBoxTo.add(newOption, null);
            return true;
        }

        function postData(listBoxID)
        {
            var options = document.getElementById(listBoxID).options;
            for (var i = 0; i < options.length; i++) 
            window.location = "posttoserver.php?data="+options[i].value;

        }

        function setTheValue(val) {
    var options = document.getElementById(listBoxID).options;
    var form = document.forms['myForm'];
    hiddenField = oFormObject.elements["data"];
    hiddenField.value = "val";
}
    </script>
    </head>
    <body>
    <select id="selectLeft" multiple="multiple">
        <option value="1">Value 1</option>
        <option value="2">Value 2</option>
        <option value="3">Value 3</option>
    </select>
    <button onclick="moveToRightOrLeft(2)">&lt;</button>
    <button onclick="moveToRightOrLeft(1)">&gt;</button>
    <select id="selectRight" multiple="multiple">
    </select>
    <form id="myForm" action="getdata.php" method="get">
    <input type="hidden" name="data" />
    <input type="hidden" name="mode" value="savedit">
    <button onclick="setTheValue(options)">Submit Data</button>
</form>
     </body>
     </html>

もう一方の端には、getdata.php があります。

<?php
$mode = $_REQUEST['mode'];
$option = $_REQUEST['data'];
echo $mode;
echo $option;
print_r ($option);;
?>
4

3 に答える 3

1

最終的に数日後にdocument.getElementById（'varname'）。valueで解決しました。私のような初心者の場合、document.getElementByIdは、あなたが思うかもしれないように単にデータを取得するだけではなく、ほとんどのドキュメントで言及されています。また、データを設定します。

重要なのは、ステートメントを逆方向に記述し、（値を取得するために行う必要があるように）設定する要素にid==を挿入することです。

var test = document.getElementById（'text'）;と書くと あるフィールドにid="text"を入力すると、テキストの値が取得されます。それは通常のドキュメントが言及していることです。ただし、次のように記述した場合：

document.getElementById（'varname'）。value = "dog" id=varnameを含む要素に"dog"を挿入します。

それは経験豊富な人には明らかかもしれませんが、確かに私を混乱させました。

次のコードが機能します。 

<html>
<head>
<script>

 function Post(data)
        { 
            document.getElementById('varname').value = data

        }
</script>
</head>
<body>
<form action = "" method="get">
<input id="varname" type="hidden" name="d">
<button onclick="Post('dog')">Post to Server</button>
</form>
</body>
</html>
于 2012-04-29T12:16:44.117 に答える
0

空の非表示フィールドを使用して通常行うのと同じように、先に進んでフォームを作成できます。

<form id="myForm" action="posttoserver.php" method="get">
    <input type="hidden" name="data" />
    ...
    <input type="submit" value="Submit" />
</form>

また、JavaScript関数を使用して、非表示フィールドの値を設定できます。

function setTheValue(val) {
    var form = document.forms['myForm'];
    hiddenField = oFormObject.elements["data"];
    hiddenField.value = "val";
}

次に、ボタンがクリックされたときなどに関数setTheValue（val）を呼び出すことができます。これがお役に立てば幸いです。

于 2012-04-27T18:19:21.630 に答える
0

jQuery は実際にこれを非常に簡単にします。あなたは正しい考えを持っていますが、window.location を使用するとページが変更されます。あなたがしようとしているのは、現在のページに留まっている間に、別の URL への非同期リクエストを行うことです。

http://api.jquery.com/jQuery.ajax/

于 2012-04-27T18:22:58.767 に答える