Javascript / ajax将所有表单文本字段值传递给php但不是最后一个textfield值

时间:2014-04-07 05:03:02

标签: javascript php ajax

这是我的带有表单和javascript / ajax函数的html。所有文本字段值都传递给test.php。当我这样做时,如果我输入前三个文本字段,那么test.php将成功显示表单值。但另一方面,如果我填写所有四个文本域并发送,那么什么都不会发生。既然,我是编程新手,我无法解决这个问题。我会感谢这个问题的解决方案。

    #form.html

    <html>
    <SCRIPT language="javaScript">

    function sendData(){
                if (window.XMLHttpRequest){
                    xmlhttp = new XMLHttpRequest();
                    }
                else
                    {
                    xmlhttp = new ActiveXobject ('Mircosoft.XMLHTTP');
                    }

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

                var i=0;
                var arr = new Array();

                while ((document.getElementById(i).value)) {
                if ((document.getElementById(i).value)!=""){                
                    var activity = document.getElementById(i).value;            
                    arr[i] = activity;
                }           
                i++;
                }

                var params = 'activity='+JSON.stringify(arr);
                xmlhttp.open('POST','test.php', true);
                xmlhttp.setRequestHeader('Content-type','application/x-www-form-urlencoded');

                xmlhttp.send(params);
                document.getElementById("message").innerHTML = "Sending...";        
                }   

                </script>

    <form action="#" method="POST">
    <tr>Name1:<td> <input type="text" id="0"/> </td></tr><br>
    <tr>Name2:<td> <input type="text" id="1"/> </td></tr><br>
    <tr>Name3:<td> <input type="text" id="2"/> </td></tr><br>
    <tr>Name4:<td> <input type="text" id="3"/> </td></tr><br>
    <input type="button" value="Send" onclick="sendData()";/>
    </form>

     <div id="message">            
    </div>

    </html>

这是test.php文件,其中将显示表单值。

    #test.php
    <?php
    $activity = $_POST['activity'];
    $activity = json_decode($activity);

    if (is_array($activity)){
        foreach ($activity as $value){
            echo $value."<br>";
            }
        }
    else {
        echo "error";
    }
    ?>

1 个答案:

答案 0 :(得分:0)

问题在于

while ((document.getElementById(i).value)) {

i === 4之前一切正常,然后getElementById返回null,而null.value是一个错误,因此整个错误都会出错。

使用while循环并不是一个好主意,但这样的事情至少应该起作用

        while (document.getElementById(i)) {
            if ((document.getElementById(i).value) != "") {
                arr[i] = document.getElementById(i).value;
            }
            i++;
        }

按类,标记名或除数字ID之外的其他内容获取元素似乎更好

        var arr = new Array();
        var elems = document.querySelectorAll('.inputs'); // class

        for ( var i=0; i<elems.length; i++ ) {
            arr.push(elems[i].value)
        }