Question

我是ajax和jquery的新手，并试图在我的代码中放置一个ajax调用。但下面是我发出警报时收到的错误消息：

jqxhr.status = 404
抛出错误=未找到
jqxhr.statusText =未找到
request = undefined
error = undefined

我想做什么： 单击“编辑gif”，打开一个只有一个Fancy文本框（Tinymce）的模态对话框。在文本框中编辑内容后，单击模态对话框中的“保存”按钮，启动ajax调用以将内容保存在数据库中。

发生了什么： 模态对话框打开正确，我能够看到正确填充ajax调用的“数据”部分（放置警报以确认）。我相信网址也是正确的。如果我在浏览器中键入url，则控件会根据web.xml（Servlet中的Sysout被打印）转到我的servlet。但不知何故，点击“保存”按钮后，ajax调用永远不会进入服务器。如果你们中的一个人可以帮助我，那将会非常棒，非常感激。我的JSP（复制我认为仅相关的内容）：

<html>
<head>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
    <link rel="stylesheet" type="text/css" href="css/sis.css" media="screen" />
    <link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/css/jquery-ui-1.10.3.custom">
    <script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery.js"></script>
    <script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery-ui.min.js"></script>
    <script type="text/javascript" src="<%=request.getContextPath()%>/js/tinymce/tinymce.min.js"></script>
    <script>
        $(function() {
            $("#dialog-form2").dialog({
                autoOpen: false, width: 500, modal: true,
                buttons: {
                    "Save": function() {
                        tinymce.get("stChallenge").setContent(tinyMCE.get("edChallenge").getContent());
                        alert($("#ChalId").val());
                        alert(tinyMCE.get("edChallenge").getContent());
                        var xhr =
                                $.ajax({
                            url: "/AjaxServlet?method=updateChal&keyword=dummy",
                            type: "GET",
                            data: {
                                CommentId: $("#ChalId").val(),
                                challenge: tinyMCE.get("edChallenge").getContent()
                            },
                            success: function (result) {
                                alert("Success :" + result);
                                $(this).dialog("close");
                            },
                            error:function (jqxhr, ajaxOptions, thrownError, request, error) {
                                alert('jqxhr.status = ' + jqxhr.status + '\n' + 'thrown error = ' + thrownError + '\n' + 'jqxhr.statusText = '  + jqxhr.statusText + '\n' +
                                    'request = ' + request + '\n' + 'error = ' + error);
                                $(this).dialog("close");
                            }
                        });
                    },
                    Cancel: function() {
                        $(this).dialog("close");
                    }
                },
                close: function() {
                }
            });
            $("#Edit2")
                    .click(function() {
                $("#dialog-form2").dialog("open");
            });
        });
    </script>        
    <script type="text/javascript">
        tinymce.init({
            selector: "#edChallenge", theme: "modern", 
            plugins: [
            ],
            image_advtab: false
        });
    </script>
    <script type="text/javascript">
        tinymce.init({
            selector: "#stChallenge", theme: "modern", readonly: true, toolbar: "false", menubar: "false",
            plugins: [
            ],
            image_advtab: false
        });
    </script>
</head>

<body>
    <c:set var="model" value="${sessionScope.model}" />
    <html:form action="managePerf.do?method=showPerf" method="post"  styleId="ManagePerfForm">
        <html:errors/>
        Date: <html:text property="rankDate" styleId="datepicker" name="ManagePerfForm" />
        <html:submit value="Go" styleClass="input button"/>
        <fieldset>                              
            <table border="0">
                <tr>
                    <td>
                        <div id="dialog-form2" title="Edit Challenges">
                            <form>
                                <textarea cols="75" rows="50" id="edChallenge">${comments}</textarea>
                            </form>
                        </div>
                        <label>Challenges</label>
                        <a href="javascript:void(0);" id="Edit2">
                            <img src='${pageContext.request.contextPath}/img/Edit.gif' height="32" width="32"/>
                        </a>
                        <div id="dTextBox" class="ui-widget">
                            <textarea cols="75" rows="15" id="stChallenge" readonly="true">${comments}</textarea>
                        </div>
                        <input type="hidden" id="ChalId" value=${CommentId} />
                    </td>
                </tr>
            </table>
        </fieldset>
    </html:form>
</body>

无法从jquery启动ajax调用

0 个答案: