<input type="text" data-display-as="tags" required="required" aria-required="true" placeholder="Enter some tags" class="input-simple m" value="foo,bar,baz">

<input type="hidden" required="required" aria-required="true" placeholder="Enter some tags" class="input-simple m" value="foo,bar,baz">

<script src="/assets/js/jquery.min.js"></script>
<script src="/assets/js/jquery-ui.min.js"></script>
<script src="/assets/js/selectize.min.js"></script>
<script>
    $('[data-display-as=tags]').selectize({
        plugins: ['drag_drop'],
        delimiter: ',',
        persist: false,
        create: function(input) {
            return {
                value: input,
                text: input
            }
        },
        sortField: '#sort'
    });
</script>
<input type="text" data-display-as="tags" required="required" aria-required="true" placeholder="Enter some tags" class="input-simple m" value="foo,bar,baz">

<input type="hidden"  required="required" aria-required="true" placeholder="Enter some tags" class="input-simple m" value="foo,bar,baz">


<script src="/assets/js/jquery.min.js"></script>
<script src="/assets/js/jquery-ui.min.js"></script>
<script src="/assets/js/selectize.min.js"></script>
<script>
	$('[data-display-as=tags]').selectize({
		plugins: ['drag_drop'],
	    delimiter: ',',
	    persist: false,
	    create: function(input) {
	        return {
	            value: input,
	            text: input
	        }
	    }, 
	    sortField: '#sort'
	});
</script>
/* No context defined for this component. */
  • Content:
    // .tagsinput {
    //     overflow-y: auto;
    //     @extend .input-simple;
    // }
    
    // .tagsinput span.tag {
    //     border: 1px solid palette(ui, light);
    //     display: block;
    //     float: left;
    //     padding: 0.2rem;
    //     margin-right: 0.2rem;
    //     text-decoration: none;
    // }
    
    // .tagsinput span.tag a {
    //     text-decoration: none;
    // }
    
    // .tagsinput input {
    //     width: 100px;
    //     margin: 0px;
    //     border: 1px solid transparent;
    //     padding: 0.2rem;
    //     background: transparent;
    //     outline: 0px;
    // }
    
    // .tagsinput div {
    //     display: block;
    //     float: left;
    // }
    
    // .tags_clear {
    //     clear: both;
    //     width: 100%;
    //     height: 0px;
    // }
    
    // .not_valid {
    //     background: palette(warning, light);
    //     color: palette(warning, dark);
    // }
    
    .selectize-control.input-simple {
    	padding: 0;
    	line-height: 0.8;
    }
  • URL: /components/raw/tag-input/tag-input.scss
  • Filesystem Path: src/components/12-forms/01-atoms/09-tag-input/tag-input.scss
  • Size: 849 Bytes

There are no notes for this item.