Find the range of forms; form input fields like HTML select dropdowns, file upload, search boxes, form validation script, checkboxes and much more based on simple, Bootstrap and custom CSS styles.
A number of tutorials/plug-ins use the jQuery functionality.
The WYSIWYG text editor for your website If your project is based on Bootstrap framework and you require using a text editor with rich features then line-control is a light-weight choice. The line-control is a jQuery based plug-in which is implemented on Bootstrap framework. It is a responsive and fast text editor that is supported … Read more
The Bootstrap multiselect with jQuery The multiselect dropdown allows the visitors of the website selecting multiple options from a dropdown in a form. Although, you may achieve that by using the multiple attribute in the <select> tag of HTML, however, instead of a dropdown, a list view type is displayed that allows users to choose … Read more
The jQuery file upload plug-in In this tutorial, I am going to share a nice plug-in for uploading files that uses a jQuery. If you are using jQuery and your project is based on Bootstrap then it is really a light-weight plug-in that enables your users to select multiple files. Not only multiple files can … Read more
How to disable textarea resizing You may use the resize: none property to disable resizing of a textarea in a web browser. Generally, the textarea can be stretched to expand that may affect different sections of a webpage. By using the CSS, you may disable this overall or by specifying a particular direction as shown … Read more
The search box using Bootstrap In this post, a search box based on Bootstrap is created along with additional filters in the dropdown. By default, only the textbox to enter the search term with a button is displayed. There is a dropdown option towards the right corner of the search box that allows filtering the … Read more
Form validation in Bootstrap In HTML 5, the default form validation is done for the fields marked with the required attribute. It will even check the email format for the field specified as type=”email” with the required attribute. However, the message is basic and displayed as: “Please fill in the field” Where the specific field will also … Read more
How to create labels in Bootstrap The labels are generally used with the form fields like textboxes, textarea, checkbox, etc. for showing the purpose of that field. While using the Bootstrap framework, the labels are styled automatically which you may customize as well. See the following section for learning how to create simple and floating … Read more
Floating labels for input fields by using CSS In this tutorial, floating labels for the form input fields are created by using CSS float and other properties. The text field labels float upwards as any textbox gets focused by pressing the mouse click or tab key from the keyboard. Have a look at the code … Read more
The jQuery validate plug-in for HTML forms The form validation is generally required when using the web forms in your web pages. For example, checking the correct email format, password and re-enter password matching, name, age, etc field values (if any are mandatory). In the early days, you had to write a lot of code … Read more
Creating labels of checkboxes by jQuery In other tutorials related to checkboxes, I showed how you may create simple HTML checkboxes along with Bootstrap’s based classes here. In this tutorial, a jQuery based plug-in is used for creating the labels of checkboxes. That means, the text of the label is clickable unlike the normal checkboxes … Read more
The sliding form using Bootstrap In this tutorial, I am going to use a jQuery plug-in with Bootstrap framework for creating the sliding form that you may use for feedback or any other purpose like subscriptions, etc. The plug-in name is bootstrap-feedback-form. You need to include the JS and CSS files of this plug-in in … Read more
The password strength indicator plug-in On your websites, you may have secured forms for creating user accounts that ask for certain information including creating a password. In order to implement strong passwords, it’s a good practice to guide a user during the account creation process that how strong their password is. The bigger email websites … Read more
jQuery password reveal plug-in Sometimes, you may need to reveal the characters entered by the user in a password field. For example, your account creation form has a password field along with a confirm password field. You want your visitors to see the characters entered in both fields to confirm that they are matching each … Read more
The Bootstrap color picker The color picker is a component that you may require for the front-end interface for the end users. The purpose can be selecting a color of theme, backgrounds, or other sections of the website. However, color pickers can generally be used in the admin interface to allow visitors to set the … Read more
The Bootstrap toggle switches by using checkbox and radio button In this tutorial, I am going to show you a plug-in that can be used for creating nice looking switches by turning radio buttons or checkboxes that uses the Bootstrap framework. Toggle Switch sizes colors example various text in toggle switch A Short Video of this Tutorial for … Read more