Logo

نمونه اینپوت برچسب


                                    <div class="card card-custom">
                                        <div class="card-header">
                                            <h3 class="card-title">
                                                نمونه اینپوت برچسب
                                            </h3>
                                        </div>
                                        <!--begin::Form-->
                                        <form class="form">
                                            <div class="card-body">
                                                <div class="form-group row">
                                                    <label class="col-form-label text-right col-lg-3 col-sm-12">نمونه پایه</label>
                                                    <div class="col-lg-6 col-md-9 col-sm-12">
                                                        <input id="kt_tagify_1" class="form-control tagify" name='tags' placeholder='تایپ کنید...' value='css, html, javascript'  data-blacklist='.NET, SQLite'/>

                                                        <div class="mt-3">
                                                            <a href="javascript:;" id="kt_tagify_1_remove" class="btn btn-sm btn-light-primary font-weight-bold">حذف برچسب</a>
                                                        </div>

                                                        <div class="mt-3 text-muted">
                                                           در این مثال ، زمینه با 4 برچسب از قبل اشغال شده است. آخرین برچسب (CSS) همان مقدار برچسب اول را دارد و حذف می شود ،
                                                            زیرا تنظیم تکراری درست است.
                                                        </div>
                                                    </div>
                                                </div>

                                                <div class="separator separator-dashed my-4"></div>

                                                <div class="form-group row">
                                                    <label class="col-form-label text-right col-lg-3 col-sm-12">نمونه لیست سفید</label>
                                                    <div class="col-lg-6 col-md-9 col-sm-12">
                                                        <input id="kt_tagify_2" class="form-control tagify" placeholder='تایپ کنید...' value='بازگشت to the Future, Whiplash'  data-blacklist='.NET, SQLite'/>

                                                        <div class="mt-3 text-muted">
                                                            سه برچسب در لیست قرار گرفته است و غیر از این 3 برچسب امکان افزودن برچسب دیگری نیست
                                                        </div>
                                                    </div>
                                                </div>

                                                <div class="separator separator-dashed my-4"></div>

                                                <div class="form-group row">
                                                    <label class="col-form-label text-right col-lg-3 col-sm-12">نمونه همراه با تم</label>
                                                    <div class="col-lg-6 col-md-9 col-sm-12">
                                                        <input id="kt_tagify_5" class="form-control tagify" name='tags3' placeholder="افزودن کاربر" value="کریس مولر, Lina Nilson"/>

                                                        <div class="mt-3 text-muted">
                                                            دراپ دان item and tag templates.
                                                        </div>
                                                    </div>
                                                </div>

                                                <div class="separator separator-dashed my-4"></div>

                                                <div class="form-group row">
                                                    <label class="col-form-label text-right col-lg-3 col-sm-12">نمونه با باکس های بیرون</label>
                                                    <div class="col-lg-6 col-md-9 col-sm-12">

                                                        <input id="kt_tagify_3" class="form-control" name='tags-outside' class='form-control tagify tagify--outside' value='css, html, javascript' placeholder='write some tags'/>

                                                        <div class="mt-3 text-muted">
                                                            بعد از افزودن برچسب و تایید آن درون یک باکس کوچک بیرون از اینپوت قرار میگیرد
                                                        </div>
                                                    </div>
                                                </div>

                                                <div class="separator separator-dashed my-4"></div>

                                                <div class="form-group row">
                                                    <label class="col-form-label text-right col-lg-3 col-sm-12">تم رنگs</label>
                                                    <div class="col-lg-6 col-md-9 col-sm-12">
                                                        <input id="kt_tagify_4" class="form-control" name='tags3' placeholder='نام برچسب را وارد کنید' pattern='^[A-Za-z_✲ ]{1,15}دلار' value='css, html, javascript, angular, vue, react'/>

                                                        <div class="mt-3 text-muted">
                                                            در این مثال روی حداقل تایپ 3 کاراکتر ست شده است.
                                                            و حداکثر نمایش 6 برچسب
                                                        </div>
                                                    </div>
                                                </div>

                                                <div class="separator separator-dashed my-4"></div>

                                                <div class="form-group row">
                                                    <label class="col-form-label text-right col-lg-3 col-sm-12">تم رنگی روشن</label>
                                                    <div class="col-lg-6 col-md-9 col-sm-12">
                                                        <input id="kt_tagify_6" class="form-control" name='tags3' placeholder='نام برچسب را وارد کنید' pattern='^[A-Za-z_✲ ]{1,15}دلار' value='css, html, javascript, angular, vue, react'/>

                                                        <div class="mt-3 text-muted">
                                                            در این مثال روی حداقل تایپ 3 کاراکتر ست شده است.
                                                            و حداکثر نمایش 6 برچسب
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="card-footer">
                                                <div class="row">
                                                    <div class="col-lg-9 ml-lg-auto">
                                                        <button type="reset" class="btn btn-primary mr-2">ارسال</button>
                                                        <button type="reset" class="btn btn-secondary">لغو</button>
                                                    </div>
                                                </div>
                                            </div>
                                        </form>
                                        <!--end::Form-->
                                    </div>
                                

                                    // کلاس definition
                                    var KTمشخص کردن = function() {

                                        // خصوصی functions
                                        var demo1 = function() {
                                            var input = document.getElementById('kt_tagify_1'),
                                                // init مشخص کردن script on the above inputs
                                                tagify = new مشخص کردن(input, {
                                                    whitelist: ["A# .NET", "A# (Axiom)", "A-0 سیستم", "A+", "A++", "ABAP", "ABC", "ABC ALGOL", "ABSET", "ABSYS", "ACC", "Accent", "Ace DASL", "ACL2", "Avicsoft", "ACT-III", "اکشن!", "اکشنScript", "Ada", "Adenine", "Agda", "Agilent VEE", "Agora", "AIMMS", "Alef", "ALF", "ALGOL 58", "ALGOL 60", "ALGOL 68", "ALGOL W", "Alice", "Alma-0", "AmbientTalk", "Amiga E", "AMOS", "Aم حL", "Apex (حراجیforce.com)", "APL", "AppleScript", "Arc", "ARexx", "Argus", "AspectJ", "Assembly language", "ATS", "Ateji PX", "AutoHotkey", "Autocoder", "AutoIt", "AutoLISP / Visual LISP", "Averest", "AWK", "Axum", "فعال Server صفحات", "ASP.NET", "B", "Babbage", "Bash", "BASIC", "bc", "BCPL", "BeanShell", "Batch (Windows/Dos)", "Bertrand", "BETA", "Bigwig", "Bistro", "BitC", "BLISS", "Blockly", "BlooP", "آبی", "Boo", "Boomerang", "Bourne shell (including bash and ksh)", "BREW", "BPEL", "B", "C--", "C++ – ISO/IEC 14882", "C# – ISO/IEC 23270", "C/AL", "Caché ObjectScript", "C Shell", "Caml", "Cayenne", "CDuce", "Cecil", "Cesil", "Céu", "Ceylon", "CFEngine", "CFML", "Cg", "Ch", "Chapel", "Charity", "Charm", "Chef", "CHILL", "CHIP-8", "chomski", "ChucK", "CICS", "Cilk", "Citrine (programming language)", "CL (IBM)", "Claire", "Clarion", "Clean", "Clipper", "CLIPS", "CLIST", "Clojure", "CLU", "CMS-2", "COBOL – ISO/IEC 1989", "CobolScript – COBOL Scripting language", "Cobra", "CODE", "CoffeeScript", "ColdFusion", "COMAL", "Combined Programming زبان (CPL)", "COMIT", "Common Intermediate زبان (CIL)", "Common Lisp (also known as CL)", "COم حASS", "Component Pascal", "Constraint Handling Rules (CHR)", "COMTRAN", "Converge", "Cool", "Coq", "Coral 66", "Corn", "CorVision", "COWSEL", "CPL", "CPL", "Cryptol", "csh", "Csound", "CSP", "CUDA", "Curl", "Curry", "Cybil", "Cyclone", "Cython", "Java", "جاوا اسکریپت", "M2001", "M4", "M#", "Machine code", "MAD (میشیگان Algorithm Decoder)", "MAD/I", "Magik", "Magma", "make", "Maple", "MAPPER now part of BIS", "MARK-IV now VISION:BUILDER", "مارچy", "MAس م Microsoft Assembly x86", "MATH-MATIC", "Mathematica", "MATLAB", "Maxima (see also Macsyma)", "Max (Max Msp – Graphical Programming Environment)", "میa (MEL)", "MDL", "Mercury", "Mesa", "Metafont", "Microcode", "MicroScript", "MIIS", "Milk (programming language)", "MIMIC", "Mirah", "Miranda", "MIVA Script", "ML", "Model 204", "Modelica", "Modula", "Modula-2", "Modula-3", "Mohol", "MOO", "Mortran", "Mouse", "م حD", "Mathcad", "MSIL – deprecated name for CIL", "MSL", "MUم حS", "Mystic Programming L"],
                                                    blacklist: [".NET", " SQLite"], // <-- passed as an attribute in this demo
                                                })


                                            // "remove all tags" button event listener
                                            document.getElementById('kt_tagify_1_remove').addرویدادلیستener('click', tagify.removeهمهتگ ها.bind(tagify))

                                            // Chainable event listeners
                                            tagify.on('add', onAddTag)
                                                .on('remove', onRemoveTag)
                                                .on('input', onورودی)
                                                .on('edit', onTagEdit)
                                                .on('invalid', onInvalidTag)
                                                .on('click', onTagClick)
                                                .on('dropdown:show', onدراپ دانShow)
                                                .on('dropdown:hide', onدراپ دانسلامde)

                                            // tag added callback
                                            function onAddTag(e) {
                                                console.log("onAddTag: ", e.detail);
                                                console.log("original input value: ", input.value)
                                                tagify.off('add', onAddTag) // exmaple of removing a custom مشخص کردن event
                                            }

                                            // tag remvoed callback
                                            function onRemoveTag(e) {
                                                console.log(e.detail);
                                                console.log("tagify instance value:", tagify.value)
                                            }

                                            // on character(s) added/removed (user is typing/deleting)
                                            function onورودی(e) {
                                                console.log(e.detail);
                                                console.log("onورودی: ", e.detail);
                                            }

                                            function onTagEdit(e) {
                                                console.log("onTagEdit: ", e.detail);
                                            }

                                            // invalid tag added callback
                                            function onInvalidTag(e) {
                                                console.log("onInvalidTag: ", e.detail);
                                            }

                                            // invalid tag added callback
                                            function onTagClick(e) {
                                                console.log(e.detail);
                                                console.log("onTagClick: ", e.detail);
                                            }

                                            function onدراپ دانShow(e) {
                                                console.log("onدراپ دانShow: ", e.detail)
                                            }

                                            function onدراپ دانسلامde(e) {
                                                console.log("onدراپ دانسلامde: ", e.detail)
                                            }
                                        }

                                        var demo2 = function() {
                                            var input = document.getElementById('kt_tagify_2');
                                            var tagify = new مشخص کردن(input, {
                                                enforceWhitelist: true,
                                                whitelist: ["The Shawshank Redemption", "The Godfather", "The Godfather: Part II", "The Dark Knight", "12 Angry Men", "Schindler's لیست", "Pulp Fiction", "The Lord of the Rings: The Return of the King", "The Good, the Bad and the Ugly", "Fight Club", "The Lord of the Rings: The Fellowship of the Ring", "Star Wars: Episode V - The Empire Strikes بازگشت", "Forrest Gump", "Inception", "The Lord of the Rings: The دو Towers", "یک Flew Over the Cuckoo's Nest", "Goodfellas", "The Matrix", "Seven Samurai", "Star Wars: Episode IV - A جدید Hope", "شهر of God", "Se7en", "The Silence of the Lambs", "It's a Wonderful Life", "The Usual Suspects", "Life Is Beautiful", "Léon: The حرفه ای", "Spirited Away", "Saving خصوصی Ryan", "La La Land", "Once Upon a زمان in the West", "آمریکاn تاریخ X", "Interstellar", "کازابلانکا", "Psycho", "شهر Lights", "The Green Mile", "Raiders of the Lost Ark", "The Intouchables", "Modern زمانs", "Rear Window", "The Pianist", "The Departed", "Terminator 2: Judgment روز", "بازگشت to the Future", "Whiplash", "Gladiator", "Memento", "Apocalypse اکنون", "The Prestige", "The Lion King", "Alien", "Dr. Strangelove or: How I اموزشed to Stop Worrying and Love the Bomb", "Sunset Boulevard", "The Great Dictator", "Cinema Paradiso", "The Lives of Others", "Paths of Glory", "Grave of the Fireflies", "Dژوئنgo Unchained", "The Shining", "WALL·E", "آمریکاn Beauty", "The Dark Knight Rises", "Princess Mononoke", "Aliens", "Oldboy", "Once Upon a زمان in آمریکا", "Citizen Kane", "Das Boot", "Witness for the Prosecution", "North by Northwest", "Vertigo", "Star Wars: Episode VI - Return of the Jedi", "Reservoir Dogs", "M", "Braveheart", "Amélie", "Requiem for a Dream", "A Clockwork Orange", "Taxi Driver", "Lawrence of Arabia", "Like Stars on Earth", "Double Indemnity", "To Kill a Mockingbird", "Eternal Sunshine of the Spotless Mind", "Toy Story 3", "Amadeus", "My Father and My Son", "Full Metal Jacket", "The Sting", "2001: A Space Odyssey", "Singin' in the Rain", "Bicycle Thieves", "Toy Story", "Dangal", "The Kid", "Inglourious Basterds", "Snatch", "Monty  MySQL and the Holy Grail", "Hacksaw Ridge", "3 Idiots", "L.A. Confidential", "For a Few Dollars More", "Scarface", "Rashomon", "The Apartment", "The Hunt", "Good Will Hunting", "هندوستان Jones and the Last Crusade", "A Separation", "Metropolis", "Yojimbo", "همه درباره ما Eve", "Batman Begins", "Up", "Some Like It Hot", "The Treasure of the Sierra Madre", "Unforgiven", "Downfall", "Raging Bull", "The Third Man", "Die Hard", "Children of Heaven", "The Great Escape", "Heat", "چینtown", "Inside Out", "Pan's Labyrinth", "Ikiru", "My Neighbor Totoro", "On the Waterfront", "Room", "Ran", "The Gold Rush", "The Secret in Their Eyes", "The Bridge on the River Kwai", "Blade Runner", "Mr. Smith Goes to واشنگتن", "The Seventh Seal", "Howl's Moving Castle", "Lock, موجودی and دو Smoking Barrels", "Judgment at Nuremberg", "Casino", "The Bandit", "Incendies", "A Beautiful Mind", "A Wednesday", "The عمومی", "The Elephant Man", "Wild Strawberries", "Arrival", "V for Vendetta", "Warrior", "The Wolf of Wall Street", "Manchester by the Sea", "Sunrise", "The Passion of Joan of Arc", "Gran Torino", "Rang De Basanti", "Trainspotting", "Dial M for Murder", "The Big Lebowski", "The Deer Hunter", "Tokyo Story", "Gone with the Wind", "Fargo", "Finding Nemo", "The Sixth Sense", "The Thing", "Hera Pheri", "Cool Hand Luke", "Andaz Apna Apna", "Rebecca", "No کشور for Old Men", "How to Train شما Dragon", "Munna Bhai M.B.B.S.", "Sholay", "Kill Bill: Vol. 1", "Into the Wild", "مارچy and Max", "Gone Girl", "There Will Be Blood", "Come and See", "It Happened یک Night", "Life of Brian", "Rush", "Hotel رواندا", "Platoon", "Shutter Island", "خالصwork", "The Wages of Fear", "Stand by Me", "Wild Tales", "In the نام of the Father", "Spotlight", "Star Wars: The Force Awakens", "The Nights of Cabiria", "The 400 Blows", "Butch Cassidy and the Sundance Kid", "Mad Max: Fury Road", "The مالتیایی Falcon", "12 سالs a Slave", "Ben-Hur", "The Grand Budapest Hotel", "شخصa", "Million Dollar Baby", "Amores Perros", "Jurassic Park", "The Princess Bride", "Hachi: A Dog's Tale", "Memories of Murder", "Stalker", "Nausicaä of the Valley of the Wind", "Drishyam", "The Truman Show", "The Grapes of Wrath", "Before Sunrise", "Touch of Evil", "Annie Hall", "The پیام", "Rocky", "Gandhi", "Harry Potter and the Deathly Hallows: Part 2", "The Bourne Ultimatum", "Diabolique", "Donnie Darko", "Monsters, Inc.", "Prisoners", "8½", "The Terminator", "The ویزارد of Oz", "Catch Me If شما Can", "Groundhog روز", "Twelve Monkeys", "Zootopia", "La Haine", "Barry Lyndon", "Jaws", "The Best سالs of Our Lives", "Infernal Affairs", "Udaan", "The Battle of Algiers", "Strangers on a Train", "Dog روز Afternoon", "Sin شهر", "Kind Hearts and Coronets", "Gangs of Wasseypur", "The راهنما"],
                                                callbacks: {
                                                    add: console.log, // callback when adding a tag
                                                    remove: console.log // callback when removing a tag
                                                }
                                            });
                                        }

                                        var demo3 = function() {
                                            var input = document.getElementById('kt_tagify_3');

                                            // init مشخص کردن script on the above inputs
                                            var tagify = new مشخص کردن(input);

                                            // add a class to مشخص کردن's input element
                                            //tagify.DOM.input.classلیست.remove('tagify__input');
                                            tagify.DOM.input.classلیست.add('form-control');
                                            tagify.DOM.input.setAttribute('placeholder', 'enter tag...');

                                            // re-place مشخص کردن's input element outside of the  element (tagify.DOM.scope), just before it
                                            tagify.DOM.scope.parentNode.insertBefore(tagify.DOM.input, tagify.DOM.scope);
                                        }

                                        var demo4 = function() {
                                            var input = document.getElementById('kt_tagify_4');
                                            var tagify = new مشخص کردن(input, {
                                                pattern: /^.{0,20}دلار/, // اعتبارسنجی typed tag(s) by Regex. Here maximum chars length is defined as "20"
                                                delimiters: ", ", // add new tags when a comma or a space character is entered
                                                maxتگ ها: 6,
                                                blacklist: ["fuck", "shit", "pussy"],
                                                keepInvalidتگ ها: true, // do not remove invalid tags (but keep them marked as invalid)
                                                whitelist: ["temple", "stun", "detective", "sign", "passion", "routine", "deck", "discriminate", "relaxation", "fraud", "attractive", "soft", "forecast", "point", "thank", "stage", "eliminate", "effective", "flood", "passive", "skilled", "separation", "مخاطب", "compromise", "reality", "district", "nationalist", "leg", "porter", "conviction", "worker", "vegetable", "commerce", "conception", "particle", "honor", "stick", "tail", "pumpkin", "core", "mouse", "egg", "population", "unique", "behavior", "onion", "disaster", "cute", "pipe", "sock", "dialect", "horse", "swear", "owner", "cope", "global", "improvement", "artist", "shed", "constant", "bond", "brink", "shower", "spot", "inject", "bowel", "homosexual", "trust", "exclude", "tough", "sickness", "prevalence", "sister", "resolution", "cattle", "cultural", "innocent", "burial", "bundle", "thaw", "respectable", "thirsty", "exposure", "team", "creed", "facade", "calendar", "filter", "utter", "dominate", "predator", "discover", "theorist", "hospitality", "damage", "woman", "rub", "crop", "unpleasant", "halt", "inch", "birthday", "lack", "throne", "maximum", "pause", "digress", "fossil", "policy", "instrument", "trunk", "frame", "measure", "hall", "support", "convenience", "house", "partnership", "inspector", "looting", "ranch", "asset", "rally", "explicit", "leak", "monarch", "ethics", "applied", "aviation", "dentist", "great", "ethnic", "sodium", "truth", "constellation", "lease", "guide", "break", "conclusion", "button", "recording", "horizon", "council", "paradox", "bride", "weigh", "like", "noble", "transition", "accumulation", "arrow", "stitch", "academy", "glimpse", "case", "researcher", "constitutional", "notion", "bathroom", "revolutionary", "soldier", "vehicle", "betray", "gear", "pan", "quarter", "embarrassment", "golf", "shark", "constitution", "club", "college", "duty", "eaux", "know", "collection", "burst", "fun", "animal", "expectation", "persist", "insure", "tick", "account", "initiative", "tourist", "member", "example", "plant", "river", "ratio", "view", "coast", "latest", "invite", "help", "falsify", "allocation", "degree", "feel", "resort", "means", "excuse", "injury", "pupil", "shaft", "allow", "ton", "tube", "dress", "speaker", "double", "theater", "opposed", "holiday", "screw", "cutting", "picture", "laborer", "conservation", "kneel", "miracle", "primary", "nomination", "characteristic", "referral", "carbon", "valley", "hot", "climb", "wrestle", "motorist", "update", "loot", "mosquito", "delivery", "eagle", "guideline", "hurt", "feedback", "finish", "traffic", "competence", "serve", "archive", "feeling", "hope", "seal", "ear", "oven", "vote", "ballot", "study", "negative", "declaration", "particular", "pattern", "suburb", "intervention", "brake", "frequency", "drink", "affair", "contemporary", "prince", "dry", "mole", "lazy", "undermine", "radio", "legislation", "circumstance", "bear", "left", "pony", "industry", "mastermind", "criticism", "sheep", "failure", "chain", "depressed", "launch", "script", "green", "weave", "please", "surprise", "doctor", "revive", "banquet", "belong", "correction", "door", "image", "integrity", "intermediate", "sense", "formal", "cane", "gloom", "toast", "pension", "exception", "prey", "random", "nose", "predict", "needle", "satisfaction", "establish", "fit", "vigorous", "urgency", "X-ray", "equinox", "variety", "proclaim", "conceive", "bulb", "vegetarian", "available", "stake", "publicity", "strikebreaker", "portrait", "sink", "frog", "ruin", "studio", "match", "electron", "captain", "channel", "navy", "set", "recommend", "appoint", "liberal", "missile", "sample", "result", "poor", "efflux", "glance", "timetable", "advertise", "personality", "aunt", "dog"],
                                                transformTag: transformTag,
                                                dropdown: {
                                                    enabled: 3,
                                                }
                                            });

                                            function transformTag(tagData) {
                                                var states = [
                                                    'success',
                                                    'primary',
                                                    'danger',
                                                    'success',
                                                    'warning',
                                                    'dark',
                                                    'primary',
                                                    'info'];

                                                tagData.class = 'tagify__tag tagify__tag--' + states[KTUtil.getRandomInt(0, 7)];

                                                if (tagData.value.toLowerCase() == 'shit') {
                                                    tagData.value = 's✲✲t'
                                                }
                                            }

                                            tagify.on('add', function(e) {
                                                console.log(e.detail)
                                            });

                                            tagify.on('invalid', function(e) {
                                                console.log(e, e.detail);
                                            });
                                        }

                                        var demo5 = function() {
                                            // Init autocompletes
                                            var toEl = document.getElementById('kt_tagify_5');
                                            var tagifyTo = new مشخص کردن(toEl, {
                                                delimiters: ", ", // add new tags when a comma or a space character is entered
                                                maxتگ ها: 10,
                                                blacklist: ["fuck", "shit", "pussy"],
                                                keepInvalidتگ ها: true, // do not remove invalid tags (but keep them marked as invalid)
                                                whitelist: [
                                                    {
                                                    value : 'کریس مولر',
                                                    email : 'chris.muller@wix.com',
                                                    initials: '',
                                                    initialsاستان: '',
                                                    pic: './assets/media/users/100_11.jpg',
                                                    class : 'tagify__tag--primary'
                                                }, {
                                                    value : 'نوید برچسته',
                                                    email : 'nick.seo@gmail.com',
                                                    initials: 'SS',
                                                    initialsاستان: 'warning',
                                                    pic: ''
                                                }, {
                                                    value : 'Alon Silko',
                                                    email : 'alon@keenthemes.com',
                                                    initials: '',
                                                    initialsاستان: '',
                                                    pic: './assets/media/users/100_6.jpg'
                                                }, {
                                                    value : 'Sam محسنic',
                                                    email : 'sam.senic@loop.com',
                                                    initials: '',
                                                    initialsاستان: '',
                                                    pic: './assets/media/users/100_8.jpg'
                                                }, {
                                                    value : 'Sara Loran',
                                                    email : 'sara.loran@tilda.com',
                                                    initials: '',
                                                    initialsاستان: '',
                                                    pic: './assets/media/users/100_9.jpg'
                                                }, {
                                                    value : 'Eric Davok',
                                                    email : 'davok@mix.com',
                                                    initials: '',
                                                    initialsاستان: '',
                                                    pic: './assets/media/users/100_13.jpg'
                                                }, {
                                                    value : 'Sam محسنic',
                                                    email : 'sam.senic@loop.com',
                                                    initials: '',
                                                    initialsاستان: '',
                                                    pic: './assets/media/users/100_13.jpg'
                                                }, {
                                                    value : 'Lina Nilson',
                                                    email : 'lina.nilson@loop.com',
                                                    initials: 'LN',
                                                    initialsاستان: 'danger',
                                                    pic: './assets/media/users/100_15.jpg'
                                                }],
                                                templates: {
                                                    dropdownItem : function(tagData){
                                                        try{
                                                            return '<div class="tagify__dropdown__item">' +
                                                                '<div class="kt-media-card">' +
                                                                '    <span class="kt-media kt-media--'+(tagData.initialsاستان?tagData.initialsاستان:'')+'" style="background-image: url('+tagData.pic+')">' +
                                                                '        <span>'+tagData.initials+'</span>' +
                                                                '    </span>' +
                                                                '    <div class="kt-media-card__info">' +
                                                                '        <a href="#" class="kt-media-card__title">'+tagData.value+'</a>' +
                                                                '        <span class="kt-media-card__desc">'+tagData.email+'</span>' +
                                                                '    </div>' +
                                                                '</div>' +
                                                                '</div>';
                                                        }
                                                        catch(err){}
                                                    }
                                                },
                                                transformTag: function(tagData) {
                                                    tagData.class = 'tagify__tag tagify__tag--primary';
                                                },
                                                dropdown : {
                                                    classname : "color-blue",
                                                    enabled   : 1,
                                                    maxItems  : 5
                                                }
                                            });
                                        }

                                        var demo6 = function() {
                                            var input = document.getElementById('kt_tagify_6');
                                            var tagify = new مشخص کردن(input, {
                                                pattern: /^.{0,20}دلار/, // اعتبارسنجی typed tag(s) by Regex. Here maximum chars length is defined as "20"
                                                delimiters: ", ", // add new tags when a comma or a space character is entered
                                                maxتگ ها: 6,
                                                blacklist: ["fuck", "shit", "pussy"],
                                                keepInvalidتگ ها: true, // do not remove invalid tags (but keep them marked as invalid)
                                                whitelist: ["temple", "stun", "detective", "sign", "passion", "routine", "deck", "discriminate", "relaxation", "fraud", "attractive", "soft", "forecast", "point", "thank", "stage", "eliminate", "effective", "flood", "passive", "skilled", "separation", "مخاطب", "compromise", "reality", "district", "nationalist", "leg", "porter", "conviction", "worker", "vegetable", "commerce", "conception", "particle", "honor", "stick", "tail", "pumpkin", "core", "mouse", "egg", "population", "unique", "behavior", "onion", "disaster", "cute", "pipe", "sock", "dialect", "horse", "swear", "owner", "cope", "global", "improvement", "artist", "shed", "constant", "bond", "brink", "shower", "spot", "inject", "bowel", "homosexual", "trust", "exclude", "tough", "sickness", "prevalence", "sister", "resolution", "cattle", "cultural", "innocent", "burial", "bundle", "thaw", "respectable", "thirsty", "exposure", "team", "creed", "facade", "calendar", "filter", "utter", "dominate", "predator", "discover", "theorist", "hospitality", "damage", "woman", "rub", "crop", "unpleasant", "halt", "inch", "birthday", "lack", "throne", "maximum", "pause", "digress", "fossil", "policy", "instrument", "trunk", "frame", "measure", "hall", "support", "convenience", "house", "partnership", "inspector", "looting", "ranch", "asset", "rally", "explicit", "leak", "monarch", "ethics", "applied", "aviation", "dentist", "great", "ethnic", "sodium", "truth", "constellation", "lease", "guide", "break", "conclusion", "button", "recording", "horizon", "council", "paradox", "bride", "weigh", "like", "noble", "transition", "accumulation", "arrow", "stitch", "academy", "glimpse", "case", "researcher", "constitutional", "notion", "bathroom", "revolutionary", "soldier", "vehicle", "betray", "gear", "pan", "quarter", "embarrassment", "golf", "shark", "constitution", "club", "college", "duty", "eaux", "know", "collection", "burst", "fun", "animal", "expectation", "persist", "insure", "tick", "account", "initiative", "tourist", "member", "example", "plant", "river", "ratio", "view", "coast", "latest", "invite", "help", "falsify", "allocation", "degree", "feel", "resort", "means", "excuse", "injury", "pupil", "shaft", "allow", "ton", "tube", "dress", "speaker", "double", "theater", "opposed", "holiday", "screw", "cutting", "picture", "laborer", "conservation", "kneel", "miracle", "primary", "nomination", "characteristic", "referral", "carbon", "valley", "hot", "climb", "wrestle", "motorist", "update", "loot", "mosquito", "delivery", "eagle", "guideline", "hurt", "feedback", "finish", "traffic", "competence", "serve", "archive", "feeling", "hope", "seal", "ear", "oven", "vote", "ballot", "study", "negative", "declaration", "particular", "pattern", "suburb", "intervention", "brake", "frequency", "drink", "affair", "contemporary", "prince", "dry", "mole", "lazy", "undermine", "radio", "legislation", "circumstance", "bear", "left", "pony", "industry", "mastermind", "criticism", "sheep", "failure", "chain", "depressed", "launch", "script", "green", "weave", "please", "surprise", "doctor", "revive", "banquet", "belong", "correction", "door", "image", "integrity", "intermediate", "sense", "formal", "cane", "gloom", "toast", "pension", "exception", "prey", "random", "nose", "predict", "needle", "satisfaction", "establish", "fit", "vigorous", "urgency", "X-ray", "equinox", "variety", "proclaim", "conceive", "bulb", "vegetarian", "available", "stake", "publicity", "strikebreaker", "portrait", "sink", "frog", "ruin", "studio", "match", "electron", "captain", "channel", "navy", "set", "recommend", "appoint", "liberal", "missile", "sample", "result", "poor", "efflux", "glance", "timetable", "advertise", "personality", "aunt", "dog"],
                                                transformTag: transformTag,
                                                dropdown: {
                                                    enabled: 3,
                                                }
                                            });

                                            function transformTag(tagData) {
                                                var states = [
                                                    'success',
                                                    'primary',
                                                    'danger',
                                                    'success',
                                                    'warning',
                                                    'dark',
                                                    'primary',
                                                    'info'];

                                                tagData.class = 'tagify__tag tagify__tag-light--' + states[KTUtil.getRandomInt(0, 7)];

                                                if (tagData.value.toLowerCase() == 'shit') {
                                                    tagData.value = 's✲✲t'
                                                }
                                            }

                                            tagify.on('add', function(e) {
                                                console.log(e.detail)
                                            });

                                            tagify.on('invalid', function(e) {
                                                console.log(e, e.detail);
                                            });
                                        }
                                        return {
                                            // public functions
                                            init: function() {
                                                demo1();
                                                demo2();
                                                demo3();
                                                demo4();
                                                demo5();
                                                demo6();
                                            }
                                        };
                                    }();

                                    jQuery(document).ready(function() {
                                        KTمشخص کردن.init();
                                    });
                                
