发送使用Ajax参数 [英] sending parameters with ajax

问题描述

我想送我从表中使用AJAX让我在JS​​P中其他JSP参数。 我现在用的是followinf函数来发送所有的值到JSP：当作ajaxForm，但我不知道为什么送我每次运行它​​失败：

下面是javascript函数：

 函数editarow（）{
    VAR XHR = getXhr（）;
    xhr.onreadystatechange =功能（）{
        如果（xhr.readyState == 4和＆安培; xhr.status == 200）{
            选择= xhr.responseText;
            //硒SERT日的innerHTML倒rajouter莱斯选项一拉清单当然
            。的document.getElementById（'prjsel）的innerHTML =选择;
        }
    };

    VAR行，firstNameCell，lastNameCell;
    无功表=的document.getElementById（表）;
    VAR键= table.getElementsByTagName（按钮）;
    对于（VAR I = 0; I＆LT; buttons.length;我++）{
        如果（按钮[我]。名称==编辑）{
            按钮[I] .onclick =功能（）{
                行= this.parentNode.parentNode;

                //第一个名称单元是第一个孩子
                NameCell1 = findElement（row.firstChild）;
                NameCell2 = findElement（NameCell1.nextSibling）;
                NameCell3 = findElement（NameCell2.nextSibling）;
                NameCell4 = findElement（NameCell3.nextSibling）;
                NameCell5 = findElement（NameCell4.nextSibling）;
                NameCell6 = findElement（NameCell5.nextSibling）;
                NameCell7 = findElement（NameCell6.nextSibling）;

                //`innerHTML`倒obtenir拉valeur
                / *警报（名1+ NameCell1.innerHTML）;
                警报（名2+ NameCell2.innerHTML）;
                警报（名3+ NameCell3.innerHTML）;
                警报（名4+ NameCell4.innerHTML）;
                警报（5名是+ NameCell5.innerHTML）;
                警报（名6为+ NameCell6.innerHTML）;
                警报（7名是+ NameCell7.innerHTML）; * /

            }
        }
    }

    xhr.open（POST，ajaxForm.jsp，真正的）;
    xhr.setRequestHeader（内容类型，应用程序/ x-WWW的形式urlen codeD'）;
    xhr.send("NameCell1="+NameCell1,"NameCell2="+NameCell2,"NameCell3="+NameCell3,"NameCell4="+NameCell4,"NameCell5="+NameCell5,"NameCell6="+NameCell6,"NameCell7="+NameCell7 ）;
}
 

在我从桌子我想送他们都值了 ajaxForm.jsp 。

解决方案

从最后一行：

<$p$p><$c$c>xhr.send("NameCell1="+NameCell1,"NameCell2="+NameCell2,"NameCell3="+NameCell3,"NameCell4="+NameCell4,"NameCell5="+NameCell5,"NameCell6="+NameCell6,"NameCell7="+NameCell7 ）;

这是不是来连接在JavaScript字符串的方式。

由于您使用JSP，你应该知道的Java和。你应该将字符串中的JavaScript以同样的方式，你会做在Java中：

  xhr.send（NameCell1 =+ NameCell1 +，NameCell2 =+ NameCell2 +等......）;
 

---

这是说，这应该不过有差错的JavaScript控制台。你有没有注意这个？总之，为了更好的JavaScript调试，我建议你抢萤火虫并为更简洁/不透明，更crossbrowser兼容的Ajax处理和HTML DOM穿越，我强烈建议你看看 jQuery的。与jQuery和 Ajax表格插件你本来准备只用下面几行：

  $（文件）。就绪（函数（）{
    $（'＃formId）。当作ajaxForm（函数（响应）{
        $（'＃prjsel'）的HTML（响应）;
    }）;
}）;
 

这样，您就不必担心浏览器的具体细节以及如何正确地发送请求。

I am trying to send parameters that I get from a table in my jsp to other JSP using ajax. I am using the followinf function to send all values to JSP: ajaxForm but I don't know why the send failed every time I run it:

Here is the javascript function:

function editarow() {
    var xhr = getXhr();
    xhr.onreadystatechange = function() {
        if (xhr.readyState == 4 && xhr.status == 200) {
            selects = xhr.responseText;
            // On se sert de innerHTML pour rajouter les options a la liste
            document.getElementById('prjsel').innerHTML = selects;
        }
    };

    var row, firstNameCell, lastNameCell;
    var table = document.getElementById("sheet");
    var buttons = table.getElementsByTagName("button");
    for (var i = 0; i < buttons.length; i++) {
        if (buttons[i].name == "edit") {
            buttons[i].onclick = function() {
                row = this.parentNode.parentNode;

                // The first name cell is the first child
                NameCell1 = findElement(row.firstChild);
                NameCell2 = findElement(NameCell1.nextSibling);
                NameCell3 = findElement(NameCell2.nextSibling);
                NameCell4 = findElement(NameCell3.nextSibling);
                NameCell5 = findElement(NameCell4.nextSibling);
                NameCell6 = findElement(NameCell5.nextSibling);
                NameCell7 = findElement(NameCell6.nextSibling);

                // `innerHTML` pour obtenir la valeur
                /*alert("name 1  is " + NameCell1.innerHTML);
                alert("name 2  is " + NameCell2.innerHTML);
                alert("name 3  is " + NameCell3.innerHTML);
                alert("name 4  is " + NameCell4.innerHTML);
                alert("name 5  is " + NameCell5.innerHTML);
                alert("name 6  is " + NameCell6.innerHTML);
                alert("name 7 is " + NameCell7.innerHTML);*/

            }
        }
    }

    xhr.open("POST", "ajaxForm.jsp", true);
    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    xhr.send("NameCell1="+NameCell1,"NameCell2="+NameCell2,"NameCell3="+NameCell3,"NameCell4="+NameCell4,"NameCell5="+NameCell5,"NameCell6="+NameCell6,"NameCell7="+NameCell7 );
}

After I get the value from the table I want to send all of them to the ajaxForm.jsp.

解决方案

From the last line:

xhr.send("NameCell1="+NameCell1,"NameCell2="+NameCell2,"NameCell3="+NameCell3,"NameCell4="+NameCell4,"NameCell5="+NameCell5,"NameCell6="+NameCell6,"NameCell7="+NameCell7 );

This isn't the way to concatenate a String in JavaScript.

Since you're using JSP, you should know Java as well. You should concatenate the String in JavaScript the same way as you would do in Java:

xhr.send("NameCell1=" + NameCell1 + ",NameCell2=" + NameCell2 + "etc...");

---

That said, this should however have errored in the JavaScript console. Did you pay attention to this? Anyway, for better JavaScript debugging I suggest you to grab Firebug and for less verbose/opaque and more crossbrowser compatible Ajax handling and HTML DOM traversal, I strongly recommend you to have a look at jQuery. With jQuery and the Ajax Form Plugin you would have been ready with only the following lines:

$(document).ready(function() {
    $('#formId').ajaxForm(function(response) {
        $('#prjsel').html(response);
    });
});

This way you don't need to worry about browser specific details and how to send the request properly.

这篇关于发送使用Ajax参数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！