Autosuggest tag-it jquery - how to get the ID AND Title on postback?

Viewed 960

I am using this autosuggest plugin: http://aehlke.github.com/tag-it/

I am getting an array of items from a database (right now just a plain Array). The list includes ID and Title. When I submit my form I would like to get both the ID and Title. Right now I only able to get Title. I want to get both values, so that new References (ID=0) can be created, and existing ones can just be inserted without any database lookup.

This is my code.

Codebehind for the book.aspx - book.aspx.cs:

    ...

    protected void btnSave_Click(object sender, EventArgs e)
    {
        Response.Write(txtReferences.Text); // this contains Titles, but I would like both values.
    }

    public class Reference
    {
        public string Title;
        public int ID;
    }

    [WebMethod]
    public static Array GetReferences(string title)
    {
        // this will be replaced by lookup in database.
        List<Reference> References = new List<Reference>{
            new Reference{ID=1, Title="My ref 1"},
            new Reference{ID=2, Title="Ref ref 2"},
            new Reference{ID=3, Title="Blah ref 3"},
            new Reference{ID=0, Title=title} // for new tags set ID 0 to indicate that this should be created in db
        };

        return References.ToArray();
    }
    ....

This is my current script:

<script type="text/javascript">
$(document).ready(function () {
    var failure = function (result) {
        alert(result.status + " " + result.statusText);
    }

        var ref = $("#<%=txtReferences.ClientID %>");
    ref.tagit({
        allowSpaces: true,
        removeConfirmation: true,
        tagSource: function (title, showChoices) {
            var params = '{"title":"' + title.term + '"}';
            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                error: failure,
                url: "book.aspx/GetReferences",
                data: params,
                success: function (data) {
                    var assigned = ref.tagit("assignedTags");
                    var filtered = [];
                    for (var i = 0; i < data.d.length; i++) {
                        if ($.inArray(data.d[i].Title, assigned) == -1) { filtered.push(data.d[i].Title); }
                    }
                    showChoices(filtered);
                }
            });
        }
    });
});
</script>

And of course I have a textbox on the book.aspx page:

<asp:TextBox ID="txtReferences" runat="server" />

Any help is welcome. Thanks.

1 Answers
Related