如何使用jquery和ajax将数据从jsp发送到servlet

如何使用jquery和ajax将数据从jsp发送到servlet,jquery,ajax,jsp,servlets,Jquery,Ajax,Jsp,Servlets,我不熟悉jquery和ajax。我想检查给定的用户名是否存在于我的数据库中,如果它可用,我想通过传递一条名为username ready exist的消息发出警报。 我正在尝试应用jquery的模糊方法,因此在提交表单之前,我可以获得该用户名的状态。请帮我解决这个问题 这是我的JSP页面 <body> <div class="container registration"> <fieldset class="border p-2">

我不熟悉jquery和ajax。我想检查给定的用户名是否存在于我的数据库中,如果它可用,我想通过传递一条名为username ready exist的消息发出警报。 我正在尝试应用jquery的模糊方法,因此在提交表单之前,我可以获得该用户名的状态。请帮我解决这个问题

这是我的JSP页面

<body>

    <div class="container registration">
        <fieldset class="border p-2">
            <legend class="w-auto">Registration Form</legend>
            <form action="registration" method="post" id="registrationForm"
                onsubmit="return validation();">
                <div class="row" style="padding-bottom: 20px">
                    <div class="col">
                        <input type="text" class="form-control" name="firstName"
                            placeholder="First name" id="fname"> <span id="firstname"
                            class="text-danger font-weight-bold"></span>
                    </div>
                    <div class="col">
                        <input type="text" class="form-control" name="lastName"
                            placeholder="Last name" id="lname"> <span id="lastname"
                            class="text-danger font-weight-bold"></span>
                    </div>
                </div>

                <div class="row" style="padding-bottom: 20px">
                    <div class="col">
                        <input type="text" class="form-control" name="userName"
                            placeholder="UserName" id="uname"> <span id="username"
                            class="text-danger font-weight-thin"></span>
                    </div>
                    <div id="ajaxGetUserServletResponse"></div>
                </div>
                <!-- below jquery things triggered on onblur event and checks the username availability in the database -->
                <script type="text/javascript">
                    $(document).ready(function() {
                        alert("js is working");
                        $('#uname').blur(function() {
                            alert("blur is working")
                            $.ajax({
                                    type : 'post',
                                    url : 'registration',
                                    data : {
                                                uname : $('#uname').val()
                                            },
                                            success : function(responseText) {
                                                $('#ajaxGetUserServletResponse').text(responseText);
                                            }
                                    });
                            });
                    }); 
                </script>

我知道你想检查用户是否已经存在。你几乎做对了

 $.ajax({
                                type : 'post',
                                url : 'registration',
                                data : {
                                            uname : $('#uname').val()
                                        },
                                        success : function(responseText) {
                                            $('#ajaxGetUserServletResponse').text(responseText);
                                        }
                                });
                        });
在ajax中,您使用名为uname的参数发送数据,但您的servlet没有得到任何与该名称相关的内容。你应该这样做:

String uName= req.getParameter("uname");
并与uName合作,检查您想要什么。我不确定这是否像您希望的那样工作,因为您的表单也在触发servlet。您应该根据名称之类的内容区分呼叫。当您调用ajax时,除了要发送的uname之外,所有其他参数都将为null(如果用户键入了一些内容,也许也要先检查一下?)。但是当从ajax发送表单时,uname将为null

也许是这样的:

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {  
    if(request.getParameter("userName") != null) {
        formCall(request,response);
    }

    if(request.getParameter("uname") != null) {
        ajaxCall(request,response);
    }
}

private void ajaxCall(HttpServletRequest request, HttpServletResponse response) {
    System.out.println("Ajax call " + request.getParameter("uname"));

}

private void formCall(HttpServletRequest request, HttpServletResponse response) {
    System.out.println("Form call " + request.getParameter("userName"));

}
.blur中的ajax调用跳转到一个方法,表单提交到另一个方法


错误行为:如果用户加载页面,单击文本字段,然后单击按钮,这将触发.blur并同时触发提交。也许你也不想这样。

确切地说,解决什么问题?你有点忽略了给我们一个实际的问题描述…请去阅读,然后相应地编辑你的问题。谢谢你的建议,这有助于我解决这个问题。所以请在答案上标出:)很高兴我能帮忙。
String uName= req.getParameter("uname");
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {  
    if(request.getParameter("userName") != null) {
        formCall(request,response);
    }

    if(request.getParameter("uname") != null) {
        ajaxCall(request,response);
    }
}

private void ajaxCall(HttpServletRequest request, HttpServletResponse response) {
    System.out.println("Ajax call " + request.getParameter("uname"));

}

private void formCall(HttpServletRequest request, HttpServletResponse response) {
    System.out.println("Form call " + request.getParameter("userName"));

}