A JavaScript plugin to ease the HTTP requests by making them work directly from the HTML tags. it was inspired by RestfulizerJs by Ifnot but with a different implementation.
after downloading include them in your html file like this
<script src="path/to/js/restintag.vanilla.js"></script>
Install via this command
npm install --save restintag
then in your main javascript file do the following
// For vanilla version
var restintag = require("restintag").vanilla;
restintag(".test", {}, function(data) {
console.log(data);
});
// For jQuery version
var jquery = require("jquery");
window.$ = window.jQuery = jquery;
var restintag = require("restintag").jquery;
jquery.fn.restintag = restintag;
$(".test").restintag({}, function(data) {
console.log(data);
});
easy! just add the following attributes to your HTML tag:
data-method
: the request type, GET, POST, PUT, etc.data-target
: the url to send/get the datadata-disabled
:true
to disable the tag until the request is done else just putfalse
data-once
:true
to disable the tag entirely after the first request, default isfalse
example:
<button data-target="http://example.com/post/post-id/" data-method="DELETE" data-disabled="true">Delete Article</button>
or you can use the javascript apis, note the data attributes have the priority.
First you need to set your options, here's the available options (the seen values are the default):
{
async: true, // if set to false calls will be synchronous
parse: false, // if you have query string, it will add them to the request body
target: null, // the url
method: "GET", // the request method
headers: {}, // the HTTP headers
timeout: 0, // milliseconds to wait before cancelling the request, 0 means no timeout
data: {}, // request body specially for POST and PUT requests
disable: true, // to disable the clicking event until the request is finished
once: false // to disable the click event after the first request is processed
}
The zero dependency version, just add it to any project you have and it will work
restintag(selector: String, options: Object, successCallback: Function, errorCallback: Function): void
after adding jQuery use the restintag()
function to do the magic
$(".selector").restintag(options: Object, successCallback: Function, errorCallback: Function): jQuery
Both jQuery version and Vanilla version support the following browsers:
- Chrome (Latest)
- FireFox (Latest)
- Edge (Latest)
- IE (9+)
- Opera (Latest)
- Safari (Latest)
- Vivaldi (Latest)
- Epiphany (Latest)
List of people who contributed to this project, thank you people:
This project is under the MIT license.