## بــرچــسب ها - Tags Input

بــرچسب ها

## آموزش فراخوانی

ابتدا کد زیر را در فرم خود وارد کنید.

    <div class="col-12 mb-3">
        <label for="input-example" class="form-label">بــرچسب ها</label>
        <input class="form-control" id="input-example" name="input-example" value="جی کوئری, جاوا" autofocus>
    </div>

کدهای Css زیر را در @section Style خود وارد کنید.

    <!--TagsInput-->
    <link href="assets/lib/TagsInput/dist/tagify.css" rel="stylesheet" />
    <!--end TagsInput-->

کدهای جاوا اسکریپتی زیر را در @section scripts خود وارد کنید.

    <!--TagsInput-->
    <script src="assets/lib/TagsInput/dist/tagify.js"></script>
    <script src="assets/lib/TagsInput/dist/tagify.polyfills.min.js"></script>
    <script>
        var input = document.querySelector('input[name=input-example]');
        new Tagify(input, {
            placeholder: 'برچسب ...',
            trim: true,
        });
    </script>
    <!--end TagsInput-->

برای مشاهده تمام برچسب های وارد شده، میتوانید توسط دستور زیر در Jquery آن را مشاهده کنید.

    $('#input-example').val();

این پلاگین Jquery قابلیت های زیادی دارد. برای مشاهده همه قابلیت ها از لینک زیر استفاده کنید.

    https://www.jqueryscript.net/form/Tiny-Text-Field-Based-Tags-Input-Plugin-For-jQuery-Tagify.html