jquerymobile in asp.net mvc - switching from mobile view to main site through actionlink changes the styling

See more:

MVC

jQuery

Razor

MVC4

jQuery-UI

I'm just trying to direct the site from mobile version to normal version. It works fine when I go from normal to mobile version, but it applies the mobile styling if i go from mobile to normal. Below is my _layout.cshtml and _mobileLayout.cshtml code.

When I switch back from mobile to mainsite by clicking on the mainsite link, my url points to `"http://localhost/Mobile/GetEmployees#/"` instead of `"http://localhost/MainSiteHOme/Index/"`

Any help would be greatly appreciated. Thanks

**_MobileLayout.cshtml**

<div data-role="navbar" data-iconpos="left" data-theme="b">
     <ul>
         <li>
             <a href="#" data-role="button" data-mini="true"
                 data-rel="back" data-icon="back">Go Back</a>
         </li>
         <li>
             <a href="@Url.Action("GetEmployees", "Mobile")"
                 data-role="button" data-icon="home">Go Home</a>
         </li>
         <li>
             <a href="@Url.Action("Index", "MainSiteHome")"
                 data-role="button" data-icon="home">Main Site</a>
         </li>
     </ul>
 </div>

**_Layout.cshtml**, this is for the main site

<nav class="nav">
    <ul>
        <li>@Html.ActionLink("Home", "Index", "MainSiteHome")</li>
        <li>@Html.ActionLink("Mobile Site", "GetEmployees", "Mobile")</li>
        <li>@Html.ActionLink("Help", "Contact", "Home")</li>
    </ul>
</nav>