0

いくつかのKendoUIチュートリアルを実行していますが、グリッド上のテキストボックスの外観に問題があります。私がフォローしているデモはhttp://demos.kendoui.c​​om /web/grid/editing-inline.htmlです。

グリッドで日付をフォーマットし、エディターで日付に日付ピッカーを使用する方法を理解しました。これを行うために、エディターテンプレートを使用しました。

cssクラスを適用できるように、名前列のエディターテンプレートを追加しました。見た目は良くなりますが、正しく機能しません。エディタを開くと、テキストボックスの値は空になります(画像を参照)。確かに、cssクラスを適用する簡単な方法があるはずです。

グリッド内のすべてのテキストボックス用のエディターテンプレートを作成する必要がありますか?もしそうなら、どうすれば編集時に価値をもたらすことができますか?

グリッドのコードは次のとおりです。

@(Html.Kendo().Grid<Product>()    
.Name("Grid")    
.Columns(columns => {        
    columns.Bound(p => p.Name);
    columns.Bound(p => p.UnitPrice).Width(140);
    columns.Bound(p => p.Units).Width(140);
    columns.Bound(p => p.Discontinued).Width(100);
            columns.Bound(p => p.Date).Width(100).Format("{0:d/M/yyyy}");
    columns.Command(command => { command.Edit(); command.Destroy(); }).Width(200);
})
.ToolBar(toolbar => toolbar.Create())
.Editable(editable => editable.Mode(GridEditMode.InLine))
.Pageable()
.Sortable()
.Scrollable()
.DataSource(dataSource => dataSource        
    .Ajax()                 
    .Events(events => events.Error("error_handler"))
    .Model(model => model.Id(p => p.Id))
    .Create(update => update.Action("EditingInline_Create", "Home"))
    .Read(read => read.Action("EditingInline_Read", "Home"))
    .Update(update => update.Action("EditingInline_Update", "Grid"))
    .Destroy(update => update.Action("EditingInline_Destroy", "Grid"))
)

)。

名前エディタテンプレートのコードは次のとおりです。

@using Kendo.Mvc.UI
@model KendoUiOne.Models.Product

@Html.TextBoxFor(x=>x.Name, new {@class = "k-input k-textbox"})

エディターを開く

4

3 に答える 3

2

問題は、エディターテンプレートに渡されるモデルが製品ではなく、文字列だけであるということです。これは、エディターテンプレートのモデルが文字列であることを意味します。また、TextBoxヘルパーをモデル自体用として宣言する必要があります。

Editorテンプレートは次のようになります。

@model string

@Html.TextBoxFor(x=>x, new {@class = "k-input k-textbox"})
于 2013-03-08T15:04:57.173 に答える
0

興味深いことに、TextBoxForヘルパーを使用する代わりに、ウィジェットの名前を「Name」に設定してみてください。

例えば

@Html.TextBox("Name", new {@class = "k-input k-textbox"})
于 2013-03-06T21:14:17.840 に答える
0

試す:

@Html.TextBox("Name", Model.Name, new {@class = "k-input k-textbox"})

または、最初にHTMLを試して、問題をデバッグしてから、Html.TextBoxヘルパーに戻ります。

<input type="text" id="Name" value="@Model.Name" class="k-input k-textbox"/>
于 2013-03-07T18:44:57.087 に答える