Skip to content
master
Go to file
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
 
 

README.md

Ftakar Code Climate

A jQuery plugin that saves element data using Local Storage

Ftakar is a small jQuery plugin that I decided to implement as extra functionality to my projects. Even though the plugin idea is simple it adds a considerable amount to the traditional html forms.

Version

1.0.1

Todo

  • TEST
  • Write better instructions
  • Trigger Save
  • Trigger Load
  • Trigger Delete
  • Implement interval save
  • Implement data expires
  • Implement checkbox save
  • Implement radio button save
  • Implement select save
  • Save forms within uri namespace (can be implemented using the uri in the "savedDataName" setting - { savedDataName: escape( document.location.href ) })

Usage & Installation

  1. Import jQuery-1.11.2 or greater
  2. Import "sauce/ftakar-version.min.js"
  3. '$('input').ftakar();'

Example:

<form>
    <input type="text" name="firstname" id="sqphy">
    <input type="radio" name="sex" value="male" checked="" id="yzath">Male
    <input type="radio" name="sex" value="female" id="ktpwl">Female
    <input type="checkbox" name="vehicle" value="Bike" id="atrpf">I have a bike
    <input type="checkbox" name="vehicle" value="Car" id="sivcy">I have a car
    <input type="date" name="bday" id="mdqgm"
    <input type="color" name="favcolor" id="ljwon">
    <select id="khupoa">
      <option value="volvo">Volvo</option>
      <option value="saab">Saab</option>
      <option value="mercedes">Mercedes</option>
      <option value="audi">Audi</option>
    </select>

    <input type="submit" value="Submit">
</form>
$('input, select').not('input[type="submit"]').ftakar({
  savedDataName: "ftakar__" + encodeURI(document.location.href),
  saveOnChange: true,
  clearOnSubmit: true,
  expireInMs: 3600000 /* 1 hour */
});

API

Options

Possible options:

  • saveOnChange – save when element has changed as defined by the jQuery "change" event – boolean: true

  • clearOnSubmit – when the closest parent form is submitted the element data will be deleted – boolean: true

  • idAttribs - when defined the plugin will search for the the first valid id before going onto the next - array: ['id', 'name', 'data-ftakar']

  • expireInMs - ms to save data for element - int / boolean: false

  • saveOnInterval – save every n ms – int / boolean : false

  • beforeSave – function called before save of every element – function: function(){}

  • onSave – function called after save of every element – function: function(){}

  • beforeDelete – function called before delete of every element – function: function(){}

  • onDelete – function called after delete of every element – function: function(){}

  • beforeLoad – function called before plugin is loaded – function: function(){}

  • onLoad – function called after plugin is loaded – function: function(){}

Compatibility

Browsers

As long as the browser is compatibile with HTML5 Storage API, plugin works fine.

  • Chrome 31+
  • Firefox 35+
  • Safari 7.1+
  • Opera 27+
  • IE 11+
  • iOS Safari 7.1+
  • Opera Mini (Not Supported)
  • Android Browser 37+
  • Chrome for Android 40+

License

MIT

About

Ftakar -- a jQuery plugin that preserves element data using Local Storage as implemented using the HTML5 Storage API.

Resources

Releases

No releases published

Packages

No packages published
You can’t perform that action at this time.