.JS File using @url.action in Ajax Url

Question

I been trying to use @Url.Action inside Ajax url in another external .JS file but unfortunately i got no luck.

Here\'s my Cod

Answer 1

@Url.Action() is razor (server side) code and is not parsed in external files. Options include

Declaring a global variable in the main file, say

var url = @Url.Action("ClearData","Home");

and then in the external script use url: url in the ajax call

Including a data- attribute in the element your handling, for example if its a button click event, then

<button data-url="@Url.Action("ClearData","Home")" id="mybutton">

and then reading that value in the external file, for example

$('#mybutton').click(function() {
    var url = $(this).data('url');
    $.ajax({
        url: url,
        ....

Answer 2

You can create a partial view, then inside this view are just list of hidden fields such as

@Html.Hidden("ActionName", @Url.Action("ActionName", "Controller"))

which generates this

<input id="ActionName" name="ActionName" type="hidden" value="/controller/ActionName">

then you can call it like

  var urlAction = $('#ActioName').val();

or you can create a js function like what I did

 function ActionCaller(actionName)
 {
    return $('#' + actionName).val();
 }

 var action = ActionCaller(ActionName);

Answer 3

if your js code inside view

$.ajax({
      type: 'post',
      url: "@Url.Action("ClearData","Home")",
      success: function () {

       }
     });

this is work

when js code is an separate (external file) @Url.Action("ClearData","Home") is not work , this case you have to write total url or folder path