در این مثال ، زمینه با 4 برچسب از قبل اشغال شده است. آخرین برچسب (CSS) همان مقدار برچسب اول را دارد و حذف می شود ، زیرا تنظیم تکراری درست است.
اینپوت با خصوصیت فقط خواندنی بنابراین نمی توانید به صورت دستی برچسبی اضافه کنید
سه برچسب در لیست قرار گرفته است و غیر از این 3 برچسب امکان افزودن برچسب دیگری نیست
دراپ دان item and tag templates.
بعد از افزودن برچسب و تایید آن درون یک باکس کوچک بیرون از اینپوت قرار میگیرد
در این مثال روی حداقل تایپ 3 کاراکتر ست شده است. و حداکثر نمایش 6 برچسب
در این مثال روی حداقل تایپ 3 کاراکتر ست شده است. و حداکثر نمایش 6 برچسب

اعلان ها 24 جدید

اقدامات سریع امور مالی

پروفایل کاربر 12 پیام

آخرین اعلان ها
اهداف دیگر موعد 2 روز
+28%
+50%
بهترین محصول موعد 2 روز
+8%
پیام های سیستم
نویسندگان برتر موفق ترین ها
+82دلار
نویسندگان محبوب موفق ترین ها
+280دلار
کاربران جدید موفق ترین ها
+4500دلار
فعال مشتریان موفق ترین ها
+4500دلار
تم پرفروش موفق ترین ها
+4500دلار
اعلان ها
اهداف دیگر موعد 2 روز
+28%
+50%
بهترین محصول موعد 2 روز
+8%
مراقبت از مشتری
گزارشات
اعضا

انتخاب نسخه ی نمایشی

نسخه ی نمایشی 1
نسخه ی نمایشی 2
نسخه ی نمایشی 3
نسخه ی نمایشی 4
نسخه ی نمایشی 5
نسخه ی نمایشی 6
نسخه ی نمایشی 7
نسخه ی نمایشی 8
نسخه ی نمایشی 9
نسخه ی نمایشی 10
نسخه ی نمایشی 11
نسخه ی نمایشی 12
نسخه ی نمایشی 13
نسخه ی نمایشی 14
نسخه ی نمایشی 15
نسخه ی نمایشی 16
نسخه ی نمایشی 17
نسخه ی نمایشی 18
نسخه ی نمایشی 19
نسخه ی نمایشی 20
نسخه ی نمایشی 21
نسخه ی نمایشی 22
نسخه ی نمایشی 23
نسخه ی نمایشی 24
نسخه ی نمایشی 25
نسخه ی نمایشی 26
نسخه ی نمایشی 27
نسخه ی نمایشی 28
نسخه ی نمایشی 29
نسخه ی نمایشی 30