[Solved] using Jquery Selector

[Divyang]

Hi,

How can we find all RadCombobox using jQuery Seletor and also attach javascript function to it.

Actual requirement is to find all controls on the page by jquery selector or telerik client api if available.

[Kalina]

Hello Divyang,

You can get all RadComboBox controls on a page via the control client-side API:

var combos = Telerik.Web.UI.RadComboBox.ComboBoxes;

All the best,
Kalina
the Telerik team

[Will]

Hi,

If I have a page containing 10 combo controls and 5 of them are within a div. How can I access only the 5 within a div rather than all 10 of them.

var combos = Telerik.Web.UI.RadComboBox.ComboBoxes will give me all of them.

Thanks,

[moegal]

if your JavaScript is on the same page then you can find the id like this:
var combo = $find("<%= RadComboBox1.ClientID %>");

If your JavaScript is not on the aspx page, I sometimes will assign a unique class to the field like CssClass="idRadComboBox1"

The I can reference it like this:  var combo= $find($('.idRadComboBox1').attr('id'));

Marty

[Will]

Hi Marty,

Rather than accessing the combo boxes one at a time, is there a way I can access of 5 of them at once. If I was to use a normal asp.net dropdownlist I would use something like

var combos = document.getElementById("IdOfDiv").getElementByTagName("select");

but unfortunately when telerik's radcombo list renders the html, there is no select tag.

Thanks,

[moegal]

I guess you could assign a group CssClass and then with jquery you will get an array that you can loop thru.

like:

<div>
            <telerik:RadComboBox ID="RadComboBox1" runat="server" DataSourceID="SqlDataSource1"
                DataTextField="stateName" DataValueField="stateID" CssClass="RadComboBoxes idRadComboBox1"
                EmptyMessage="Select State">
            </telerik:RadComboBox>
        </div>
        <div>
            <telerik:RadComboBox ID="RadComboBox2" runat="server" DataSourceID="SqlDataSource1"
                DataTextField="stateName" DataValueField="stateID" CssClass="RadComboBoxes idRadComboBox2"
                EmptyMessage="Select State">
            </telerik:RadComboBox>
        </div>

then If i were to use the jquery selector: console.log($('.RadComboBoxes'))

I would see something like:
[div#RadComboBox1.RadComboBox RadComboBox_Telerik RadComboBoxs idRadComboBox1, div#RadComboBox2.RadComboBox RadComboBox_Telerik RadComboBoxs idRadComboBox1, prevObject: b.fn.b.init[1], context: document, selector: ".RadComboBoxs", jquery: "1.9.1", constructor:function…]

You could loop thru this mess and find your individual client ids for each combo. 

Marty