CODEWITHSUNDEEP
eventstag-itclick
Attila Naghi
Attila Naghi

Reputation: 2686

How can i prepopulate(tagit) the input by onclick event using tag-it plugin in jQuery?

this is the html and js part. So as you can see when i clicked on the class(reply) I have to select an option from the dropdown. I do not want that. I want to be prepopulated (tagit) when i clicked on the class (reply). How can i do that ? thx

   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/tag-it.js" type="text/javascript" charset="utf-8"></script>

<p class = "reply">Reply</p>

<input id="tos" name="tos" >
<script type="text/javascript">

    $(document).ready(function () {

    });
    $(".reply").click(function(){
        reply_person = "AAAAA,BBBBB,CCCCC";
        var tag = reply_person.split(","); 
        //$('#tos').tagit('createTag', "tag");
        $('#tos').tagit({
            availableTags: tag,
            showAutocompleteOnFocus: true
        });
    });
</script>

Upvotes: 0

Views: 1184

Answers (1)

Chris
Chris

Reputation: 6042

You're nearly there - two problems I can see.

  1. You need to initialise the plug-in within document.ready before you add the tokens.
  2. I'm not sure if you can add an array of tokens like that, or if you'll need to add them individually.

Try something like this:

$(document).ready(function () {
   $('#tos').tagit({
       availableTags: tag,
       showAutocompleteOnFocus: true
   });
});

 $(".reply").click(function(){
   reply_person = "AAAAA,BBBBB,CCCCC";
   var tag = reply_person.split(",");
   $.each( tag, function( key, single_tag ) {
       $('#tos').tagit('createTag', single_tag);
   });

});

Upvotes: 1

Related Questions