asp.net-mvc - MVC jQuery モバイル iPad

Question

私はMVCにこの例を使用しています:

http://www.asp.net/mvc/tutorials/mvc-4/aspnet-mvc-4-mobile-features

サイトを展開すると、Windows Phone で問題なく表示されます。iPad で自分のサイトにアクセスすると、jQuery モバイルが表示されません。タブレットのサポートを有効にするにはどうすればよいですか?

Answer 1

iPadを登録済みデバイスとして追加する必要がありました。ここに私のglobal.asaxがあります

using System;
using System.Web.Http;
using System.Web.Mvc;
using System.Web.Optimization;
using System.Web.Routing;
using System.Web.WebPages;
using MvcMobile;
using System.Web.Http;
using System.Collections.Generic;
using System.Web;
using System.Linq;

namespace JMA.Web
{
// Note: For instructions on enabling IIS6 or IIS7 classic mode, 
// visit http://go.microsoft.com/?LinkId=9394801

public class MvcApplication : System.Web.HttpApplication
{
    public static void RegisterGlobalFilters(GlobalFilterCollection filters)
    {
        filters.Add(new HandleErrorAttribute());
    }

    public static void RegisterRoutes(RouteCollection routes)
    {
        routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

        routes.MapRoute(
            "Default", // Route name
            "{controller}/{action}/{id}", // URL with parameters
            new { controller = "Home", action = "Index", id = UrlParameter.Optional } // Parameter defaults
        );

    }

    protected void Application_Start()
    {
        WebApiConfig.Register(GlobalConfiguration.Configuration);
        FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
        RouteConfig.RegisterRoutes(RouteTable.Routes);
        BundleConfig.RegisterBundles(BundleTable.Bundles);
        BundleMobileConfig.RegisterBundles(BundleTable.Bundles);
        RegisterCustomDisplayModes();

    }

    private void RegisterCustomDisplayModes()
    {
        Dictionary<string, Func<HttpContextBase, bool>> displayModes = new Dictionary<string, Func<HttpContextBase, bool>>
        {
            {"Mobile", c => c.Request.UserAgent.IndexOf("iPad", StringComparison.InvariantCultureIgnoreCase) > 0}
        };

        displayModes.Keys.ToList().ForEach(
            key => DisplayModeProvider.Instance.Modes.Insert(0, new DefaultDisplayMode(key)
            {
                ContextCondition = c =>
                    {
                        if (c == null || c.Request == null || string.IsNullOrEmpty(c.Request.UserAgent))
                        {
                            return false;
                        }

                        return displayModes[key](c);
                    }
            }));
    }
}
}

モバイルという単語は、ユーザーを Shared/Layout/_Layout.Mobile にリダイレクトします。iPad という単語は、デバイスを検索します。詳細については、次を参照してください。

http://www.asp.net/mvc/tutorials/mvc-4/aspnet-mvc-4-mobile-features

「ブラウザ固有のビュー」

Mobile を iPad に変更すると、ブラウザーは _Layout.iPad にリダイレクトします。

~/Shared/_ViewSwitcher に移動し、コードを変更します。

@if (Request.Browser.IsMobileDevice && Request.HttpMethod == "GET" ||     

Request.UserAgent.IndexOf("iPad", StringComparison.InvariantCultureIgnoreCase) > 0 )
{
<div class="view-switcher ui-bar-d" data-theme="d">
    @if (ViewContext.HttpContext.GetOverriddenBrowser().IsMobileDevice || Request.UserAgent.IndexOf("iPad", StringComparison.InvariantCultureIgnoreCase) > 0 )
    {
        @: Displaying mobile view
        @Html.ActionLink("Desktop view", "SwitchView", "ViewSwitcher", new { mobile = false, returnUrl = Request.Url.PathAndQuery }, new { rel = "external" })
    } 
    else 
    {
        @: Displaying desktop view
        @Html.ActionLink("Mobile view", "SwitchView", "ViewSwitcher", new { mobile = true, returnUrl = Request.Url.PathAndQuery }, new { rel = "external" })
    }
</div>
}