0

私は剣道グリッドを使用していて、名前フィールドを独自のデータソースを持つコンボボックスにしようとしています。javascriptエラーは発生しませんが、グリッドの名前フィールドを編集しようとすると、ComboBoxが表示されません。それでも入力フィールドが表示されます。

$(function () {

    console.log("ready");

    var datasource = new kendo.data.DataSource({
        transport: {
            read: {
                url: "", // Returns all items
                dataType: "json"
            }
        },
        pageSize: 10,
        schema: {
            model: {
                id: "Id",
                fields: {
                    Id: { type: "number", editable: false, nullable: false, visible: false },
                    Name: { type: "string", editable: true, nullable: false, validation: { required: true} },
                    Description: { type: "string", editable: true, validation: { required: true} }                        
                }
            }
        }
    });

    var grid = $("#grid").kendoGrid({
        dataSource: datasource,
        editable: true,
        height: 400,
        columns: [
            { field: "Id", width: 200 },
            {                    
                field: "Name",
                editor: function (container, options) {     // This is where you can set other control types for the field.                                                                   
                    $('< input name="' + options.field + '"/>').appendTo(container).kendoComboBox({
                        dataSouce: [{ Id: "1", Name: "MaryMaryMary" }, { Id: "2", Name: "John"}],
                        dataValueField: "Id",
                        dataTextField: "Name",                            
                    });
                }
            }
        ],
        dataBound: function (e) {
            console.log("DataBound");
        }
    });

});

javascriptエラーが発生していません。

4

4 に答える 4

2

どのバージョンのKendoUIを使用していますか？最近のSP1と3月のベータ版のみがカスタムエディターをサポートしています：http：//cdn.kendostatic.com/2011.3.1407/js/kendo.all.min.js

さらに、私は

  1. に置き換えられ&lt;、&gt;と;<>
  2. KendoComboBox用に作成されたスペルミスの「dataSouce」プロパティを修正しました。

これが私が作成したサンプルで、正しい方向に進むはずです。

于 2012-03-08T08:34:06.777 に答える
2

私のように、今「必死に」カスタムエディタが必要で、次のリリースを待つことができない人のために... :-)

...これが私の回避策です...kendo.all.jsの行＃12320を次のように変更します。

fields: { field: column.field, format: column.format, editor: column.editor },

...そしてvoilà！これで、列の「エディター」設定が有効になります。

上記のメッセージをhttp://www.kendoui.c​​om/forums/ui/grid/how-to-define-memo-style-editor-for-grid-cells.aspx#1938316に書き込みました

2012年1月6日で、現在のリリースはv2011.3.1129でした。

于 2012-03-09T03:48:13.997 に答える
1

その方法を示す例を公開しました。

于 2012-03-25T09:19:40.627 に答える
0

グリッドでMVC4を使用しています
：

columns.Bound("Productname").Title("Productname")                    
   .Width(200)                                           
   .EditorTemplateName(Productname);

EditorTemplateName=Productnameを作成します。
ビュー共有：

@(Html.Kendo().ComboBox()
             .Name("Ten_dvt")
             .DataValueField("Ten_dvt")
       .DataTextField("Ten_dvt")
       .Filter(FilterType.Contains)
        .HighlightFirst(true)
       .DataSource(source =>
       {
           source.Read(read =>
           {
               read.Action("Dm_dvt", "Combo");
           });
       })   .Events(e => e.Select("Select_Ma_dvt").Change("Change_Ma_dvt"))
   .HeaderTemplate("<table style=\"width:100%\"><tr><td  align=\"left\"
   style=\"width:30%\">" + @Tcommont("Ma") + "</td><td align=\"left\"
   style=\"width:70%\">" + @Tcommont("Ten") + "</td></tr></table>")
        .Template("<table style=\"width:100%\"><tr><td  align=\"left\" style=\"width:30%\">" + "#: data.Ma_dvt #" + "</td><td align=\"left\"
   style=\"width:70%\">" + "#: data.Ten_dvt #" + "</td></tr></table>" +
   "<div style='width:0px; height:0px;
   overflow:hidden'>;#:data.Ma_dvt#;#:data.Ten_dvt#;</div>") )

次に、以下を使用してフォームを編集します。

function Change_Ma_dvt(e) {  if (this.selectedIndex == -1) {
                              var grid = $("#gridItem2").data("kendoGrid");
                              var _dataItem = grid.dataItem(grid.select());
                              _dataItem.set("Ten_dvt", "");
                              _dataItem.set("Ma_dvt", "");
                          } }

と 

function Select_Ma_dvt(e) {    var _Arr = e.item.text().split(";");
                          var grid = $("#gridItem2").data("kendoGrid");
                          var _dataItem = grid.dataItem(grid.select());
                          _dataItem.set("Ma_dvt", _Arr[1]);
                          break; }

最後のグリッド表示名を選択すると、IdまたはMaが非表示を選択します

于 2015-03-06T04:22:56.320 に答える