jQuery Plugin To Generate Fake Date In A Form - faker.js
File Size: | 48.9 KB |
---|---|
Views Total: | 738 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

faker.js is an useful jQuery plugin created for web developers that allows to automatically generate random fake data in the form fields depending on the data type you specify.
How to use it:
1. Link to the latest version of jQuery library and the jQuery faker plugin's script:
<script src="//code.jquery.com/jquery-3.1.1.slim.min.js"></script> <script src="scripts/faker.js"></script>
2. Add empty input fields with specified data types into the form as follows:
<form id="form" name="form"> <input id="customer_fname" name="customer[username]" type="text"> <input id="customer_mname" name="customer[mname]" type="text"> <input id="customer_lname" name="customer[lname]" type="text"> <input id="customer_email" name="customer[email]" type="text"> <input id="customer_nick_name" name="customer[nick_name]" type="text"> <input id="customer_city" name="customer[city]" type="text"> <input id="customer_country" name="customer[country]" type="text"> <input id="customer_address_1" name="customer[address_1]" type="text"> </form>
3. Initialize the plugin for auto generating.
$('#form').fakify();
4. Keep some input fields from auto generating.
$('#form').fakify({ 'except': ['mname', 'address_2', 'website'] });
5. Advanced usages.
$('#form').fakify({ // maps address_1 field to street_address "customer[address_1]": "address.streetAddress", // adds custom datatype along with the data "customer[nick_name]": ["Chaure", "Dalley", "Daure", "Bhyagute", "Gole"] // restricts country data type to "Nepal" and "China" only "customer[country]": ["Nepal", "China"] });
6. Default plugin map table which maps the element names to the key for modularised usage for dictionary access and customization.
name: { fullName: ['fullname', 'full_name'], firstName: ['f_name', 'fname', 'first_name', 'firstname', 'fstname'], middleName: ['m_name', 'mname', 'middle_name', 'middlename'], lastName: ['l_name', 'lname', 'last_name', 'lastname', 'lstname'] }, address: { country: ['country'], state: ['state'], zip: ['zipcode', 'zip', 'postcode', 'postcode_by_state'], streetAddress: ['street_address', 'street', 'street_name', 'address'], stateAbbr: ['state_abbr'], city: ['city'], buildingNumber: ['building_number'] }, company: { name: ['company_name', 'c_name', 'organization_name', 'name'], website: ['url', 'website', 'web_address', 'web-address'], title: ['title'], description: ['description', 'desc'], department: ['department'] }, personal: { academic: ['academic', 'education', 'qualification'] }, email: ['email', 'mailto', 'free_email', 'internet_email', 'mailTo', 'freeEmail', 'internetEmail'], business: { creditCardNumbers: ['credit_card', 'creditCard'] }, phone: ['cell_phone', 'phone', 'phone_number'], extension: ['extension', 'ext'], faxNumber: ['fax_number', 'fax']
This awesome jQuery plugin is developed by abhinavmsra. For more Advanced Usages, please check the demo page or visit the official website.