Better solution to using Url.Action in javascript code

Question

In my current project using asp.net MVC 3 (using razor), when I'm making Ajax calls, I have to keep the JS on the view page because I want to use Url.Action to generate the URL. This means I can't split the js code out into .JS files, Is there a better solution than what I'm currently doing.

Answer 1

I tend to accomplish this in a similar way as above, with a slightly different twist as I like namespacing my javascript.

The javascript file looks something like:

var my = {};  my.viewname =  {    init : function(settings){       // do some work here. settings.someImportantUrl has my json/ajax url eg.       alert(settings.someImportantUrl );    } } 

Then my view would contain something like:

<script language='javascript'>   // allocate an object with variables you want to use in the external js file   var settings = {someImportantUrl: '<%=Url.Action(...)%>'};   // call an init method for the current view   my.viewname.init(settings); </script> 

Answer 2

You can define only urls in view and keep all other javascript code in .js files.

There is code from view in my MVC.NET 1 application:

<script type="text/javascript" src="<%=Url.Content("~/Scripts/Account/ManageUsers.js")%>"></script>  <script type="text/javascript" src="<%=Url.Content("~/Scripts/Account/ManageUsersAndGroups.js")%>"></script>  <script type="text/javascript">      var getUsersUrl = '<%= Url.Action("GetUsers", "Account") %>';     var getUserDetailsURL = '<%= Url.Action("GetUserDetails", "Account") %>';      <%If Not ViewData("readOnly") Then%>     var changeRolePermissionsUrl = '<%= Url.Action("ChangeRolePermissions", "Account") %>';     var deleteUserUrl = '<%= Url.Action("DeleteUser", "Account") %>';     var resetPasswordUrl = '<%= Url.Action("ResetPassword", "Account") %>';     var updateUserGroupsUrl = '<%= Url.Action("UpdateUserGroups", "Account") %>';     var updateUserDetailsUrl = '<%= Url.Action("UpdateUserDetails", "Account") %>';     <%End If%>   </script> 

So, you can even don't render urls for actions which cannot be invoked by user because of security reasons. (ViewData("readOnly") means user have read only access to screen).

And there is a part of code in js file:

function GetUsersList() {     ajax.getJSON(getUsersUrl, {}, function(data) {         if (data != false) {             ShowUsers(data);         }         else {             jAlert('Error during users list retrieving.');         }     }); } 

Where getUsersUrl is defined in View