22

グリッド自体にまだ表示されているはずの編集ポップアップでフィールドを非表示にする方法はありますか?

hidden:true に設定してみましたが、剣道はそれを無視しているようです。editable が false に設定されている場合、テキスト ボックスは非表示になりますが、フィールド ラベルは引き続き表示されます。ラベルとテキストボックスの両方を取り除くことは可能ですか?

私のデータソース:

schema: {
    total: "Total",
    data: "Data",
    model:{
        id:"Id",
        fields:{
            Id:{ visible: false, editable:false },
            Name:{ editable:true },
            NumberOfUsers:{ hidden:true, editable:false }
        }
    }
}
4

14 に答える 14

23

同様の解決策が私のために働いた：

edit: function(e) {
    e.container.find(".k-edit-label:first").hide();
    e.container.find(".k-edit-field:first").hide();
},
于 2013-05-08T13:40:56.163 に答える
18

「hidden: true」などのオプションがないため、無視されています。グリッドの編集イベントを使用して、ポップアップ ウィンドウから一部の要素を非表示にすることができます。

$("#grid").kendoGrid({
  edit: function(e) {
     e.container.find("input:first").hide();
  }
});
于 2013-05-07T11:16:13.857 に答える
14

ASP.NET MVC に Html.Kendo().Grid<>() を使用している場合は、次のようにする必要があります。

次のように、コントロール属性の .Events に Edit イベント ハンドラーを追加します。

.Events(e => e.Edit("hideIdField"))

「hideIdField」は、js イベント ハンドラー関数です。

EventHandlers.js で、関数を追加します。

function hideIdField(e) {
   $("#ProductID").hide();
   $("label[for='ProductID']").hide();
}

ProductID は、ソース モデルの Id フィールドの名前です。

于 2014-07-22T17:54:01.647 に答える
12

私は@jflが与える答えが好きです。そのアイデアを取り入れて、再利用可能な素敵なセットアップに拡張すると便利です。

なんで？非表示にする必要がある列の序数を追跡することには脆弱性があります。つまり、@jflの回答は最初のフィールドセット/列に対してのみ機能し、私のクイックコメントのバージョンでさえ、列の順序と潜在的に数が変わらないことが必要です。

代わりに、列の宣言にプロパティを配置することで列を非表示にする方法を標準化しedit、ポップアップが表示された後に呼び出されるイベント ハンドラーでそれを確認できます。columnsイベントで完全な宣言への参照を取得するeditため、柔軟性が非常に高くなります。

この fiddle に完全な例がありますが、ここでは簡単に説明します。

hideMe列宣言にプロパティを追加しました。

columns: [
    { field: "name" },
    { field: "position" },
    {
        field: "age",
        hideMe: true              // <<< This is new.
    },
    { command: "edit" }
],

次に、前述の回答とコメントに基づいて、editハンドラーにこれがあります。

e.sender.columns.forEach(function (element, index /*, array */) {
    if (element.hideMe) {
        e.container.find(".k-edit-label:eq(" + index + "), "
            + ".k-edit-field:eq( " + index + ")"
        ).hide();
    }
});

列序数の追跡はもう必要ありません。列を追加したり、注文を変更したり、新しいものを非表示にしたりできますhideMe。その上にあるものを変更するだけです。（振り返ってみると、おそらくそれを と呼ぶべきhideMeOnEditだったのですが、要点はわかります。）

于 2015-12-17T14:51:07.360 に答える
6

フィールドを非表示にするには、これをビュー モデルに追加するだけです。

[ScaffoldColumn(false)] 
public int Id { get; set; }

ファイルを保持して非表示にする場合は、次のようにします。

@(Html.Kendo().Grid<ViewModel>()
.Name("grid")
.Columns(columns =>
{
    columns.Bound(m => m.Id).Hidden()
    columns.Bound(m => m.Name)
}))
于 2015-09-27T22:49:25.453 に答える
4

同様の解決策が私のために働いた：

edit: function(e) {
    e.container.find("label[for=yourFieldName]").parent("div .k-edit-label").hide();
    e.container.find("label[for=yourFieldName]").parent().next("div .k-edit-field").hide();
},
于 2015-11-20T22:26:10.787 に答える
3

UI for ASP.NET MVC を使用している場合は、次のアプローチを使用して、コントロール自体を非表示にするだけでなく、フロントエンドのスペースを占有している FirstParent div も非表示にすることができます。

イベントハンドラを追加

Html.Kendo().Grid<ProductDTO>()
        .Name("GRVProducts")
        .Columns(c =>
            {     
                c.Bound(p => p.ProductID);
                c.Bound(p => p.Name);
                c.Bound(p => p.Price);                
            }
        )
        .Events(events=> events.Edit("HideGridFields"))

Javascript を追加

<script type="text/javascript">
    function HideGridFields(e)
    {
        HideControl("ProductID", e); //Hide ProductID control with Label and parent tag. No space occupied ;)
    }

    function HideControl(fieldName, e)
    {
        var cont = $(e.container);
        HideFieldLabel(cont.find("label[for='"+fieldName+"']"));
        HideFieldField(cont.find("#" +fieldName));
    }

    function HideFieldLabel(control)
    {
        control.parent(".editor-label").hide();
    }

    function HideFieldField(control) {
        control.parent(".editor-field").hide();
    }
</script>

ラベルと親タグで ProductID コントロールを非表示にします。フロントエンドにスペースがありません;)

于 2015-07-03T17:28:48.127 に答える
3

たとえば、フィールド PK_ があります。

 edit: function(e) {

    e.container.find("input[name='PK_']").hide();
    e.container.find("label[for='PK_']").hide();
}
于 2016-03-13T21:13:53.577 に答える
0

Typescript 1.xのruffinによって与えられた答えを拡張する

グリッド編集イベントで:

 , edit: function (e) {
         e.sender.columns.forEach((element, index) => {
               var ele: any = element;
               if (ele.attributes != undefined) {
                    if (ele.attributes.hideMe) {
                        e.container.find(".k-edit-label:eq(" + index + "), "
                        + ".k-edit-field:eq( " + index + ")"
                       ).hide();
                    }
               }
         });
     }

列に hideMe 要素を属性として追加します。

  columns: [
             {
                field: "Id",
                title: "", width: 1,
                attributes: { hideMe: true }
             },
   ...

typescript が宣言されていない 1 つの列フィールドをエラーとして報告するため、これが必要です。

于 2016-01-05T21:09:28.233 に答える