jQuery Unobtrusive Ajax is a library that provides a simple way to add Ajax functionality to a web page using unobtrusive JavaScript techniques. To add the jQuery Unobtrusive Ajax library to your project, follow these steps:
Include the jQuery library on your web page. You can do this by adding the following code to your HTML file, usually in the <head> section:
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
Add the jQuery Unobtrusive Ajax library to your project. You can download the library from the NuGet package manager, or you can download it from the official GitHub repository: https://github.com/aspnet/jquery-ajax-unobtrusive
Include the jQuery Unobtrusive Ajax library on your web page, after the jQuery library. You can do this by adding the following code to your HTML file, usually in the <head> section:
<script src="https://cdn.jsdelivr.net/jquery.ajax.unobtrusive/3.2.6/jquery.unobtrusive-ajax.min.js"></script>
Once you have included the library, you can use the unobtrusive Ajax features by adding HTML attributes to your web page elements. For example, to make a link or form submit button trigger an Ajax request, you can add the data-ajax="true" attribute to the element, and specify the URL to which the request should be sent using the data-ajax-url attribute. You can also specify additional options such as the HTTP method and the data to be sent with the request.
Here's an example of how to use the data-ajax attribute with a link:
<a href="#" data-ajax="true" data-ajax-url="/api/data" data-ajax-method="GET">Load Data</a>
In this example, when the user clicks the "Load Data" link, an Ajax request will be sent to the server using the HTTP GET method, and the response will be displayed on the web page.
Here's an example of how to use the data-ajax attribute with a form:
<form method="post" data-ajax="true" data-ajax-url="/api/submit"><input type="text" name="data" /><input type="submit" value="Submit" /></form>
In this example, when the user submits the form, an Ajax request will be sent to the server using the HTTP POST method, and the form data will be sent with the request. The response will be displayed on the web page.