0

基本的に、選択リストから選択した番号をサーバーに送信する必要がある MVC アプリ内に小さなモバイル インターフェイスを作成しました。

コード:

@{
    ViewBag.Title = "Freezer Status";
}
<div style="width: 210px">
    <div>
        <select style="width: 160px">
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
            <option value="6">6</option>
            <option value="7">7</option>
            <option value="8">8</option>
            <option value="9">9</option>
            <option value="10">10</option>
        </select>
    </div>
    <div>
        <input type="submit" id="submit" value="Save" style="width: 200px" />
    </div>
</div>
<div id="result">
</div>
<script type="text/javascript">
    $("select").change(function () {
        $("select option:selected").each(function () {
            $.ajax({
                data: {
                    fridgeNo: $(this).val()
                },
                type: 'GET',
                url: '@Url.Action("GetLastSubmitAction", "BlastFreezer")',
                cache: false,
                success: function (html) {
                    $("#submit").attr('value', html.Value);
                    $("#submit").prev().html(html.Text);
                }
            });
        });
    }).change();

    $("#submit").click(function () {
        $.ajax({
            data: {
                fridgeNo: $(this).val()
            },
            type: 'GET',
            url: '@Url.Action("ClockFridgeTime", "BlastFreezer")',
            cache: false,
            success: function (html) {
                $("#submit").attr('value', html.Value);
                $("#submit").html(html.Text);

                $("#result").html("Saved!");
            }
        });
    });
</script>

私がそれを開発したとき、Chrome 用のエージェント切り替えアドオンを使用してインターフェースをテストしましたが、問題なく動作するようでした。

エージェント文字列:

Mozilla/4.0 (互換性; MSIE 7.0; Windows Phone OS 7.0; Trident/3.1; IEMobile/7.0; Nokia;N70)

しかし、インターフェースを利用する必要があるデバイスでは機能しません。私があなたに言えることは (特定の IE バージョンのデバイスを詮索しようとしても役に立たなかった)、その Windows モバイルとポケット IE の何らかの形式のモバイルであるということだけです。

Chrome - モバイル エージェントを使用 モバイル機器

保存ボタンのテキストは、サーバーから返されたテキストに基づいて決定する必要があります。そして、単純な送信/ajax 呼び出しを実行できるようにする必要があります。私の推測では、Mobile IE はその兄貴分と同じくらい気まぐれであり、JQuery モバイルはそれで動作しません。その場合、投稿せずにサーバーへの呼び出しを行うにはどうすればよいでしょうか?

4

1 に答える 1

0

これは今のところ部分的な答えです。(私はそれを理解したら、更新して解決済みとしてマークします:P)

私は最終的にJQueryモバイルを外に出しました。そして、私の見解は今このように見えます。on Change イベントはまだ IE Mobile で発生していません (ただし、別のエージェントの下でクロムで実行すると機能します)。

@{
    ViewBag.Title = "Freezer Status";
}
@using (Html.BeginForm("ClockFridgeTime", "BlastFreezer", FormMethod.Get, new { name = "UpdateForm" }))
{
    <div style="width: 210px">
        <div>
            @Html.DropDownList("fridgeNo", (List<SelectListItem>)ViewBag.Options, new { onChange = "PostForm(this, '/Index')", Style = "width:160px; height 80px;" })
        </div>
        <br />
        <div>
            <input type="submit" id="submit" value="@ViewBag.FridgeStatus" style="width: 200px; height:80px" />
        </div>
    </div>
}
<script type="text/javascript">
    function PostForm(btnClicked, newLocation) {
        var $form = $(btnClicked).parents('UpdateForm');

        $.ajax({
            type: "GET",
            url: document.UpdateForm.action.replace('/ClockFridgeTime', newLocation.toString()) + "?fridgeNo=" + document.getElementById('fridgeNo').value,
            success: function (response) {
                document.body.innerHTML = response;
            }
        });
        return false;
    }
</script>
于 2012-06-28T13:28:29.553 に答える