0

I have a page containing a collection of Kendo NumericTextboxes. You can access a specific Kendo NumericTextbox using 

$("#idOfTheTextbox").data("kendoNumericTextBox")

My problem is that I want to get the collection of Kendo NumericTextboxes so that I can iterate over them using jquery. I want to do this so that I can programatically set the values of each NumericTextbox.

Here is the generated HTML for the NumericTextbox

<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="PolicySectionSummary.RiskSectionLimitValue" class="k-input" id="txtLimit" role="spinbutton" aria-disabled="false" aria-readonly="false" aria-valuenow="100000" aria-valuemin="0" aria-valuemax="99999999" style="display: none;" type="text" min="0" max="99999999" value="100000,00" data-val="true" data-role="numerictextbox" data-val-number="The field RiskSectionLimitValue must be a number."><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></span><script>
jQuery(function(){jQuery("#txtLimit").kendoNumericTextBox({"decimals":2});});

OnaBai
  • 40,767
  • 6
  • 96
  • 125
Andre Lombaard
  • 6,985
  • 13
  • 55
  • 96

1 Answers1

3

You can use the data-role attribute to filter all the kendo numeric text boxes (they all have data-role="numerictextbox" on the actual input, then apply your code in an each() call

$('[data-role="numerictextbox"]').each(function(){
    var $textbox = $(this);
    // do something with the textbox
});

JSFiddle here: http://jsfiddle.net/TrueBlueAussie/x6kKK

using sample HTML provided

iCollect.it Ltd
  • 92,391
  • 25
  • 181
  • 202
  • Using IE developer tools I can't find any data-role="numerictextbox", I tried to use the class (k-numerictextbox), but no luck thus far. – Andre Lombaard Sep 11 '13 at 09:49
  • @user65439: What version of KendUI you using? I am on latest quarter version. `k-numerictextbox` applies to the surrounding DIV, so you would need to dig deeper into that with a child filter. If you can post your specific HTML I can suggest a filter to suit. – iCollect.it Ltd Sep 11 '13 at 10:09
  • I'm using version 1.319, I added the generated HTML to my question. – Andre Lombaard Sep 11 '13 at 10:16
  • I can see `data-role="numerictextbox"` in your HTML snippet. Forget the IE Dev tools and use Chromes F12 debug window. It does not lie as much about the current state :) – iCollect.it Ltd Sep 11 '13 at 10:30
  • Added a JSFiddle using your snippet and `data-role="numerictextbox"`at http://jsfiddle.net/TrueBlueAussie/x6kKK/ – iCollect.it Ltd Sep 11 '13 at 10:35