title: Call Partial View using @Url.Action() from razor and Ajax separately
body: <p>I'm working on a <code>SearchStudent()</code> action, there should be something wrong with my code, something that I'm missing, I've an action method that returns a <code>Partial View</code>, I want to show first the <code>Partial View Page</code> inside the <code>Index page</code> with the <code>Search</code> form and once filled the form submit it using a <code>Post request</code>. I want to do all that using ajax so I want all that to happen inside the <code>Index view</code>..
  I know that is a bad practice to hardcode our url from ajax, so I'm using the <code>data-</code> attribute from my razor view inside a <code>&lt;p&gt;</code> element putting in there the url using <code>@Url.Action()</code>. The thing is that when I use <code>@Url.Action</code> it routes to the Index action instead of the <code>SearchStudent() Action</code> and shows the same <code>Index page</code> twice instead of the <code>partial view</code> and when I hardcode in ajax the url then it recognizes it, what's happening?</p>
  
  <p>Maybe you'll understand better seeing my code:</p>
  
  <p>Action Method(I want to show the partial view first)</p>
  
  <pre><code> public PartialViewResult SearchStudent()
          {            
              return PartialView();
          }
          [HttpPost]
          [ValidateAntiForgeryToken]
          public JsonResult SearchStudent(string name)
          {
              List&lt;Student&gt; list = db.Students.Where(s =&gt; s.Name == name).ToList();
              return Json(list, JsonRequestBehavior.AllowGet);
          }
  </code></pre>
  
  <p>Index view(just the section concerning to show the Partial View):</p>
  
  <pre><code>&lt;div&gt;
      &lt;p class="hand" id="pSearch" data-urlSearch="@Url.Action("SearchStudent","Students")"&gt; Search by name&lt;/p&gt;
      &lt;div id="ShowFormSearch"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>JQuery function(if I put directly inside ajax <code>url: "Students/SearchStudent"</code> it works but that is not a good practice):</p>
  
  <pre><code>function ShowSearchPage()
  
  {
      $.ajax({
          type: 'get',
          url: $("#pSearch").data('urlSearch'),        
      }).success(function (result) {
          $("#ShowFormSearch").html(result)
      }).error(function () {
          $("#ShowFormSearch").html("An error occurred")
      })
  }
  </code></pre>