Login   /   Register

Rad ComboBox for ASP.NET AJAX ( Telerik )

Rate this article
     3 votes, average: 5 out of 53 votes, average: 5 out of 53 votes, average: 5 out of 53 votes, average: 5 out of 53 votes, average: 5 out of 5
Loading ... Loading ...
December 6th, 2009 by daniva

Google Search Results

You arrived here after searching for the following phrases:

Click a phrase to jump to the first occurrence, or return to the search results.

Introduction

I’ve seen a lot of questions and support requests on different web forums and QTP web sites, regarding Rad Telerik controls.
i will try to help the community by supplying a basic Web extensibility toolkit support for ASP.NET AJAX.
The first focused control will be the RadComboBox for ASP.NET AJAX.

Telerik RadComboBox for ASP.NET AJAX is a flexible drop-down control for ASP.NET applications.

I have already published an article, guiding the community, on how to build, step by step, a Web Extensibility support kit ( dhtmlxComboBox control ).
This time, i will spare on explaining every topic, so i will provide the toolkit package, ready to be used.

You can “test” your code using the RadComboBox demos on the Telerik web site : http://demos.telerik.com/aspnet-ajax/combobox/examples/overview/defaultcs.aspx
Before you deploy the support kit you must be aware that Telerik controls have different versions, so maybe some modifications will required. Since the support toolkit runs JavaScript code on the client, you must set the Active Scripting option to enable, on your browser ( Internet Options > Security tab ).

About this toolkit support

  • This Package was developed with Test Design Studio Patterson Consulting, LLC
  • The package was developed using the Q3′09 ASP.NET AJAX version.
  • The package was tested on Internet Explorer 7.

Identifying a Rad ComboBox Control

To identify any object correctly, and inspect/analyze a web page DOM, i always use DebugBar - IE extension for web developer plug-in.

in the following page http://demos.telerik.com/aspnet-ajax/combobox/examples/default/defaultcs.aspx we can see 4 RadComboBox elements.

image

after inspecting the DOM and review the RadComboBox documentation, i decided to identify every object based on two criteria’s

1. the tagName element : DIV
2. the className name: RadComboBox RadComboBox_* ( regular expression )

Documentation :

image

Structure :

image

DOM :

image

This time i decided to develop the Telerik Toolkit support, with Test Design Studio - Patterson Consulting using the built-in Web Extensibility toolkit feature.

comparing to the previous development, TDS makes the difference!!

with features like intellisense, a detailed project folder so the project remains organized, the auto documentation and the most killer feature : the Toolkit auto deployment.
When using TDS, you don’t need to worry about xml syntaxes, key or attributes names or values, JavaScript editors, you don’t need to memorize functions/attributes/properties names. you just get all with TDS.

although that i found some minor issues, i contacted Patterson Consulting support and within 3 days, i got a new release, with all the issues fixed!

image 
After creating the basic configurations was able to identify the RadComboBox objects and add them to the object repository:

image

Identification Properties

The toolkit support for RadComboBox support the following identification properties :

