0

JQuery Sparklines プラグインを Kendo Grid テンプレートに統合する方法の例はありますか?

JQuery スパークライン

これはかなり簡単だと思いますが、次のようなことをするたびに: テンプレート:<span class="inlinebar">75,25,0,100</span> 実際のスパークラインではなく、値 75,25,0,100 のみがグリッドに表示されます。

誰かがサンプルまたはソリューションを投稿できれば幸いです。ありがとう！

コード例:

<script>
$('.inlinebar').sparkline('html', {type: 'bullet'});    
$(document).ready(function() {                                              
        $("#grid").hide();

        var grid = $("#grid").kendoGrid({
                dataSource: {
                    transport: {
                        read: {
                            url: "/Services/testService",
                            dataType: "json",
                            type: "GET",
                            data: {                                
                            }
                        }
                    },
                    schema: {
                        model: {
                            fields: {
                                field1: {type: "number"},
                                field2: {type: "number"},
                                field3: {type: "number"}
                            }
                        }                
                    },
                    pageSize: 15
                },
                selectable:"cell",
                toolbar: kendo.template($("#template").html()), 
                height: 350,                
        filterable: true,        
        scrollable: true,
        sortable: true,                
        pageable: true,
                columns: [
                    {field: "field1", title: "Field 1"},
                    {field: "field2", title: "Field 2", template:'<span class="inlinebar">75,25,0,100</span>'},
                    {field: "field3", title: "Field 3"}
                    ]                          
                    });

4

1 に答える 1

1

コードにはいくつかの問題があります。

  1. $('inlinebar').sparkline('html', {type: 'bullet'});クラスに正しいjQueryセレクターを使用していません（.の前にありませんinlinebar）
  2. ajax 経由でデータをロードしているため、剣道 UI グリッドが初期化される前にスパークラインが実行されるため、現在の状態では機能しません。Kendo のイベント内でスパークライン コードを実行する必要がありますdataBound(こちらhttp://docs.kendoui.c​​om /api/web/grid#events を参照)。そうすれば、スパークラインが実行されるまでにデータとスパンが存在します。
于 2012-08-27T18:41:03.777 に答える