TAGS :Viewed: 8 - Published at: a few seconds ago

[ Unexpected results with jQuery-TokenInput pre-populated Data changes ]

I am getting unexpected results with jQuery-TokenInput pre_populated data-set changes.
I have followed the Railscasts - Token Fields and updated the necessary code with Railscasts - Token Fields Revised source code acc. to the newest Rails version.

My coffeescript code that handles the token search query is:

jQuery ->
$('#user_tracker_ids').tokenInput '/trackers.json'
prePopulate: $('#user_tracker_ids').data('load')
minChars: 3
hintText: "Type in name"
preventDuplicates : true

My Strange results are:

  1. CASE 1: [Initial case][CORRECT]
    When the token-field is empty i.e no pre-populated data, and I enter any no. of tokens, I get the ID's associated with the tokens at my server-side action, which is correct.

  2. CASE 2: [Ending case ][CORRECT]
    When I remove all the ID's entered before i.e I remove all the pre-populated data, I get 0 ids, which is also correct.

  3. CASE 3: [Failing case][WRONG]
    When there are already values in the token-input, and I update them, e.g add more tokens, remove some of the existing tokens, I only get the ID's of the token's that were added in the current edit session. Changes made to the pre-populated data in the query-tokenInput are not sent to the server-side action.

I'm sure I'm missing some nitty-gritty setting here, but I'm unable to find it and fix it.
If you need more info. to locate the issue, please let me know.

Answer 1


Use this

                $(elementId).tokenInput("",
                {
                    prePopulate:JSON.parse(YourJsonFormatStringHere)
                });

Answer 2


It was a mistake at my end, and a stupid one indeed.
prePopulate: $('#user_tracker_ids').data('load')

In the input to prePopulate call, the data being sent was incomplete. I was only passing the name field for the objects and didn't pass the id field.

Hence, token-input was able to properly show the names for the pre-populated data, but any change made to it was not reflected, as I mentioned in my question above.