1

私は MVC3 を初めて使用し、それを使用して SQL 2008 R2、EF4 Web サイトを構築しています。過去 36 時間で、DatePicker やメニューなどを使用することを期待して、Telerik の MVC 拡張機能をプロジェクトに追加しようとしました。私の構成とインストールは適切であると信じています。いくつかの小さなテスト (パネル バーの例) は、それを確認したようで、_layout.cshtml ファイルへの私の編集も良いようです。

私が立ち往生しているのは、Datepicker ( http://demos.telerik.com/aspnet-mvc/razor/datepicker ) の Razor コード例を既存のプロジェクトに統合しようとしていることです。アプリケーションのプロファイル ページの「生年月日」(DOB) フィールドに Datepicker を追加したいと考えています。プロファイルには、データベース内のテーブル、モデル (profile.cs)、コントローラー (ProfileController.cs)、およびビュー/プロファイル ディレクトリ内のいくつかのビュー (インデックス、編集など) があります。すべての例は、作成に焦点を当てているようです。まったく新しいプロジェクト、新しいモデル、新しいコントローラーなどです。経験が比較的浅いため、既存のプロジェクトで概説されているデモ コードの使用方法に少し固執しています。

この部分クラスを ProfileController に配置できると想定しています。

public partial class DatePickerController : Controller
{
    public ActionResult FirstLook(FirstLookModelView viewModel)
    {
        viewModel.DatePickerAttributes.SelectedDate = viewModel.DatePickerAttributes.SelectedDate ?? DateTime.Today;
        viewModel.DatePickerAttributes.MinDate = viewModel.DatePickerAttributes.MinDate ?? new DateTime(1900, 1, 1);
        viewModel.DatePickerAttributes.MaxDate = viewModel.DatePickerAttributes.MaxDate ?? new DateTime(2099,
            12, 31);
        viewModel.DatePickerAttributes.ShowButton = viewModel.DatePickerAttributes.ShowButton ?? true;
        viewModel.DatePickerAttributes.OpenOnFocus = viewModel.DatePickerAttributes.OpenOnFocus ?? false;
        return View(viewModel);
    }
}

そして、ビュー要素を私の @Html.EditorFor(model => model.DOB) が現在ある Edit.cshtml に入れることができます

@(Html.Telerik().DatePicker()
        .Name("DatePicker")
        .HtmlAttributes(new { id = "DatePicker_wrapper" })
        .Min(Model.DatePickerAttributes.MinDate.Value)
        .Max(Model.DatePickerAttributes.MaxDate.Value)
        .ShowButton(Model.DatePickerAttributes.ShowButton.Value)
        .Value(Model.DatePickerAttributes.SelectedDate.Value)
)

@using (Html.Configurator("The date picker should...")
              .PostTo("FirstLook", "DatePicker")
              .Begin())
   { 
    <ul>
        <li>
            @Html.CheckBox("DatePickerAttributes.ShowButton", Model.DatePickerAttributes.ShowButton.Value)
            <label for="DatePickerAttributes_ShowButton">show a popup button</label>
        </li>
   <snip>

しかし、モデルのコードのセクションをどこに置くべきかについてかなり混乱しています...

public class FirstLookModelView
{
    public FirstLookModelView()
    {
        DatePickerAttributes = new DatePickerAttributes();
    }
    public DatePickerAttributes DatePickerAttributes { get; set; }
}

それは現在のモデルの Profile.cs に入りますか? 任意のガイダンスをいただければ幸いです。

PS Telerik フォーラムでも質問しています: http://www.telerik.com/community/forums/aspnet-mvc/documentation/difficulty-with-existing-project-and-adding-telerik-mvc-to- it.aspx

4

1 に答える 1

1

助けてくれた親友と Telerik のサポートのおかげで、答えを得ることができました。それは私だけかもしれませんし、MVC サポートの例が実際には混乱を招いているのかもしれません。Telerik の MVC を初めて使用しようとしている人、つまり MVC の初心者である人にとって、これが役に立てば幸いです。

プロジェクトで動作するように Telerik MVC をセットアップするためのチュートリアルに従っていると仮定します。現在、私は、Telerik MVC のツールの 1 つを初めて実装するのに苦労していました。

最初のステップとして、ここ (http://demos.telerik.com/aspnet-mvc/razor/datepicker) の「view」、「controller」、「_layout.cshtml」などのコード例を、必要な決定的なコードとして使用しないでください。埋め込む。「テンプレートの編集」をクリックすると (少なくともこの DatePicker の例では)、Razor の例でさらに多くのコードが表示されます: http://demos.telerik.com/aspnet-mvc/razor/datepicker/edittemplate

私の例を実際のコードに合わせて調整する必要がありますが、元の質問に投稿したコード例に固執します。モデル (Profile.cs) ファイルで、datetime フィールドを次のように修正します。

    [UIHint("MyCustomEditorTemplate")]
    public Nullable<System.DateTime> DOB { get; set; }

ヒント: モデル ファイルの先頭にある Using に、次を追加します。

      using System.ComponentModel.DataAnnotations;

public partial class DatePickerController : Controller および public class FireLookModelView に対する私の質問のコード スニペットは、ProfileController (または、コントローラー) に入ります。

ここで、DatePickerController.cs という名前の新しいコントローラーを作成します。

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

namespace MySite.Controllers
{
public class DatePickerController : Controller
{

}
public class DatePickerAttributes
{
    public DateTime? SelectedDate
    {
        get;
        set;
    }

    public DateTime? MinDate
    {
        get;
        set;
    }

    public DateTime? MaxDate
    {
        get;
        set;
    }

    public bool? ShowButton
    {
        get;
        set;
    }

    public bool? OpenOnFocus
    {
        get;
        set;
    }
}

public class TimePickerAttributes
{
    public DateTime? SelectedDate
    {
        get;
        set;
    }

    public DateTime? MinTime
    {
        get;
        set;
    }

    public DateTime? MaxTime
    {
        get;
        set;
    }

    public bool? ShowButton
    {
        get;
        set;
    }

    public int? Interval
    {
        get;
        set;
    }

    public bool? OpenOnFocus
    {
        get;
        set;
    }
}

public class DateTimePickerAttributes
{
    public DateTime? SelectedDate
    {
        get;
        set;
    }

    public DateTime? MinDate
    {
        get;
        set;
    }

    public DateTime? MaxDate
    {
        get;
        set;
    }

    public int? Interval
    {
        get;
        set;
    }
}
}

Views の下の Shared ディレクトリに、EditorTemplates という名前の新しいサブディレクトリを作成します。そこに空のファイルを作成し、DateTime.cshtml という名前を付けます。

@model DateTime?

@(Html.Telerik().DateTimePicker()
    .Name(ViewData.TemplateInfo.GetFullHtmlFieldName(string.Empty))
    .HtmlAttributes(new { id = ViewData.TemplateInfo.GetFullHtmlFieldName(string.Empty) + "_wrapper" })
    .Value(Model > DateTime.MinValue? Model : DateTime.Today)
)

ここで、datepicker を表示するページに移動します。私の場合は Views/Profile/Edit.cshtml でした:

HTML.EditorFor を次のように置き換えます。

@Html.Telerik().DatePickerFor(model => model.DOB)

..そして、Telerik MVC を使用して最初の実際の作業ツールをセットアップするために必要なすべての部品が実際にある (と私は信じています)。これがこれを見つけた人に役立つことを願っています!

エド

于 2012-05-30T21:06:06.663 に答える