2

私は MVC3 にかなり慣れていませんが、MVC3 アプリは jQuery ダイアログ ボックスに DateTime のリストをロードする必要があると書いていますが、サーバーにポスト バックすると、DateTime のリストが送信されません。

このようにリストの日付ごとに非表示の要素を追加するのにうんざりしました

@for (int i = 0; i < Model.ListOfDates.Count; i++)
{
    @Html.HiddenFor(x => x.ListOfDates[i])
}

しかし、jQuery datepicker で日付を変更しようとすると、次のエラーが発生します。

Microsoft JScript ランタイム エラー: プロパティ 'currentDay' の値を設定できません: オブジェクトが null または未定義です

誰かが私が間違っていることを教えてもらえますか? デモ用のテスト アプリを作成しました。

モデル

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace Stupid_Dates_Test.Models
{
    public class Model
    {
        public string StringProperty { get; set; }
        public int IntProperty { get; set; }
        public List<DateTime> ListOfDates { get; set; }
    }
}

コントローラ

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Stupid_Dates_Test.Models;

namespace Stupid_Dates_Test.Controllers
{
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            Model m = new Model();
            m.StringProperty = "This is a string property";
            m.IntProperty = 100;
            m.ListOfDates = new List<DateTime>();
            m.ListOfDates.Add(new DateTime(2012, 11, 1));
            m.ListOfDates.Add(new DateTime(2012, 11, 2));
            m.ListOfDates.Add(new DateTime(2012, 11, 3));
            m.ListOfDates.Add(new DateTime(2012, 11, 4));
            m.ListOfDates.Add(new DateTime(2012, 11, 5));
            return View(m);
        }

        public void Save(Model m)
        {
            // Save Code
        }
    }
}

意見

<script src="../../Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-ui-1.8.11.min.js" type="text/javascript"></script>
<link href="../../Content/themes/base/jquery.ui.all.css" rel="stylesheet" type="text/css" />

@model Stupid_Dates_Test.Models.Model
<form id="frmMain" action="">
@Html.EditorFor(x => x.StringProperty)
@Html.EditorFor(x => x.IntProperty)

@*@for (int i = 0; i < Model.ListOfDates.Count; i++)
{
    @Html.HiddenFor(x => x.ListOfDates[i])
}*@

<a href="javascript:ShowDates()">Edit List of Dates</a>
<div id="dlgDates" style="display: none;">
    @for (int i = 0; i < Model.ListOfDates.Count; i++)
    {
        @Html.EditorFor(x => x.ListOfDates[i])
    }
</div>
</form>
<script type="text/javascript">
    $(document).ready(function () {
        var today = new Date();
        var dd = today.getDate();
        var mm = today.getMonth() + 1;
        var yyyy = today.getFullYear();
        if (dd < 10) { dd = '0' + dd }
        if (mm < 10) { mm = '0' + mm }
        today = mm + '/' + dd + '/' + yyyy;
        $(":input[data-datepicker]").datepicker({ defaultDate: today });
    });

    function ShowDates() {
        $("#dlgDates").dialog({
            autoOpen: true,
            closeOnEscape: false,
            width: 500,
            height: 400,
            resizable: false,
            title: "Dates",
            modal: true,
            draggable: false,
            open: function () {
                $("#dlgDates").show();
            },
            buttons: {
                "Save": function () {
                    $.ajax({
                        type: "POST",
                        url: '/Home/Save/',
                        data: $("#frmMain").serialize(),
                        success: function () {
                            // Save Code
                            alert('Saved successfully!');
                            $('#dlgDates').dialog('destroy');
                        },
                        error: function () {
                            alert('Error');
                        }
                    });
                }
            }
        });
    }
</script>

日時エディター テンプレート

@model System.DateTime
@Html.TextBox("", (Model == null ? "" : Convert.ToDateTime(ViewData.TemplateInfo.FormattedModelValue).ToShortDateString()), new { data_datepicker = true })
4

1 に答える 1

0

関連するいくつかの問題があります: 1) セレクターが間違っています。:input[data-datepicker] は、私の理解として type="date-datepicker" で入力を選択します。Html.TextBoxFor は、タイプが「テキスト」の入力をレンダリングします。input.datepck などを使用して選択できるように、入力フィールドにクラスを追加してみてください。

2) jQuery ダイアログ プラグインを使用すると、日付フィールドがサーバーに送信されません (http 要求には表示されません)。

于 2012-11-01T18:16:17.603 に答える