Refresh PartialView using IMemoryCache in ASP.Net Core MVC

I have my memory cache with my data.

I call it with ajax to add data to it.

I have a partial view in my main view. The partialview is just a select html element.

Is there a way I can update my select element as the cache updates without adding the elements manually with ajax.

I was hoping to possibly add my list of objects toto a viewbag and call my partial and have it all be updated.

@model TestVM
 
 
<select class="form-control" id="testBox" size="5" style="width:400px;" asp-for="TradeID"
        asp-items="@(new SelectList(ViewBag.Cache ?? string.Empty, "TradeID", "Price"))">
</select>
 
 
My Main View
-------------------------
<div class="container row">
    <div class="col-6">
        <input id="connectionUrl" />
        <a class="btn btn-secondary" id="connectButton">button</a>
 
        <h1 id="lblLabel">Label</h1>
 
        <a class="btn btn-danger" id="stopButton">button2</a>
    </div>
    <div id="divadd col-6">
        <partial name="ShowCache.cshtml" />
    </div>
</div>
@section Scripts {
        var connectionUrl = document.getElementById("connectionUrl");
        var connectButton = document.getElementById("connectButton");
        function updateState() {
            if (!socket) {
 
            } else {
                switch (socket.readyState) {
                    case WebSocket.CLOSED:
                        stateLabel.innerHTML = "Closed";
                        // disable();
                        connectionUrl.disabled = false;
                        connectButton.disabled = false;
                        break;
                    case WebSocket.CLOSING:
                        stateLabel.innerHTML = "Closing...";
                        //disable();
                        break;
                    case WebSocket.CONNECTING:
                        stateLabel.innerHTML = "Connecting...";
                        // disable();
                        break;
                    case WebSocket.OPEN:
                        stateLabel.innerHTML = "Open";
                        //enable();
                        break;
                    default:
                        stateLabel.innerHTML = "Unknown WebSocket State: " + socket.readyState;
                        //disable();
                        break;
                }
            }
        }
 
        connectButton.onclick = function () {
            stateLabel.innerHTML = "Connecting...";
            socket = new WebSocket(connectionUrl.value);
            socket.onopen = function (event) {
                stateLabel.innerHTML = "Connected";
            }
 
            socket.onclose = function (event) {
                stateLabel.innerHTML = "Closing...";
 
                $("#divadd").innerHTML += "Closed";
            };
 
            socket.onerror = function (e) {
                $("#divadd").innerHTML += "Errored";
            };
 
            socket.onmessage = function (event) {
                //$("#divadd").innerHTML += "event.data.p";
                var obj = JSON.parse(event.data.replace('\\', ''));
                var trade = event.data.replace('\\', '');
 
                $("#divadd").html += "<p>" + obj.p + "</p>";
                //$('#lstBox').innerHTML += "<option>" + obj.p + "</option>";
               // $("#divadd").insertAfter += "<span>" + obj.p + "</span>";
                updatePrice(obj);
                addData(obj);
                updateTrade(trade);
            }
        };
        function addData(data) {
            if (data != null) {
                var element = document.getElementById("lstBox")
                var opt = document.createElement("option");
                opt.text = data.s + "\t\t" + data.p + "     " + data.q ;
                opt.value = data;
                element.options.add(opt);
 
                $.ajax({
                    url: '@Url.Action("AddDataToMemory", "Home")',
                    type: 'GET',
                    //contentType: 'text/plain',
                    data: { model: JSON.stringify(data) },
                    //contentType: "application/json",
                    //dataType: "json",
                    dataType: "json",
 
                    traditional: true,
                    //data: { model: data },
                    //data: data ,
 
                   //contentType: type of data your sending
                    //dataType: what you're expecting back from the server: json, html, text, etc
                    //dataType: 'JSON',
                    //'application/x-www-form-urlencoded',
                })
                    .done(function (e) {
                        $.ajax({
                            url: '@Url.Action("ShowCache", "Home")',
                            type: 'GET',
 
                        })
                        //alert('done');
                    })
                return false;
            }
        }
}