Transfer data between Entity Framework and jQuery?

Question

I'm using Tag-it jquery plugin this plugin use variable called "sampleTags" to store some values to use it when users write something to give them auto complete functionality.

var sampleTags = ['c++', 'java', 'php', 'coldfusion']

My questions are:

1. I retrieve my tags name from table called tblTags using EF like this

   Array MyTags=db.tblTags.ToArray();  
   

   I use asp.net mvc, How I can put the values of MyTags inside sampleTags so that i give my user auto complete functionality that depend on my data?

2. How I do validate the data entered by my users and update my database?

This way did not worked with me

    $(function () {       
        var sampleTags = new Array();

        $.ajax({
            url: '/mp3/GetTags',
            type: 'POST',
            contentType: 'application/json; charset=utf-8',
            failure: function () { 
                 alert('Error contacting service!'); 
            },
            success: function (data) {
                for (var j = 0; j < data.d.length; j++) {
                    // Now you can use something like data.d[j].studentID;
                    sampleTags[j] = data.d[j].item;
                }

                $('#allowSpacesTags').tagit({
                    availableTags: sampleTags,
                    allowSpaces: true
                });
            }
        });
    });

Answer 1

Personally not a fan of viewBag, but regardless, I like to use the return JSON method for passing data back from the controller to the view:

public JsonResult someMethod()
{
    //populate your tags into say, tagX
    return Json(tagX);
}

Then on the JavaScript side, receive JSON data via a $.ajax() call with dataType set to JSON with POST, and then deserialize as needed / convert to JavaScript array if your plugin needs that.

To answer your comment about deserializing:

$.ajax({
                    url: '../WebServices/SomeService.asmx/SomeSearch',
                    type: 'POST',
                    data: "{'jsonFilterObject':" + JSON.stringify(jsonFilterObject) + "}",
                    contentType: 'application/json; charset=utf-8',
                    failure: function () { alert('Error contacting service!'); },
                    success: function (data) {
                        for (var j = 0; j < data.d.length; j++) {
                            //Now you can use something like data.d[j].studentID;
}
                    });

Answer 2

You could set your MyTags variable to a ViewBag, and set your ViewBag content to sampleTags or check if sampleTags has a function that receives Json.