getParamteter not working on text element in ajax call to java servlet

Question

Hi I have a name and pw text fields with a submit button. The problem is that whatever value I enter does not get picked up by the servlet. I do not know if the problem is when JQUERY is trying to get the HTML element value or if the servlet cannot get the values from the ajax call.

I have a servlet which prints out the request.getParameters and it keeps printing null. I have attached relevant snippets of the html and js code and the servlet code to test if the parameters are being received.

HTML code:

<section id="customer_business">
        <div class="container">
            <div class="row">
                <div class="col-sm-6 col-xs-12 customer">
                    <div class="hover ehover3">
                        <img class="img-responsive" src="images/p13.jpg" 
    alt="">
                        <div class="overlay">
                            <div class="row">
                                <div class="col-sm-6 col-xs-12">
                                    <div class="form-group"> 
                                        <input type="text" id="cus_name" 
   class="form-control" maxlength="10" placeholder="Full Name" required>
                                    </div>
                                </div>
                                <div class="col-sm-6 col-xs-12">
                                    <div class="form-group"> 
                                        <input id="cus_password" 
    type="password" class="form-control" maxlength="22" 
    placeholder="Password" required>
                                    </div>
                                </div>
                            </div>

                            <div class="col-sm-2 col-xs-12">

                            </div>

                            <div class="col-sm-8 col-xs-12">
                                <div class="col-sm-6 col-xs-6">
                                    <a href="custreg.html"><button 
    id="cus_register" class="info" type="button">Register</button></a>
                                </div>
                                <div class="col-sm-6 col-xs-6">
                                    <a href="#"><button id="cus_login" 
class="info" type="button">Login</button></a>



                                </div>

JavaScript code (done in a document.ready function):

$('#cus_login').click(function() {
    $.ajax({
        url: 'LoginServlet',
        type: 'POST',
        contentType: 'application/json',
        dataType: 'json',
        data: JSON.stringify({
            username : $("#cus_name").text(), 
            pw : $("#cus_password").text(), 
            method : "customer"
        }),
        success: function(result) {
            var obj = result;
            if(result.status == true) {
                alert("Success!");
            }
            else{
                alert("Login failure, please check and try again");
            }
        }
    });
});

And finally the servlet code to test if the values are being sent over:

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    System.out.println("Servlet reached successfully");

    RequestDispatcher custdispatch = 
 request.getRequestDispatcher("CustProfile.html");
    RequestDispatcher busdispatch = 
 request.getRequestDispatcher("BusEntry.html");

    boolean isValid = false;
    String method = request.getParameter("method");
    String username = request.getParameter("username");
    String pw = request.getParameter("pw");
    System.out.println(method + username + pw);

I keep getting 3 null values. It must be a problem between ajax and servlet. If you look at the method attribute, its not being taken from user input or any html element it is hard coded but even that returns null in the servlet.

Nope that didnt work. It must be a problem between ajax and servlet. If you look at the method attribute, its not being taken from user input or any html element it is hard coded but even that returns null in the servlet. — Hgrammer, Feb 04 '19 at 17:48
besides .val() is for elements within a form. My code shows that it is a text input not a form so I am sure I have to use .text() — Hgrammer, Feb 04 '19 at 18:41
`.val()` is for input/select/texarea has nothing to do with forms — Musa, Feb 04 '19 at 18:50
Is your servlet expecting json? It doesn't look so but I don't really know much about that. — Musa, Feb 04 '19 at 18:53
Ive not specified what type of data the servlet expects from ajax. I have only set the response content type to Json. — Hgrammer, Feb 04 '19 at 19:01

score 0 · Accepted Answer · answered Feb 09 '19 at 02:41

Answer: getVal() is indeed the correct option to use. The problem was not the js picking up from html. The problem was the servlet not picking up the data from ajax POST. The reason is because data was being set as json but servlet cannot read json format so following code:

JsonObject data = new Gson().fromJson(request.getReader(), JsonObject.class);
    String method = data.get("method").getAsString();
    String username = data.get("username").getAsString();
    String pw = data.get("pw").getAsString();

data variable is json ajax post parameters converted into a java object.

getParamteter not working on text element in ajax call to java servlet

1 Answers1