Как просмотреть изображение из папки, а также из базы данных по нажатию кнопки, как file type = "file" в Asp.net c # mvc

Question

** Это окно модели как всплывающее окно

     Layout = "~/Views/Shared/_LayoutModalPop.cshtml"; } @using (Html.BeginForm("PostUpdateBug", "Bug", FormMethod.Post, new { enctype
 = "multipart/form-data" })) {  
      @Html.AntiForgeryToken()
    var imagepath = Model.ScreenShot;

    <div class="form-horizontal">  
         @Html.ValidationSummary(true, "", new { @class = "text-danger" })
         @Html.HiddenFor(model => model.BugID)
         <div class="form-group">
            @Html.LabelFor(model => model.Title, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.Title, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Title, "", new { @class = "text-danger" })
             </div>
        </div>
        <div class="form-group">
             @Html.LabelFor(model => model.PriorityID, "Priority", htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                  @Html.DropDownList("PriorityID", null, htmlAttributes: new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.PriorityID, "", new { @class = "text-danger" })
            </div>
         </div>
         <div class="form-group">
            @Html.LabelFor(model => model.ProjectID, "Project", htmlAttributes: new { @class = "control-label col-md-2" })
             <div class="col-md-10">
                 @Html.DropDownList("ProjectID", null, htmlAttributes: new { @class = "form-control" })
                 @Html.ValidationMessageFor(model => model.ProjectID, "", new { @class = "text-danger" })
             </div>
         </div>
         <div class="form-group">
             @Html.LabelFor(model => model.CategoryID, "Category", htmlAttributes: new { @class = "control-label col-md-2" })
             <div class="col-md-10">
                @Html.DropDownList("CategoryID", null, htmlAttributes: new { @class = "form-control" })
                 @Html.ValidationMessageFor(model => model.CategoryID, "", new { @class = "text-danger" })
             </div>
         </div>
         <div class="form-group">
             @Html.LabelFor(model => model.BrowserID, "Browser", htmlAttributes: new { @class = "control-label col-md-2" })
             <div class="col-md-10">
                 @Html.DropDownList("BrowserID", null, htmlAttributes: new { @class = "form-control" })
                 @Html.ValidationMessageFor(model => model.BrowserID, "", new { @class = "text-danger" })
             </div>
         </div>

         <div class="form-group">
             @Html.LabelFor(model => model.ScreenShot,"Browse", htmlAttributes: new { @class = "control-label col-md-2" })
             <div class="col-md-10">
                @*@Html.DisplayFor(model => model.ScreenShot, new { htmlAttributes = new {@class = "form-control",@type = "file" } })*@
                 @*@Html.LabelFor(model => model.ScreenShot, new { @class = "control-label col-md-2" })*@  
                 @*<input type="file" id="imageBrowes" />*@   
                @*<img src="@Url.Content(@imagepath)" alt="No Image Found" style="height:200px;width:200px;" />*@
                <div class="panel panel-body" style="min-height:256px">
                     <div class="col-md-9">
                         <div class="col-md-4">
                             <div class="btn btn-primary">
                               <input type="file" id="imageBrowes" name="imgdata" />
                             </div>
                             <hr />

                             <div id="imgPreview" class="thumbnail" style="display:none">
                                 <img class="img-responsive" id="targetImg" />
                                 <div class="caption">
                                     <a href="#" onclick="ClearPreview()"><i class="glyphicon glyphicon-trash"></i></a>
                                    <span id="description"></span>
                                 </div>
                             </div>
                         </div>
                    </div>
                 </div>
                 @Html.ValidationMessageFor(model => model.ScreenShot, "", new { @class = "text-danger" })
             </div>
         </div>

         <div class="form-group">
             @Html.LabelFor(model => model.Description,"Feedback", htmlAttributes: new { @class = "control-label col-md-2" })
             <div class="col-md-10">
                 @Html.EditorFor(model => model.Description, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Description, "", new { @class = "text-danger" })
             </div>
         </div>
         <div class="form-group">
             <hr />
             <div class="text-center">
                 <button type="submit" class="btn btn-info"><i class="glyphicon glyphicon-save"></i> Submit</button>
             </div>
         </div>

     </div> } @*<button type="button" onclick="test()">test</button>*@ 























@section Scripts{
>     @*image preview*@ <script>
>     $(document).ready(function () {
>         $("#imageBrowes").change(function () {
>             var File = this.files;
>             if (File && File[0]) {
>                 ReadImage(File[0]);
>             }
>         })
>     })
>     var ReadImage = function (file) {
>         var reader = new FileReader;
>         var image = new Image;
>         reader.readAsDataURL(file);
>         reader.onload = function (_file) {
>             image.src = _file.target.result;
>             image.onload = function () {
>                 var height = this.height;
>                 var width = this.width;
>                 var type = file.type;
>                 var size = ~~(file.size / 1024) + "KB";
>                 $("#targetImg").attr('src', _file.target.result);
>                 $("#description").text("Size:" + size + ", " + height + "X " + width + ", " + type + "");
>                 $("#imgPreview").show();
>             }
>         }
>     } //script file ```



















>     var ClearPreview = function () {
>         $("#imageBrowes").val('');
>         $("#description").text('');
>         $("#imgPreview").hide();
>     } ``` </script>
>     }```**