html id          : The id of the main DIV element
attached text    : the attached LABEL if present
name             : based on the INPUT element name
items count      : number of items( if control implements the load on-demand feature, the initial value will be 0 ( zero )

text             : The list selected text.
value            : The list selected value
focused          : focused true or false
visible          : visible true/false
html tag         : always DIV
class            : The actual control className
enabled          : Enable true/false
readonly         : read only true/false
visibilitymode   : for more information see the RadComboBox documentation
attributes       : number of custom attributes
clientstate      : for more information see the RadComboBox documentation
errormessage     : any custom error message attached to the control.
isCasesensitive  : is case sensitive true/false. valid information while searching list items using control built-in methods.
clientdatastring : for more information see the RadComboBox documentation.
changeText       : for more information see the RadComboBox documentation.
selectedindex    : The index of the selected item.
isdropdownvisible: returns true while the dropdown list is currently open, false otherwise. 
visibleitems     : The number of visible items. 
filter           : As of Q2 2008 version; for more information see the RadComboBox documentation.
originaltext     : for more information see the RadComboBox documentation.
isMulticolumn    : true/false if the combo-box uses multi-column display.
headercols       : number of header columns, if the combo-box uses multi-column display, zero otherwise.
isinitialized    : for more information see the RadComboBox documentation.
emptymessage     : for more information see the RadComboBox documentation.
loadingmessage   : for more information see the RadComboBox documentation.
innerhtml        : The HTML code contained between the object’s start and end tags.
outerhtml        : The object’s HTML code and its content. Supported in Internet Explorer only.
abs_x            : The object’s absolute x-coordinate (left) relative to the screen (in pixels). 
abs_y            :
The object’s absolute y-coordinate (top) relative to the screen (in pixels).
width            : The object’s width (in pixels).
height           : The object’s height (in pixels).
x                : The object’s x-coordinate (left) relative to the frame (in pixels).
y                : The object’s y-coordinate (top) relative to the frame (in pixels).

 

All the values can be retrieved during run-time, using the GetROProperty method.

Browser("ASP.NET ComboBox Demo").Page("ASP.NET ComboBox Demo").RadComboBox("Product:").GetROProperty( "items count" )Browser("ASP.NET ComboBox Demo").Page("ASP.NET ComboBox Demo").RadComboBox("Product:").GetROProperty( "enabled" )Browser("ASP.NET ComboBox Demo").Page("ASP.NET ComboBox Demo").RadComboBox("Product:").GetROProperty( "selectedIndex" )

image

Function Library

I found that QuickTest Web Extensibility has two MAJOR problems.

1. There is no way to debug your JavaScript code. ( only using a primitive _util.LogLine method )

2. JavaScript functions can’t return or receive as arguments objects to QTP interface. ( they can, according the documentation, but they actually don’t )

regarding the previous major problems I’ve described, i found a workaround by adding a function library named RadComboBox.qfl to the project.

The library implements complex methods ( hard to debug ) and functions that return or receive objects as arguments.

Most of the functions were registered to the RadComboBox control.

to use the full capability of the toolkit, you must associate ( or load ) the function library file (RadComboBox.qfl) to your test.

Built-in Usage

Executing Checkpoints on custom properties

image

Using the Step Generator

image

Custom Synchronization Points

image

Using the Web-Extensibility Toolkit Support

All Users

QTP Web-Extensibility must be installed!!

if you want to run all the examples shown in the online help, please download this shared object repository and add it to your test resources.

 RadComboBox Share Object Repository

TDS users

If you are a TDS user download this file Telerik for TDS users, unzip the file and from TDS import the package.

Then, you just have to BUILD the project, and you’re done.

QTP Users

Download this file  Telerik for QTP users , unzip it anywhere in your disk.

  • move the TelerikTestObjects.xml file to C:\Program Files\HP\QuickTest Professional\dat\Extensibility\Web
  • move the radcombobox.js, TestObjectCommon.js and ToolkitDefault.js to C:\Program Files\HP\QuickTest Professional\dat\Extensibility\Web\Toolkits\Telerik
  • move the Telerik.xml to C:\Program Files\HP\QuickTest Professional\dat\Extensibility\Web\Toolkits\Telerik
  • move the rad_combobox.ico to C:\Program Files\HP\QuickTest Professional\dat\Extensibility\Web\Toolkits\Telerik\res
  • move the RadComboBox.qfl function library to your tests or functions folder.

If you did everything properly you should see the QuickTest Add-in manager with TELERIK add-in

image

General Remarks

The RadComboBox web-extensibility toolkit support was overloaded in purpose with methods, read-only properties, properties and a lot of identification properties.

sometimes you will find duplicates for example

  1. DropDownVisible property is equivalent to IsDropDownVisible read-only property and the ShowDropDown(), HideDropDown() methods.
  2. SelectedText property, and GetROProperty( “text” ) will return the same values.

as i said , everything was done in purpose with one goal : Learning

you will have a god reference when you’ll develop your own toolkit, whenever is a method, a read-only property, a writeable property or an object identification.

 

Online help

TDS auto generated the online help ( with some personal modifications ) that you are about to see.

use the online help to understand how to work with the toolkit.

Documentation :  Telerik Toolkit Support

Posted in web

4 Responses to “Rad ComboBox for ASP.NET AJAX ( Telerik )”

  1. Rad ComboBox for ASP.NET AJAX ( Telerik ) | AdvancedQTP Scripts Rss Says:

    [+]

    [...] more here: Rad ComboBox for ASP.NET AJAX ( Telerik ) | AdvancedQTP By admin | category: asp.net script | tags: diff... ...

  2. Meir Bar-Tal Says:

    [-]

    Thanks Dani - Impressive as always. Hurray!

  3. ambareesh Says:

    [+]

    Hi Danny, THis article is very much helpful for automating the Applications built on Telerek. Eagerly waiting for the support of ... ...

  4. mattnoks Says:

    [+]

    Daniva you are the first person I've ever seen to publish a real solution for Telerik and QTP. How would you go about adding the ... ...

Leave a Reply

You must be logged in to post a comment.

This article was viewed 303 times