My return PartialView opens up a new page instead of being on the same page?
<p><strong>I am trying to display a Quick Search field at the top of my page. After clicking search a partial view should open up the results.
What i am getting is instead a new page with the search results?!</strong></p>

<h1>View with the RenderPartial:</h1>

<h2>Displaying the search box</h2>

<pre><code>&lt;div style="height: 20px;padding:0" class="panel-heading"&gt;Quick Course Search&lt;/div&gt;
&lt;div style="height: 20px;padding:0" class="panel-body"&gt;

@using (Ajax.BeginForm("CourseSearch", "Courses",

            new AjaxOptions
            {
                InsertionMode = InsertionMode.Replace,
                HttpMethod = "GET",
                OnFailure = "searchFailed",
                LoadingElementId = "ajax-loader",
                UpdateTargetId = "searchresults",

            }))
{
    &lt;input type="text" name="q" /&gt;
    &lt;input type="submit" value="search" /&gt;
    &lt;img src="@Url.Content("~/Images/ajax-lader.gif")" style="display:none" /&gt;
}

&lt;div id="searchresults"&gt;



&lt;/div&gt;
</code></pre>

<p></p>

<h1>PartialView:</h1>

<h2>Displaying the search results as a list</h2>

<pre><code>@model IEnumerable&lt;HoneyMustard.Interface.Models.Courses&gt;



&lt;div id="searchresults"&gt;
&lt;ul&gt;

    @foreach (var item in Model)
    {
        &lt;li&gt;@item.CourseName&lt;/li&gt;

    }
&lt;/ul&gt;


&lt;/div&gt;
</code></pre>

<h1>Controller:</h1>

<h2>Querying the database</h2>

<pre><code> public ActionResult CourseSearch(string q)
    {
        var courses = GetCourses(q);

        return PartialView("~/Views/Courses/CourseSearch.cshtml", courses);
    }

  private List&lt;Courses&gt; GetCourses (string searchString)
 {    


               return db.Courses.Where(a =&gt;       a.CourseName.Contains(searchString))
                .ToList();


    }
</code></pre>