[HowTo] External components in editing

[Alexander Bulei]

In this tutorial, we will show you how to use external controls in editing of row.

Lets see a real example:

What we need? :

• Column with dropdown
• Column with edit and few buttons inline.

Steps:

1. Drop the IWCGJQDropDown into IWCGJQGrid and confirm the message.
   
   jqgrid1.png
   
   
   • Set the Visible to False
     
   • if you have static items, use the Items property / if you have dynamic items, use the DataLink (ListDataSource) property
     
2. Drop IWCGJQRegion into IWCGJQGrid and confirm the message.
   
   • Set the Visible to False
     
   • Define your layout
     
     grid2.png
     
     
3. Now, go to column which will contain the IWCGJQDropDown and assign the EditOptions.Control to IWCGJQDropDown
4. Go to column which will contain the IWCGJQRegion and assign the EditOptions.Control to IWCGJQRegion

Result:

grid3.png

Important:

• Set the IWCGJQGrid.RenderInvisibleControls to True

Notes/Tips:

• If you need only the DatePicker or AutoComplete, uses built-in options (EditOptions.DatePickerOptions and EditOptions.AutoCompleteOptions)
• If will use multiple componentes, uses the IWCGJQRegion.