Jquery选择Telerik数字文本框值

时间:2015-01-12 16:38:00

标签: jquery telerik

我有一个或多个Telerik数字文本框的MVC 5视图,每个文本框都呈现如下:

<span class="k-widget k-numerictextbox">
<span class="k-numeric-wrap k-state-default">
    <input tabindex="0" class="k-formatted-value k-input" aria-disabled="false" aria-readonly="false" style="display: inline-block;" type="text">
    <input name="SelectedMinimumChange" class="k-input" id="SelectedMinimumChange" role="spinbutton" aria-disabled="false" aria-readonly="false" aria-valuenow="10" aria-valuemin="5" aria-valuemax="95" style="display: none;" type="text" min="5" max="95" step="5" value="10" data-role="numerictextbox">
    <span class="k-select">
        <span class="k-link" style="-ms-touch-action: double-tap-zoom pinch-zoom;" unselectable="on">
            <span title="Increase value" class="k-icon k-i-arrow-n" unselectable="on">Increase value
            </span>
        </span>
        <span class="k-link" style="-ms-touch-action: double-tap-zoom pinch-zoom;" unselectable="on">
            <span title="Decrease value" class="k-icon k-i-arrow-s" unselectable="on">Decrease value
            </span>
        </span>
    </span>
</span>

我的任务是获取第二个输入标签中的选定值,保存在属性“value”中(在此示例中为10)并隐藏控件

获取控件很容易(即使对我来说):

$(".k-numerictextbox").each(function () {
      var control = $(this);
      …     try to get the value
      Control.hide();
});

查找并隐藏控件。我可以通过以下方式获取特定控件的值:

var displayVal = input.data("kendoNumericTextBox").value()

但我尝试将足够多的JQuery选择器串联起来并没有奏效。我需要从控件转到具有类“k-input”(有2个)的子项,然后具有属性[data-role] ='numerictextbox'的子项然后获取属性值的值。我在每个循环中尝试了[很多东西] - 我的最后一个:

var displayVal = control.children(".k-input").find("[data-role]='numerictextbox'")

感觉它在正确的轨道上,但我无法弄清楚谁将添加下一个选择器以获得结果。

谢谢, 斯科特

1 个答案:

答案 0 :(得分:0)

决定从内到外 - 这里有效:

        $("input[type=text][id][data-role=numerictextbox]").each(function () {
        var input = $(this); //the element within the numerictextbox with the id
        var id = input.attr("id"); //get the id
        var control = $("#" + id).data("kendoNumericTextBox"); //get the kendo control from the id
        var displayVal = control.value(); //the value we want to display
        var displayElem = $("<span />"); //new display element
        displayElem.text(displayVal);
        var topControlElement = input.closest(".k-numerictextbox"); //get the root element making up the kendo numerictextbox
        displayElem.insertBefore(topControlElement);
        control.destroy();
        topControlElement.remove();
    });