Question

我是kendo UI的新手。我在div：

中有一个HTML

<div id="newlabel"></div>

在此div中，我想使用label添加一个数量在不断增加的新kendo UI button？

@(Html.Kendo().Button()
    .Name("button name")
    .HtmlAttributes(new { type = "button",
                          @class = "k-primary", 
                          id = "NewButton",
                          param = "newlabel",
                          style = "height:1.9em;font-size:11px;margin-top:8px;"})
    .Content(NEW BUTTON")
    .Events(ev => ev.Click("Addlabel")))

Answer 1

如果要在运行时在label内放置div，可以使用jQuery，如下所示：

$("<label id='testLabel'>Test</label>").appendTo("#newlabel");

您可以使用jQuery再次更改label的内容，如下所示：

$("#testLabel").text(number);

Answer 2

我准备了一个简单的演示版供您在此处测试：http://dojo.telerik.com/orOKI/3

这使用与MVC Wrapper基本相同的设置。

您需要做的就是将@Data_target =“{ YourDivIDHere }”添加到html属性中，如下所示：

.HtmlAttributes(new { type = "button",
                          @class = "k-primary", 
                          @Data_target="MyDivHere", 
                          id = "NewButton",
                          param = "newlabel",
                          style = "height:1.9em;font-size:11px;margin-top:8px;"})

然后，这会将data-target属性加载到按钮上，以便您可以定位正确的包含div。（这也意味着你可以在以后更改div。

然后使用我创建的addItems函数，我们有以下内容：

function addItems(e)
              {

                var target = $(e.sender.element[0]).data("target");
                $('#' + target).append('<div class="form-group">
                 <label class="col-md-2 form-label">I\'m a label</label>
                 <div class="col-md-10">
                 <input type="textbox" class="form-control" />
                 </div></div>'); 


              }

所有这一切都是从按钮获取data-target属性，如果这是页面上唯一使用您可以直接调用的特定数据属性的项目，而不是导航按钮结构以获取它的id。

然后，我正在做的是将一个标签和文本框添加到div中。

如果您需要更多信息或您的要求比这更多涉及，那么让我。

注意您始终可以使用kendo template，以便日后进行编辑。

单击kendo按钮时如何在div中添加新文本框？

2 个答案: