使用ajax提交表单，以便页面不会重新加载而不会更改数据

Question

var eweb_ip = "<% GetSetting("ip_address"); %>";    
var eweb_write = "http://" + eweb_ip + "/rokform/WriteLogixTags";
var datastring = $("#contactForm").serialize();
$('form').on('submit', function(e) {
    alert("inside submit function");
    e.preventDefault();
    alert("prevented default");
    $.ajax({
        type: 'post',
        url: eweb_write,
        data: datastring,
        dataType: "html",
        success: function() {
            alert('form was submitted');
        },
        error: function() {
            alert('error handing here');
        }
    });

});

这是显示成功警告框，但没有更改写入服务器。

Answer 1

Protip：使用Google Chrome（或Firefox）网络标签，然后选择XHR以查看是否正在向服务器发送请求并检查服务器的响应。

Answer 2

如果您使用的是JSP：

scriptlet（您在代码中编写的内容）执行在<% %>标记之间编写的java代码。你可以在那里写一些逻辑。

如果要在JSP中使用java值，您需要的是JSP表达式，您可以在<%= %>标记之间编写。那里禁止使用半冒号。

例如：

<%
    String eweb_ip = "192.168.1.1";  // JSP scriptlet
%>
...
<script type="text/javascript">
    var eweb_ip_js = "<%= eweb_ip %>"; // JSP expression
    ...
</script>

所以对于你的问题，你可以试试这个：

var eweb_ip = "<%= GetSetting('ip_address') %>";

有关更多信息，请转到：http://docs.oracle.com/javaee/5/tutorial/doc/bnaou.html

但是，如果您的表单已正确提交但仍然没有您想要的服务器端，那么您可能需要调试服务器代码。您的表单可能不包含您想要的内容，因此console.log(datastring);之类的内容可能会帮助您解决问题。

此外，它可能仅适用于您执行此操作的示例，但$('form').on('submit',将适用于每个表单，因此以后可能会出现问题。

Answer 3

布兰登，

我今天一直在研究同样的问题，碰巧偶然发现了你的问题。我也试图通过EWEB将数据写入PLC，而无需提交表单和重定向。假设基于XMLHttpRequest的解决方案适合您，我已成功测试了此代码：

function EWEBWrite(tagNameInp) {
    var formData = "numtags=1&t_1_slot=0&t_1_changed=1&t_1_value=1&t_1_tagname=" + tagNameInp + "&t_1_type=BOOL&t_1_display=Decimal";
    var srvWrt = new XMLHttpRequest();
    srvWrt.open("POST","/rokform/WriteLogixTags",false);
    srvWrt.send(formData);
    return
}

请记住，EWEB有关于可以写入哪种数据类型的特定规则。我认为至少它们必须都是原子的。如果您在表单提交方法上查看EWEB手册，您应该能够获得所有必需的数据（类型，显示等）。如果您有任何问题，请告诉我。