Partial page not loading inside view MVC5

Question

I have an View page, and two partial pages, one to add a single announcement, and the other to display an announcement.

In the list of displayed announcements, there is an edit actionlink, that gets the Id of the selected item in the list, and pulls back the data to the other partial, in order for the user to update it.

Problem being that the partial is being loaded outside of the view, but for the life of me I can't find/remember how to get the partial back to the view page.

How can I achieve this?

Update:

I have tried using Ajax.ActionLink(...) as suggested for the edit button, but cannot get it to work, it is still loading the partial as its own page, and not within the view page.

@Ajax.ActionLink(
        "AJAX Edit",
        "Edit",
        "Announcements",
        new { id = Model.Id },
         new AjaxOptions { UpdateTargetId = "newAnnouncementContainer" })

Controller:

public ActionResult Edit(int? id)
        {
            if (id != null)
            {
                var qry = (from a in db.DbAnnouncement
                           where a.Id == id
                           select a).SingleOrDefault();
                return PartialView("~/Views/Shared/Partials/AnnouncementPartial.cshtml", qry);
            }
            else
            {
                return PartialView("~/Views/Shared/Partials/AnnouncementPartial.cshtml", new Announcement());
            }
        }

View page:

<h2>Announcements</h2>
<div>
    <div class="announcementTable">
        <input type="button" id="announcementBtn" value="Add Announcement" />
        <div id="newAnnouncementContainer">
            @{Html.RenderPartial("~/Views/Shared/Partials/AnnouncementPartial.cshtml", new _4DStatusMVCWeb.Models.Announcement());}
        </div>
        <br />
        <div class="announcementTableRow">
            <div></div>
            <div class="announcementHeader announcementTableCell">Title</div>
            <div class="announcementHeader announcementTableCell announcementDetails">Details</div>
            <div class="announcementHeader announcementTableCell">Created</div>
            <div class="announcementHeader announcementTableCell">Updated</div>
            <div class="announcementHeader announcementTableCell annoucementVersion">V#</div>
            <div class="announcementHeader announcementTableCell">Start</div>
            <div class="announcementHeader announcementTableCell">Expiry</div>
            <div class="announcementHeader announcementTableCell">CMDS</div>
        </div>
        @foreach (var a in Model.AnnouncementList)
        {
            <div class="announcementTableRow">
                @{Html.RenderPartial("~/Views/Shared/Partials/AnnouncementListItemPartial.cshtml", a); }
            </div>
        }
    </div>
</div>

Announcement List Partial page:

@using (Html.BeginForm())
{
    <div>@Html.HiddenFor(mi => mi.Id)</div>
    <div class="announcementTableCell">@Html.DisplayFor(mi => mi.Title)</div>
    <div class="announcementTableCell announcementDetails">@Html.Raw(Model.Details)</div>
    <div class="announcementTableCell">@Html.DisplayFor(mi => mi.DTCreated)</div>
    <div class="announcementTableCell">@Html.DisplayFor(mi => mi.LastUpdated)</div>
    <div class="announcementTableCell annoucementVersion">@Html.DisplayFor(mi => mi.VersionNum)</div>
    <div class="announcementTableCell">@Html.DisplayFor(mi => mi.StartDT)</div>
    <div class="announcementTableCell">@Html.DisplayFor(mi => mi.ExpiryDT)</div>
    <div class="announcementTableCell">
        @Html.ActionLink("Edit", "Edit", new { id = Model.Id })
        @Html.ActionLink("Delete", "Delete", new {  id = Model.Id })
    </div>
}

Submit partial page:

@using (Html.BeginForm("Create", "Announcements"))
{
    <div class="newAnnouncementTableRow1">
        <div>@Html.LabelFor(m => m.Title)</div>
        <div>@Html.EditorFor(m => m.Title)</div>
        <label>Status Populater</label>
        <select id="statusDropdown">
            <option value="0"> - Select - </option>
            <option value="1">Hosting - Down</option>
            <option value="2">Hosting - Degraded</option>
            <option value="3">Hosting - Impaired</option>
            <option value="4">Hosting - Restored</option>
            <option value="5">Connection - Down</option>
            <option value="6">Connection - Degraded</option>
            <option value="7">Connenction - Impaired</option>
            <option value="8">Connection - Restored</option>
        </select>
        <div>@Html.LabelFor(m => m.Details)</div>
        <div>@Html.EditorFor(m => m.Details)</div>
    </div>
    <div class="newAnnouncementTableRow2">
        <label>Status Type</label>
        <select id="groupId">
            <option value="1">Facilities</option>
            <option value="2">Technical</option>
            <option value="3">Network</option>
            <option value="4">General</option>
        </select>
        <div>@Html.LabelFor(m => m.StartDT)</div>
        <div>@Html.EditorFor(m => m.StartDT)</div>
        <div>@Html.LabelFor(m => m.ExpiryDT)</div>
        <div>@Html.EditorFor(m => m.ExpiryDT)</div>
        <div>@Html.LabelFor(m => m.Enabled)</div>
        <div>
            @Html.RadioButtonFor(m => m.Enabled, 1)Yes
            @Html.RadioButtonFor(m => m.Enabled, 0)No
        </div>
        <br/>
        <input type="submit" formaction="Announcements/Create/" value="Create" />
        <input type="submit" formaction="Announcemens/Clear/" value="Clear" />
    </div>
}