JSGrid Img Field (source: http://jsfiddle.net/ccy9u7pa/125/)

fiddle.html

<div id="jsgrid"></div>
<div id="dialog" title="Image Full Size View">
    <img id="imagePreview" />
</div>

fiddle.js

var data = [
    { Name: "John", Img: "https://images-fe.ssl-images-amazon.com/images/I/41mIoCf0XNL._AC_US160_.jpg" },
    { Name: "Jimmy", Img: "https://images-fe.ssl-images-amazon.com/images/I/41mIoCf0XNL._AC_US160_.jpg" },
    { Name: "Tom", Img: "https://images-fe.ssl-images-amazon.com/images/I/41mIoCf0XNL._AC_US160_.jpg" },
    { Name: "Frank", Img: "https://images-fe.ssl-images-amazon.com/images/I/41mIoCf0XNL._AC_US160_.jpg" },
    { Name: "Peter", Img: "https://images-fe.ssl-images-amazon.com/images/I/41mIoCf0XNL._AC_US160_.jpg" }
];

$("#dialog").dialog({
    modal: true,
    autoOpen: false,
    position: { 
        my: "center",
        at: "center",
        of: $("#jsgrid")
    }
});

$("#jsgrid").jsGrid({
    autoload: true,
    width: 350,
    filtering: true,
    inserting: true,
    controller: {
        loadData: function(filter) {
            return !filter.Name 
                ? data
                : $.grep(data, function(item) { return item.Name.indexOf(filter.Name) > -1; });
            
            // use ajax request to load data from the server
            /*
            return $.ajax({
                method: "GET",
                url: "/YourUrlToAddItemFilteringScript",
                data: filter
            });
            */
        },
        insertItem: function(insertingItem) {
            var formData = new FormData();
            formData.append("Name", insertingItem.Name);
            formData.append("Img[]", insertingItem.Img, insertingItem.Img.name);
            
            return $.ajax({
                method: "post",
                type: "POST",
                url: "/YourUrlToAddItemAndSaveImage",
                data: formData,
                contentType: false,
                processData: false
            });
        }        
    },
    fields: [
        {
            name: "Img",
            itemTemplate: function(val, item) {
                return $("<img>").attr("src", val).css({ height: 50, width: 50 }).on("click", function() {
                    $("#imagePreview").attr("src", item.Img);
                    $("#dialog").dialog("open");
                });
            },
            insertTemplate: function() {
                var insertControl = this.insertControl = $("<input>").prop("type", "file");
                return insertControl;
            },
            insertValue: function() {
                return this.insertControl[0].files[0]; 
            },
            align: "center",
            width: 120
        },
        { type: "text", name: "Name" },
        { type: "control", editButton: false }
    ]
});

great