How To bind the data in partial view after click on the button in a same partial view in mvc 5?

See more:

MVC5

Hi ,
I Have a View on which i have a button 'Add Image' By the clicking on this button I open a partial view In this partial view with all images . This view have a file upload control when i upload a image then I have to Add this image in the list of all images. how can I do this I am sending to you my code

This is the Action Method

   public ActionResult CreateImage()
       {
           List<ImageGallery> all = new List<ImageGallery>();


           // Here MyDatabaseEntities is our datacontext
           ViewBag.images = Directory.EnumerateFiles(Server.MapPath("/Images/CategoryImage/"))
                                        .Select(fn => "/Images/CategoryImage/" + Path.GetFileName(fn));
           foreach (var image in (IEnumerable<string>)ViewBag.Images)
           {
               ImageGallery ob = new ImageGallery();
               ob.FileName = image;
               all.Add(ob);
           }
           return View("CreateImage",all);
       }


[HttpPost]
       public ActionResult FileUpload(HttpPostedFileBase file)
       {
           if (file != null && file.ContentLength > 0)
               try
               {
                   string path = Path.Combine(Server.MapPath("~/Images/CategoryImage/"),
                   Path.GetFileName(file.FileName));
                   file.SaveAs(path);
                   return Json(new
                   {
                       Error = false,
                       Message = "File Uploaded Successfully..!!!",
                       FilePath = file.FileName
                   }, JsonRequestBehavior.AllowGet);
               }
               catch (Exception ex)
               {
                   return Json(new
                   {
                       Error = false,
                       Message = "File Not Uploaded"
                   }, JsonRequestBehavior.AllowGet);
               }
           else
           {
               ViewBag.Message = "You have not specified a file.";
           }
           List<ImageGallery> all = new List<ImageGallery>();


           // Here MyDatabaseEntities is our datacontext
           ViewBag.images = Directory.EnumerateFiles(Server.MapPath("/Images/CategoryImage/"))
                                        .Select(fn => "/Images/CategoryImage/" + Path.GetFileName(fn));
           foreach (var image in (IEnumerable<string>)ViewBag.Images)
           {
               ImageGallery ob = new ImageGallery();
               ob.FileName = image;
               all.Add(ob);
           }
           return View("CreateImage", all);
       }

This is the view

@model IEnumerable<MyProject.Models.ImageGallery>

<script type="text/javascript">
    $(function () {
        $('#approve-btn').click(function () {
            $('#modal-container').modal('hide');
        });
    });


</script>



@using (Html.BeginForm("FileUpload", "Category", FormMethod.Post, new { enctype = "multipart/form-data", @id = "MyForm" }))
{
        <div id="DOC1"></div>
        <script>

            $(document).ready(function () {
                $("#btnUpload").click(function () {
                    if ($("#myFile").val() == "") {
                        alert("Please select a file");
                        return false;
                    }
                    $('#MyForm').ajaxForm({
                        complete: function (xhr) {
                            var ret = $.parseJSON(xhr.responseText);
                            if (ret.Error == false) {
                                $("#DOC1").empty();
                                $("#DOC1").html('<iframe src="@Url.Action("ShowDocument", "Category", new { FilePath = "_FilePath" }) "'.replace("_FilePath", ret.FilePath) + ' style="width: 98%; height: 98%" ></iframe>');
                                // $("#DOC1").show();
                                $("#DOC1").dialog({
                                    autoOpen: true,
                                    modal: true,
                                    height: 500,
                                    width: 600,
                                    buttons: {
                                        OK: function () { $(this).dialog("close"); }
                                    },
                                    title: "Document",
                                });
                            }
                        },
                        error: function () {
                            window.location.reload();
                        }
                    }).submit();
                });
            });
        </script>
        @Html.AntiForgeryToken()
        <div class="modal-body" style="  position:fixed;
    top: 34%;
    left: 28%;
    width:70em;
    height:34em;
    margin-top: -9em; /*set to a negative number 1/2 of your height*/
    margin-left: -15em; /*set to a negative number 1/2 of your width*/
    border: 10px solid #2DB82D; background-color: #ffffff;">

            <h4>Add/Edit Category Image</h4>
            @*@if (ViewBag.Images != null)
            {
                foreach (var image in (IEnumerable<string>)ViewBag.Images)
                {
            < img src = "@Url.Content(image)" alt = "Hejsan" />
                }
            }*@
            <div class="form-group">
               <div>


    @foreach (var item in Model)
    {
        <div>
            <img src=@item.FileName alt="image" style="width:100px;height:100px; float:left;" />

        </div>
    }s
                   </div>
                   </div>

            <input type="file" name="file" id="myFile" style="width: 100%;" />
            <input type="submit" value="Upload" class="btn btn-default" id="btnUpload" />

            <div>
                @Html.ActionLink("Select ", "FileUpload", "Category", null, new { @class = "modal-link btn btn-success" })
            </div>
            <div class="col-md-4 col-md-offset-4">
                <button type="button" class="btn btn-default"
                        data-dismiss="modal">
                    Cancel
                </button>
                @*<button type="submit" id="approve-btn"
                            class="btn btn-danger">
                        Save
                    </button>*@
            </div>

        </div>
        }


        @section Scripts {
            @Scripts.Render("~/bundles/jqueryval")
        }

Please give me the solution