Skip to content
This repository was archived by the owner on Sep 10, 2023. It is now read-only.

Commit 576340f

Browse files
raihan2006iraihan2006i
committed
Implemented setOptions() function
Store settings/options in element's data object so that we can change option for each element So that we can change settings at anytime Following example shows that we can change propertyToSearch and hintText at anytime we want Example: $(document).ready(function() { $(element).tokenInput([{ "first_name": "Arthur", "last_name": "Godfrey", "email": "arthur_godfrey@nccu.edu", "url": "https://si0.twimg.com/sticky/default_profile_images/ }, { "first_name": "Adam", "last_name": "Johnson", "email": "wravo@yahoo.com", "url": "https://si0.twimg.com/sticky/default_profile_images/ }], {propertyToSearch: "first_name"} ); }); Later we can do followings at anytime $(element).tokenInput("setOptions", {propertyToSearch: 'first_name', hintText: "Type first name here to search"}); $(element).tokenInput("setOptions", {propertyToSearch: 'last_name', hintText: "Type last name here to search"}); $(element).tokenInput("setOptions", {propertyToSearch: 'email', hintText: "Type email here to search"}); $(element).tokenInput("setOptions", {propertyToSearch: 'url', hintText: "Type url here to search"}); Check *Change propertyToSearch anytime* demo in demo.html file
1 parent 641b6dd commit 576340f

2 files changed

Lines changed: 284 additions & 88 deletions

File tree

‎demo.html‎

Lines changed: 191 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -456,7 +456,197 @@ <h2>Local Data Search with custom propertyToSearch, resultsFormatter and tokenFo
456456
</script>
457457
</div>
458458

