Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How does stackoverflow make its Tag input field? [closed]

Tags:

html

input

tags

How does StackOverflow create its tag system. How can it format the html in a text area?

I just don't know where to begin. If someone could guide me, then I can know what direction to take so I can write some code that someone can check.

Like this:

enter image description here

EDIT: Basically, when I press space, how do i add a new element/div to the inside of the div?

like image 582
Mathew Kurian Avatar asked May 31 '12 18:05

Mathew Kurian


People also ask

How do you close an input tag?

Syntax. The <input> tag is empty, which means that the closing tag isn't required. But in XHTML, the (<input>) tag must be closed (<input/>).

Does input tag close?

is input a self closing tag? Yes, input is a self closing tag. You need not close it as it is an empty tag. It only has attributes but no content.

How do you customize input tag in HTML?

If you only want to style a specific input type, you can use attribute selectors: input[type=text] - will only select text fields. input[type=password] - will only select password fields. input[type=number] - will only select number fields.


1 Answers

What about Bootstrap solution?

You can try this :

HTML Code:

<input type="text" value="html,input,tag" data-role="tagsinput"></input> 

For CSS, call these two files:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.min.css"> <link rel="stylesheet" href="http://bootstrap-tagsinput.github.io/bootstrap-tagsinput/dist/bootstrap-tagsinput.css"> 

For Javascript, call these two files:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> <script src="http://bootstrap-tagsinput.github.io/bootstrap-tagsinput/dist/bootstrap-tagsinput.min.js"></script> 

The code will generate the result below:

enter image description here

Check it out.

like image 90
Jad Chahine Avatar answered Oct 06 '22 03:10

Jad Chahine