How-to articles, tricks, and solutions about INPUT

Create and style beautiful search boxes without any JavaScript code. Learn the steps to create search boxes and find lots of examples in this tutorial.

It is possible to customize the file input using a <label>. In this snippet, you’ll find the way of customizing the file input without using any JavaScript.

In this short Vue.js tutorial, you will read and learn about a very easy and fast method of disabling the HTML input conditionally in Vue.js components.

Learn the ways of how to disable text selection highlighting, how to disable copy, cut and paste, how to disable right-click. See example with CSS, JavaScript and jQuery.

Learn how to prevent browsers auto filling the input fields of HTML forms. Use autocomplete="off" to specify that autocomplete is disabled. See examples.

Use the CSS3 resize property with its "none" value to disable the resizing function of the textarea element. Learn the ways of only vertically or horizontally resizing, too.

To get user input in Java, you can use the Scanner class. Here's an example of how to get a string input from the user:

Read the tutorial and learn the methods of getting the value of the selected option in a select box using jQuery. Read about the text() and val() methods.

Read this tutorial and learn about several methods of getting the value of the input textbox value without wrapping the input element inside a form element.

In this tutorial, you will read and learn several methods that are used to hide HTML5 arrow buttons from the number input with the help of CSS properties.

Read this JavaScript tutorial and learn the method of getting the value of the selected radio button with the help of jQuery. Copy the code right away.

If you want to make a button onclick, you need to add the onclick event attribute to the <button> element. Learn How to Make Button Onclick with Examples.

Sometimes, you may need to make the content (such as a text or number) of input start from the right. Read and find out what properties to use for that.

In this snippet, you can find two methods of making a text input non-editable. Use either the HTML “readonly” attribute or add the CSS pointer-events property.

It is possible to match an empty input box only if the input field is required. In this snippet, we’ll show how to do this using the CSS :valid pseudo-class.

Use outline: none to remove the ugly border color for a form field in Chrome. Learn also how to give your own style for showing that the box is active. All with examples.

In this tutorial, you will read and learn useful information about the fastest method of resetting a file input by using some HTML and jQuery methods.

Read the tutorial and learn the two methods of selecting the entire text in HTML text input when clicked using JavaScript code snippets. Also, see examples.

In Symfony2, you can set the class attribute of a form input by using the "attr" option in the form field configuration.

In this snippet, find out what alternative attributes to minlength can be used to set a minlength validation in HTML5. Read our snippet and try examples.

In this tutorial, you’ll see how to set the default HTML form focus. This can be done without Javascript. For that, use the HTML “autofocus” attribute.

Learn 2 methods of how to specify the size of a checkbox and have a larger size checkbox. Use width and height properties or the transform property. See examples.

Checkbox is one of the HTML forms used on every website, but mostly they are not styled and look the same. If you want to make your site more attractive for users, you can simply style your checkboxes. If you don’t know how to do that, now we will create

Nice and attractive buttons can fill the overall look of your website. Learn how to create and style buttons with the help of CSS. Also, see lots of examples!

Style comment boxes, change the background color, add a background image or set borders to your comment box. See all with examples.