Home JQuery AJAX serialize getting null values
Reply: 0

JQuery AJAX serialize getting null values

user7411
1#
user7411 Published in April 24, 2018, 6:33 am

I can't find it out why this is not working.I have done this before a lot of times but this time this is not event working seriously don't know please help me find it out

HTML(signup.html)

<form role="form" id="signupForm">
        <div class="form-group">
            <label for="first_name" class="control-label"><span
                class="glyphicon glyphicon-user"></span> First Name</label> <input
                type="text" class="form-control" name="first_name" id="firstName"
                for="first_name" placeholder="Enter First Name">
        </div>
        <div class="form-group">
            <label for="last_name" class="control-label"><span
                class="glyphicon glyphicon-user"></span> Last Name</label> <input
                type="text" class="form-control" name="last_name" id="lastName"
                for="last_name" placeholder="Enter Last Name">
        </div>

        <div class="form-group">
            <label for="username" class="control-label"><span
                class="glyphicon glyphicon-user"></span> Username</label> <input
                type="text" class="form-control" name="user_name" id="username"
                for="user_name" placeholder="Enter Username">
        </div>
        <div class="form-group">
            <label for="email"><span
                class="glyphicon glyphicon-envelope"></span> Email</label> <input
                type="email" class="form-control" name="email" id="email"
                for="email" placeholder="Enter Email">
        </div>
        <div class="form-group">
            <label for="mobile_number"><span
                class="glyphicon glyphicon-phone"></span> Mobile Number</label> <input
                type="text" class="form-control" name="mobile_number"
                id="mobile_number" for="mobile_number"
                placeholder="Enter Mobile Number">
        </div>
        <div class="form-group">
            <label for="password"><span class="glyphicon glyphicon-lock"></span>
                Password</label> <input type="password" class="form-control"
                name="password" id="password" for="password"
                placeholder="Enter Password">
            <!--<ul>
             <li class="help-block red"> *password must be 8 characters long</li>
             <li class="help-block red"> *password must contain an Uppercase letter </li>
             <li class="help-block red"> *password must contain an Lowercase letter </li>
             <li class="help-block red"> *password must contain a special character </li>
             <li class="help-block red"> *password must contain a number            </li>
            </ul>-->
        </div>
        <div class="form-group">
            <label for="confirm_password"><span
                class="glyphicon glyphicon-lock"></span> Confirm Password</label> <input
                type="password" class="form-control" name="confirm_password"
                id="confirmPassword" for="confirm_password"
                placeholder="Enter Password again">
        </div>
        <div class="dropdown form-group">
            <label for="security_question"><span class="secQue"></span>
                Security Questions </label><br> <select name="security_question"
                id="secQue" class="btn btn-default">
                <option value=""> security Question? </option>
                <option value="what is your school name?"> what is your school name? </option>
                <option value="what is your native place  name?"> what is your native place  name? </option>
                <option value="what is your favourite place?"> what is your favourite place? </option>
                <option value="what is your favourite food?"> what is your favourite food? </option>
                <option value="what is your pet name?"> what is your pet name? </option>
            </select>

        </div>

        <div class="form-group">
            <label for="answer"><span class="glyphicon glyphicon-pencil"></span>
                Answer</label> <input type="answer" class="form-control" name="answer"
                id="answer" for="answer" placeholder="Enter Answer">
        </div>
        <div class="form-group">
            <label for="user_city"><span
                class="glyphicon glyphicon-record"></span> City</label> <input type="text"
                class="form-control" name="user_city" id="city" for="city"
                placeholder="Enter city">
        </div>

        <div class="form-group">
            <button id="createAccount" class="btn btn-info">Submit</button>
        </div>
    </form>

<script src="https://code.jquery.com/jquery-3.2.1.min.js"
    integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
    crossorigin="anonymous"></script>

JQuery(accounts.js)

$(function(){

var bCreateAccount = $('#createAccount');

//Invokes createAccount function
bCreateAccount.on('click',createAccount);

//calls the SignupServlet AJAX request
function createAccount(){

    $("#signupForm").on('submit' , function(e) {
          e.preventDefault();

          $.ajax({
                url : 'SignupServlet',
                type:'POST',
                contentType: 'application/json; charset=utf-8',
                data : $('#signupForm').serializeArray(),
                success : function(response){
                console.log('Response :' +response);    
                },
                error : function(){
                    console.log('Error :' +error);
                }
            });
        });     
}

});

SignupServlet

private void getParameters(HttpServletRequest request,HttpServletResponse response) {
    firstName = request.getParameter("first_name");
    lastName = request.getParameter("last_name");
    userName = request.getParameter("user_name");
    email = request.getParameter("email");
    mobileNumber = request.getParameter("mobile_number");
    password = request.getParameter("password");
    confirmPassword = request.getParameter("confirm_password");
    securityQuestion = request.getParameter("security_question");
    answer = request.getParameter("answer");
    userCity = request.getParameter("user_city");
}
protected void service(HttpServletRequest request, HttpServletResponse response)
        throws ServletException, IOException {
    System.out.println("Inside SignupServlet");
    getParameters(request, response);

    System.out.println("Username : "+userName);

}

I am not able to find out whats the problem with this code.Guyz please help me to get the solution.It will be really helpful.

You need to login account before you can post.

About| Privacy statement| Terms of Service| Advertising| Contact us| Help| Sitemap|
Processed in 0.305457 second(s) , Gzip On .

© 2016 Powered by mzan.com design MATCHINFO