menu and jQuery links not working when publishing .NET MVC app to a subfolder

I encountered issues publishing an ASP.NET MVC application to my personal website for the first time. The application stores code snippets in a database and displays the snippets in a text box using a dropdown menu. For some background, the working application was uploaded to a subfolder on my Godaddy-hosted site. I have a shared Windows hosting plan.

I started testing by navigating to the application’s URL and clicking on the menu bar links. Every clicked link redirected not to the corresponding view, but to my site’s homepage. In addition, the jQuery and CSS links were not working either. Initially I suspected the web.config file in my site’s main folder was the cause. I added a rewrite exclude rule: <add input="{REQUEST_URI}" pattern="^/(codesnippetapp)" negate="true" /> to the web.config to make the site rewrite rules not apply to the app subfolder. This made the menu links work but not the jQuery and CSS links. This lead me down the wrong path. I thought I only needed to add some code to the site’s web.config.

After much trial and error, along with posting a question on StackOverflow, I figured out how to solve the problem. First, I changed the publishing method in Visual Studio from FTP to FileSystem, then upload the application files manually via FTP to Godaddy. If you are following the same steps, a new virtual folder to host the application will need to be created using Godaddy’s IIS Management before uploading the application files. Second, I moved the jQuery code from a separate file to the view where it was being used. Given the jQuery code consisted of only an Ajax function I didn’t mind adding jQuery code to the view. Tthe code was put inside a Razor section tag to have it properly load into the view:

@section Scripts
{
... jQuery code
}

and have the code section load in the shared layout file (_Layout.cshtml) using a Razor RenderSection:

@RenderSection("Scripts", required: false)

Third, I incorporated  the Razor Url.Action method into the site path of the Ajax function’s url parameter to make it dynamic:
url: '@Url.Action("GetCodeData","Home")'

My solution is intended only for those publishing a .NET MVC application to a website’s subfolder. As I’ve shown, the underlying issue can be easily misdiagnosed.

Matthew Dailey

Web developer, photographer, and Photoshop user.