0

これが私の状況です。

この記事を参考に動的フォームを作っています。

ここでそれを見ることができます (記事のデモ) use kendo template.

  <script id="fieldsTemplate" type="text/x-kendo-template">
        <li>
             <label data-bind="attr: { for: name}, text: label"></label>
             <input data-bind="attr: { type: type, name: name, class: css}" # if (get("required")) {# required #} # />
       </li>
  </script>

フォームが生成された後、このフォームはフォームを作成するだけHTML5です。剣道属性はありません。たとえば、data-role属性と値をバインドした場合numerictextbox、数値テキストボックスは表示されません（そのタイプは数値だと思います）。これらのプロパティはありません（数値を入力しても、デフォルトの小数点は表示されません。その数値のみが表示されます。）

しかし、この例では、data-role 属性と値を numerictextbox として追加すると、数値テキスト ボックスになります。

しかし、ドキュメントやthisでは、数値テキスト ボックスを作成するには kendoNumericTextBox メソッドを呼び出す必要があるようです。

このコードをテンプレートに追加しようとしても機能しません (これを正しく追加したと仮定してください)。

      $("#mytextboxid").kendoNumericTextBox();​

それで、私はどのオプションを残しましたか?? どうもありがとうございました

4

1 に答える 1

0

要素を kendo コントロール/要素に変換するには、input 要素に data-role 属性を設定する必要があります。以下のコード スニペットを試してみてください。

<body>
    <div id="example">
        <!-- container UL to host input fields -->
        <ul data-template="fieldsTemplate" data-bind="source: fields"></ul>
    </div>


    <!-- Kendo Template binds properties from model to input fields -->
    <script id="fieldsTemplate" type="text/x-kendo-template">
        <li>
            <label data-bind="attr: { for: name}, text: label"></label>
            <input name=#= name #  class=#= css # # if (get("required")) {# required #} # 
              # if (type == 'number') {# data-role="numerictextbox" #}else{# type=#=type#  #}#  />
        </li> 
    </script>

    <script type="text/javascript">
        // retrieve the model from an API call
        var model = {
            "fields": [{
                "css": "cssClass1",
                "label": "Field 1",
                "name": "Field1",
                "required": false,
                "type": "text"
            },
            {
                "css": "cssClass2",
                "label": "Field 2",
                "name": "Field2",
                "required": true,
                "type": "number"
            },
            {
                "css": "cssClass2",
                "label": "Checkbox Field",
                "name": "CheckField",
                "required": false,
                "type": "checkbox"
            },
            {
                "css": "cssClass2",
                "label": "Email Address",
                "name": "Email",
                "required": true,
                "type": "email"
            },
            {
                "css": "cssClass2",
                "label": "Password",
                "name": "Password",
                "required": true,
                "type": "password"
            }
            ]
        };
        // convert the JSON to observable object
        var viewModel = kendo.observable(model);
        // bind the model to the container
        kendo.bind($("#example"), viewModel);

    </script>
</body>

JSFiddle

気になることがあれば教えてください。

于 2015-09-07T12:42:53.557 に答える