1

ページの読み込み時にテレリック ドロップダウン リストを設定するにはどうすればよいですか?

ドロップダウンリストに入力しようとすると、次のエラーが発生します(下の強調された行で):

Error: 'data(...)' is null or not an object

テレリック ddl に入力しようとする方法は次のとおりです。

$(function(){
var values = [];
for (var i = 1; i < 10; i++) { 

values.push({ Text: i, Value: i });
}
****$("#MyDdl").data("tDropDownList").dataBind(values);****
});

この方法でも試してみました：

 $(function(){
    onDataBinding();
    });

function onDataBinding(e) {
        var MyDdl = $('#MyDdl').data('tDropDownList');
        var values = [];
        for (var i = 1; i < 10; i++) {  
    values.push({ Text: i, Value: i });
    }
      ****MyDdl.dataBind(values);****
    };

ただし、上記の強調された行で次の未定義エラーが発生します。

Error: 'undefined' is null or not an object

注: ボタンを追加し、ボタン クリック イベントで ddl をロードすると、テレリック ドロップダウン リストに入力されます。このようにすると、完全に正常に機能します。

    $(function(){
   var values = [];
        for (var i = 1; i < 10; i++) {             
        values.push({ Text: i, Value: i });
        }
        $("#MyDdl").data("tDropDownList").dataBind(values);            
    });

どんな助けでも大歓迎です。

4

2 に答える 2

2

DropDownList の OnLoad イベント ハンドラに設定する必要があります。

.ClientEvents(events => events.OnLoad("ddl_onLoad").OnChange("ddl_onChange")

ハンドラ:

function ddl_onLoad(e) {

    var ddl = $(this).data('tDropDownList');

    ddl.dataBind([
        { Text: 'Product 1', Value: '1' },
        { Text: 'Product 2', Value: '2', Selected: true },
        { Text: 'Product 3', Value: '3' },
        { Text: 'Product 4', Value: '4' }
    ]);
}

function ddl_onChange(e) {

    //var ddl = $(this).data('tDropDownList');
    console.log(e.value);
}
于 2012-11-01T22:31:52.087 に答える
1

onDataBinding() 関数を直接呼び出さないでください。コントロールのクライアント側イベントにリンクしてみてください。

ビュー:

   <%= Html.Telerik().DropDownList()
                          .Name("DropDownList")
                          .ClientEvents(events => events
                          .OnDataBinding("onDropDownListDataBinding"))
        %>

JS :

   <script type="text/javascript">
            function onDropDownListDataBinding(e) {
                    var MyDdl = $('#MyDdl').data('tDropDownList');
                     MyDdl .dataBind([
            { Text: "Product 1", Value: "1" },
            { Text: "Product 2", Value: "2", Selected: true },
            { Text: "Product 3", Value: "3" },
            { Text: "Product 4", Value: "4" },
            { Text: "Product 5", Value: "5" }            
        ]);
            };
    </script>
于 2012-10-29T05:45:57.067 に答える