459+
<h2>Change propertyToSearch anytime</h2>
460+
<div>
461+
<input type="text" id="demo-input-change-propertytosearch-anytime" name="blah" />
462+
Search by :<input type="radio" checked="checked" name="search_key" value="first_name" /> First Name
463+
<input type="radio" name="search_key" value="last_name" /> Last Name
464+
<input type="radio" name="search_key" value="email" /> Email
465+
<input type="radio" name="search_key" value="url" /> Url <br />
466+
<input type="button" value="Submit" />
467+
<script type="text/javascript">
468+
$(document).ready(function() {
469+
$('input[name="search_key"]').click(function() {
470+
$("#demo-input-change-propertytosearch-anytime").tokenInput("setOptions", {propertyToSearch: $(this).val(), hintText: "Type "+$(this).val()+" here to search"});
471+
});
459472

473+
$("#demo-input-change-propertytosearch-anytime").tokenInput([{
474+
"first_name": "Arthur",
475+
"last_name": "Godfrey",
476+
"email": "arthur_godfrey@nccu.edu",
477+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
478+
},
479+
{
480+
"first_name": "Adam",
481+
"last_name": "Johnson",
482+
"email": "wravo@yahoo.com",
483+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
484+
},
485+
{
486+
"first_name": "Jeff",
487+
"last_name": "Johnson",
488+
"email": "bballnine@hotmail.com",
489+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
490+
},
491+
{
492+
"first_name": "Adriana",
493+
"last_name": "Jameson",
494+
"email": "adriana.jameson@gmail.com",
495+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
496+
},
497+
{
498+
"first_name": "Adriano",
499+
"last_name": "Pooley",
500+
"email": "adrianolpooley@lautau.com.br",
501+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
502+
},
503+
{
504+
"first_name": "Alcir",
505+
"last_name": "Reis",
506+
"email": "alcirreis@yahoo.com",
507+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
508+
},
509+
{
510+
"first_name": "Jack",
511+
"last_name": "Cunningham",
512+
"email": "jcunningham@hotmail.com",
513+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
514+
},
515+
{
516+
"first_name": "Alejandro",
517+
"last_name": "Forbes",
518+
"email": "alejandforbes@gmail.com",
519+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
520+
},
521+
{
522+
"first_name": "Alessandra",
523+
"last_name": "Mineiro",
524+
"email": "alc_mineiro@aol.com",
525+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
526+
},
527+
{
528+
"first_name": "Alex",
529+
"last_name": "Frazo",
530+
"email": "alex.frazo@yahoo.com",
531+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
532+
},
533+
{
534+
"first_name": "Alexandre",
535+
"last_name": "Crawford",
536+
"email": "xandycrawford@gmail.com",
537+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
538+
},
539+
{
540+
"first_name": "Alexandre",
541+
"last_name": "Lalwani",
542+
"email": "alexandrelalwani@globo.com",
543+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
544+
},
545+
{
546+
"first_name": "Alexandre",
547+
"last_name": "Jokos",
548+
"email": "alex.jokos@gmail.com.br",
549+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
550+
},
551+
{
552+
"first_name": "Alexandre",
553+
"last_name": "Paro",
554+
"email": "alexandre.paro@uol.com.br",
555+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
556+
},
557+
{
558+
"first_name": "Andre",
559+
"last_name": "Niemeyer",
560+
"email": "a.niemeyer@globo.com",
561+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
562+
},
563+
{
564+
"first_name": "Alyssa",
565+
"last_name": "Fortes",
566+
"email": "afort287@yahoo.com",
567+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
568+
},
569+
{
570+
"first_name": "Amit",
571+
"last_name": "Alvarenga",
572+
"email": "amit.alva@gmail.com",
573+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
574+
},
575+
{
576+
"first_name": "Ana Bia",
577+
"last_name": "Borges",
578+
"email": "abborges@gmail.com",
579+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
580+
},
581+
{
582+
"first_name": "Ana",
583+
"last_name": "Akamine",
584+
"email": "ana.akamine@uol.com.br",
585+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
586+
},
587+
{
588+
"first_name": "Anderson",
589+
"last_name": "Tovoros",
590+
"email": "alvarenga.tovoros@gmail.com",
591+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
592+
},
593+
{
594+
"first_name": "Andre",
595+
"last_name": "Borges",
596+
"email": "andreborges@hotmail.com",
597+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
598+
},
599+
{
600+
"first_name": "Andre",
601+
"last_name": "Wexler",
602+
"email": "andre.wexler@aol.com.br",
603+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
604+
},
605+
{
606+
"first_name": "Andre",
607+
"last_name": "Williams",
608+
"email": "awilly@yahoo.com",
609+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
610+
},
611+
{
612+
"first_name": "Andre",
613+
"last_name": "Sanford",
614+
"email": "andre.sanford@gmail.com",
615+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
616+
},
617+
{
618+
"first_name": "Andre",
619+
"last_name": "Wayne",
620+
"email": "andrewayne@uol.com.br",
621+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
622+
},
623+
{
624+
"first_name": "Andre",
625+
"last_name": "Jackson",
626+
"email": "andre.jackson@yahoo.com",
627+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
628+
},
629+
{
630+
"first_name": "Andre",
631+
"last_name": "Jolly",
632+
"email": "andre.jolly@uol.com.br",
633+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
634+
},
635+
{
636+
"first_name": "Andre",
637+
"last_name": "Henderson",
638+
"email": "andre.henderson@globo.com",
639+
"url": "https://si0.twimg.com/sticky/default_profile_images/default_profile_2_normal.png"
640+
}
641+
], {
642+
propertyToSearch: "first_name",
643+
resultsFormatter: function(item){ return "<li>" + "<img src='" + item.url + "' title='" + item.first_name + " " + item.last_name + "' height='25px' width='25px' />" + "<div style='display: inline-block; padding-left: 10px;'><div class='first_name'>" + item.first_name + " " + item.last_name + "</div><div class='email'>" + item.email + "</div><div class='url'>" + item.url + "</div></div></li>" },
644+
tokenFormatter: function(item) { return "<li><p>" + item.first_name + " " + item.last_name + "</p></li>" },
645+
});
646+
});
647+
</script>
648+
</div>
649+
460650
<h2>Start disabled</h2>
461651
<div>
462652
<input type="text" id="demo-input-disabled" name="blah" />
@@ -488,5 +678,6 @@ <h2>Start disabled</h2>
488678
</script>
489679
</div>
490680

681+
491682
</body>
492683
</html>

0 commit comments

Comments
 (0)