npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

restintag

v0.2.4

Published

HTTP requests made easy through HTML tags

Downloads

7

Readme

RESTInTag

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.

Install

Simple Download

after downloading include them in your html file like this

<script src="path/to/js/restintag.vanilla.js"></script>

NPM

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);
});

Usage

easy! just add the following attributes to your HTML tag:

  1. data-method: the request type, GET, POST, PUT, etc.
  2. data-target: the url to send/get the data
  3. data-disabled: true to disable the tag until the request is done else just put false
  4. data-once: true to disable the tag entirely after the first request, default is false

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.

API

Options

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
}

Vanilla

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

jQuery

after adding jQuery use the restintag() function to do the magic

$(".selector").restintag(options: Object, successCallback: Function, errorCallback: Function): jQuery

Browser Support

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)

Contributors

List of people who contributed to this project, thank you people:

License

This project is under the MIT license.