Question

In my controller action, I call a method that returns me a a list of missing files. From here, I return this list to the .js file using Json:

foreach (string s in result.Value.MissingImages)
{
            missingImages.Add(s.ToString());
}
return Json(new { returnVal= missingImages });

On the .js file, I would like to display a list of these files to the users. How should I process and display this list on the front end?

$("#Images").click(function () {
            $.post('/File/ImageUtil', function (data) {                              
                //display the missing file list to the user here??             
            });
        });

Answer 1

You could define a result placeholder:

<div id="result"></div>

and then loop through the returned collection of strings and inject them into the result:

$("#Images").click(function () {
    $.post('/File/ImageUtil', function (data) {
        var result = $('#result');
        result.empty();
        $.each(data.returnVal, function() {
            result.append(
                $('<div/>', {
                    text: this
                })
            );
        });
    });
});