在JQuery中动态创建表单并使用JSON发布它

时间:2012-12-18 05:53:45

标签: jquery json xslt

我正在尝试在我的XSLT代码中动态创建campaignmonitor新闻稿订阅。

<script type="text/javascript"><xsl:text disable-output-escaping="yes"><![CDATA[

    $(function() {
        $('#submit').click(function() {
             if ($('#nlapproved').attr('checked')) {
                newsletter();
            }
        });

        function newsletter()
        {
            $form = $('<form action="http://mydomain.createsend.com/t/j/s/jtes/" method="post" id="subForm" />');
            $form.append('<input type="hidden" name="cm-name" id="hidName" />');
            $form.append('<input type="hidden" name="cm-jtes-jtes" id="hidEmail" />');
            $form.append('<input type="hidden" name="cm-fo-pikty" id="hidPrivateBusiness" />');

            $form
                .find("#hidName")
                .val(']]></xsl:text><xsl:value-of select="$context//checkoutinformation/info[key='name']/value" disable-output-escaping="yes"/><xsl:text disable-output-escaping="yes"><![CDATA[');

            $form
                .find("#hidEmail")
                .val(']]></xsl:text><xsl:value-of select="$context//checkoutinformation/info[key='email']/value" disable-output-escaping="yes"/><xsl:text disable-output-escaping="yes"><![CDATA[');

            $form
                .find("#hidPrivateBusiness")
                .val(']]></xsl:text><xsl:value-of select="$acctype"/><xsl:text disable-output-escaping="yes"><![CDATA[');

            $.getJSON(
                $($form).get(0).action + "?callback=?",
                $($form).serialize(),
                function (data) {
                    if (data.Status === 400) {
                        alert("Error: " + data.Message);
                    } else { 
                        // 200
                        alert("Success: " + data.Message);
                    }
                }
            );
        }
    });
]]></xsl:text></script>

一切正常,直到我调用getJSON方法。之后没有任何作用。我在Mozilla Error控制台中找不到任何JavaScript错误。我已检查表单是否正确创建alert($('<div>').append(($form).clone()).html());显示正确的结果。

<form action="http://mydomain.createsend.com/t/j/s/jtes/" method="post" id="subForm"><input value="552" name="cm-name" id="hidName" type="hidden"><input value="aks@mydomain.com" name="cm-jtes-jtes" id="hidEmail" type="hidden"><input value="268278" name="cm-fo-pikty" id="hidPrivateBusiness" type="hidden"></form>

1 个答案:

答案 0 :(得分:1)

jQuery API documentation上,重新设置回调函数:

  

success(data,textStatus,jqXHR)请求成功时执行的回调函数。

也许添加失败的侦听器会有所帮助:

$.getJSON(
    $($form).get(0).action + "?callback=?",
    $($form).serialize(),
    function (data) {
        if (data.Status === 400) {
            alert("Error: " + data.Message);
        } else { 
            // 200
            alert("Success: " + data.Message);
        }
    }
).error(function(data) {
    alert('have error http: ' + data);
}).complete(function(data){
    alert('have complete: ' + data);
});

更新:

也可能与JSON错误有关。来自API doc

  

重要提示:从jQuery 1.4开始,如果JSON文件包含语法错误,则请求通常会以静默方式失败。

切换到$.get(...)来电可能会对此理论进行测试。