To transfer form data from client to server we use mostly two methods one is action attribute in <form> tag which transfer the data form click to the controller and second is the ajax which also do the same task.

In this blog, we see that how to use jquery ajax in java servlet and communicate with the MySQL database.

here we only focus on the combine working principle of ajax and java servlet technology.

what is ajax?

Ans. Ajax stands for Asynchronous JavaScript And XML which is used to send request from the client machine to the server without refreshing the page. In this technology, the request is to transfer asynchronously. that means the whole codding of ajax is written with the use of javascript or jquery. Between these two now jquery is

quit famous because less codding to perform ajax.

You notice that In some website when you delete or update data without refreshing the page the update or

deleted data is shown. This type of feature is created by using ajax. ajax is not a programming or any server scripting language it is just a technology, where we only send the request with ou without data to the controller or the page where all the database related task in define.

 

why do we use ajax?

Ans. The main feature of the use of ajax is only transferring data from one page to another page Asynchronously without refreshing

the page. Using ajax the CURD(Create, Update, Read, Delete) operation very simple and user interactive.so that we use ajax.

ajax is the use which many programming languages but here we only focus on how to use jquery ajax in java servlet.

what is java servlet?

ans. Servlet is a web container which is used to create dynamic web pages according to the request come from the client. It is a java class which is extended with HttpServlet.

how to use jquery ajax in java servlet?

Ans. To use jquery ajax in java servlet we follow some step i,e,

->To use ajax we need below CDN and put in the JSP script tag.

https://cdnjs.cloudflare.com/ajax/libs/jquery-ajaxy/1.6.1/scripts/jquery.ajaxy.min.js

example:<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-ajaxy/1.6.1/scripts/jquery.ajaxy.min.js"></script>

->syntes of ajax

<script>

$(document).ready(function(){

    $.ajax({

        url:'enter your servlet file path',

        method:'POST',

        data:'pass the form data',

        success : function(data)

        {

        },

        error : function(data)

        {

        }

    });

});

</script>

explanation of ajax syntax:

To start ajax , we use "$.ajax({});" syntex. under this some attribute are present like

url-> is used for transfer form data to the controller(simple a servlet file). Here specify the URL of the controller

that will send the data without refresh.

method->method is used to specify the data is transfer in which format link GET or POST.

data-> data is the attribute which contains the form data.

success: when the request successfully transfers to the controller and get a response back then the success function is

called. in the success, the function parameter is present which container the response message.

error: If some error occurs during requesting or responding then the error function is called.

how the form data is store in ajax data attribute and transfer to the java servlet?

Ans. the javascript a function called serialize() which take the data of form and convert that into a serialize formate that means in key-value pair like structure. the name of the key is the <input> tag name attribute

and value is the value of the <input> tag.

program

var data = $("#formid").seriazable();