3

これが私が持っているものです：

gridComplete: function() {
    var doneButton = $('<input>', {
        type: 'button',
        value: 'Done',
        click: function() {
            alert("Done!");
        }
    });

    console.log("HTML:", doneButton.html());

    var ids = $(this).jqGrid('getDataIDs');
    var self = this;
    _.each(ids, function(id) {
        $(self).jqGrid('setRowData', id, {
            MarkDone: doneButton.html()
        });
    });
}

doneButton オブジェクトを挿入しようとすると、jqGrid セルは実際のボタンではなく [object Object] をレンダリングします。そのため、生の HTML を期待していると推測できます。ただし、doneButton.html() は空の文字列を返します...おそらく、doneButton オブジェクトをドキュメントにまだ追加していないためです。

jQueryでこれを行うためのトリックはありますか? HTMLマークアップを生成するためのよりクリーンで安全な構文を好むのですが、これを行うことができます:

gridComplete: function() {
    var doneButtonHtml = "<input type='button' value='Done' onclick=\"alert('Done');\" />";

    var ids = $(this).jqGrid('getDataIDs');
    var self = this;
    _.each(ids, function(id) {
        $(self).jqGrid('setRowData', id, {
            MarkDone: doneButtonHtml
        });
    });
},

ボタンを期待どおりにレンダリングします。

4

4 に答える 4

1

内側のHTMLをhtml()返すため、ボタンから空の文字列を取得します。

あなたはおそらくしたいですdoneButton.get(0).outerHTML

于 2013-03-27T17:22:05.920 に答える
1

あなたが何を望んでいるかを私が正しく理解していれば、別の方法を使用して同じことができます。Web ブラウザーのリフローの回数を減らすために、jqGrid ビルド グリッド本体を切断してから、1 つに挿入します。gridview: trueパフォーマンス上の利点を得るために使用する必要があります。問題は、jqGrid がグリッド本体を DOM ではなく HTML 文字列として構築することだけです。jqGrid は、カスタム フォーマッタ、 cellattr および rowattr コールバックを提供します。これにより、カスタム列のコンテンツを構築したり、行にいくつかのカスタム属性を設定したりできます。詳細については、回答を参照してください。

だからあなたがすべきことは

  1. MarkDoneコンテンツ"<input type='button' value='Done' />"(なしclick) イベント ハンドラーを含む列のカスタム フォーマッターを提供します。
  2. onCellSelectまたはコールバックを使用して、「完了」ボタンのクリックを含むグリッド本体の任意の場所でイベントbeforeSelectRowをキャッチします。イベント バブリング(こちらを参照) は、グリッドで必要なイベント ハンドルの数を減らすのに役立ちます。クリックされたセルを取得し、列番号を取得し、クリックされた列の名前を取得します。click$td = $(e.target).closest("td")iCol = $.jgrid.getCellIndex($td[0])this.p.colModel[iCol].name

答え、別のもの、および最も古いものは、必要なコード例と追加情報を取得します。

于 2013-03-27T17:43:41.320 に答える
0

これを変える：

MarkDone: doneButtonHtml.html()

に：

MarkDone: doneButtonHtml.get(0)

doneButtonHtmlは DOM 要素配列です。その配列の最初の要素を取得するには、get(0)を呼び出す必要があります。

于 2013-03-27T17:26:41.330 に答える
0

最初に覚えておくべきことは、.HTML() は要素自体の html ではなく、実際には要素内の html を取得するということです。

オブジェクトの jQuery 配列から Javascript 要素にアクセスすると、生の html が返されます。このフィドルをチェックしてください：http://jsfiddle.net/NvKYT/

var doneButton = $('<input>', {
    type: 'button',
    value: 'Done',
    click: function() {
        alert("Done!");
    }
});

//doneButton[0] - your html

jQuery でラップされた要素ではなく、実際の要素であるため、doneButton[0] を渡してみてください。

于 2013-03-27T17:29:10.807 に答える