Pass newly created object to partial view

Question

This is the part of my method where i create a new object and save it to the DB:

 var db = new ArtContext();

            var nyArt = new ArtWork()
            {
                ArtLink = name,

            };

            db.ArtWorks.Add(nyArt);
            db.SaveChanges();

            PartialView("_CreatedArt", nyArt);

As you can see, I try to pass my new object to a partial view. My view where I hope to render the partial:

@Html.Partial("_CreatedArt", Model)

However, nothing happens (no view renders). Is it maybe because it takes some time for the DB to save the new object or am I maybe doing something else wrong?

EDIT:

Index view, where i want to render the partial:

@model Heroz.Models.ArtWork
@using Heroz.Models
@{
    ViewBag.Title = "Home Page";
}

    <div class="jumbotron">
        <h1>ASP.NET</h1>
        <p class="lead">ASP.NET is a free web framework for building great Web sites and Web applications using HTML, CSS and JavaScript.</p>
        <p><a href="http://asp.net" class="btn btn-primary btn-lg">Learn more &raquo;</a></p>
    </div>

    <button onclick="drawShapes()"></button>

        <!--Canvas1-->
         <canvas id="canvas" width="400" height="300" style="background-color: slategray;"></canvas>
         <input type="button" id="btnSaves" name="btnSaves" value="Save the canvas to server" />
         <input type="hidden" name="imageData" id="imageData" />

        <!--Canvas2-->
         @Html.Partial("_CreatedArt", Model)

Partial view:

@model Heroz.Models.ArtWork

<div id="canvas" width="400" height="300" style="background-color: grey;">
    <img src="@Model.ArtLink"/>
</div>

The class im working with:

namespace Heroz.Models
{
    public class ArtWork
    {


        public int ID { get; set; }
        public string ArtLink { get; set; }

    }

    public class ArtContext : DbContext
    {
        public DbSet<ArtWork> ArtWorks { get; set; }
    }
}

What om trying to do i short is, dreaw a picture with the canvas, upload it to the DB (this works fine), then asap show the picture in the partial.

EDIT AJAX:

 $("#btnSaves").click(function () {

        var image = document.getElementById("canvas").toDataURL("image/png");
        image = image.replace('data:image/png;base64,', '');

        $.ajax({
            type: 'POST',
            url: "../../Home/UploadImageS",
            data: '{ "imageData" : "' + image + '" }',
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',
            success: function (msg) {
                alert('Image saved successfully !');
            }
        });
    });

Complete Action:

static string path = Path.GetTempFileName();

        public ActionResult UploadImageS(string imageData)
        {
            string fileNameWitPath = path + DateTime.Now.ToString().Replace("/", "-").Replace(" ", "- ").Replace(":", "") + ".png";
            using (FileStream fs = new FileStream(fileNameWitPath, FileMode.Create))
            {
                using (BinaryWriter bw = new BinaryWriter(fs))
                {
                    byte[] data = Convert.FromBase64String(imageData);
                    bw.Write(data);
                    bw.Close();
                }
            }


            string link = UploadImage(fileNameWitPath);

            JObject o = JObject.Parse(link);

            string name = (string)o.SelectToken("data.link");

            var db = new ArtContext();

            var nyArt = new ArtWork()
            {
                ArtLink = name,

            };

            db.ArtWorks.Add(nyArt);
            db.SaveChanges();
            System.IO.File.Delete(fileNameWitPath);

            /*RedirectToAction("Index","Home");*/

            PartialView("_CreatedArt", nyArt);

        }

Answer 1

when your return a partial view you can replace html response to an element html like :

$.ajax({
            type: 'POST',
            url: "../../Home/UploadImageS",
            data: '{ "imageData" : "' + image + '" }',
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',
            success: function (msg) {
                $("#ContainerId").html(msg);
            }
        });

Answer 2

You can chain your controller actions in MVC instead of redirecting.

public class MyController {

    public ActionResult MainIndex() {

        FunModel myModel = new FunModel();
        return View("Index", myModel);
    }

    public ActionResult PostAction(string id) {
        //Do db work
        //Do additional work

        // Re-use the logic for loading the main view
        ActionResult result = MainIndex();
        //You can access view model data like this
        FunModel myModel = (FunModel)ViewData.Model;
        myModel.UpdatedId = id;
        return result;
    }
}

And you can access the view data from a previous action by reading it out of the ViewData.Model property.