Ajaxify radgrid with dropdownlist control

[Dharampal]

Hi,
 I am working with Telerik Radgrid. In this radgrid I am using dropdownlist in edit template in a way that when user clicks on add button on the grid, The whole grid goes into the editmode. By doing so when user clicks on the first dropdown list it postbacks and reload the whole page which populates the second dropdown list with data. 


I want to ajaxify the radgrid on the page, so the whole page does not get refresh or postback. I have used both ajax manager and rad ajax panel to perform this job. But unfortunately the whole page gets autopostback. In my code behind in item created event i have set the dropdown as autopostback to true. I have read through so many blogs and demos on telerik website. But so far I haven't found any solution regarding my issue.

I am providing you the design source. Please tell me how to handle this ajax request on client side and server side. Provide me any small example which is following my scenario or most efficient way to handle this request.

Thanks


 <telerik:RadScriptManager ID="RadScriptManager1" Runat="server">
                                        </telerik:RadScriptManager>


                                           <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" 
                                     DefaultLoadingPanelID="RadAjaxLoadingPanel1>
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadGrid1t">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>

<telerik:RadGrid ID="RadGrid1" ShowStatusBar="true" runat="server" AutoGenerateColumns="False" Skin="Outlook" AlternatingItemStyle="VerticalAlign">
                                      
         
                                         <MasterTableView  CommandItemDisplay="Top" TableLayout="Fixed" >
          <CommandItemTemplate>
                                        <asp:LinkButton ID="btnEdit" runat="server" Text="Edit" OnClick="btnEdit_Click">
                                        </asp:LinkButton>
                                        </CommandItemTemplate>
 <CommandItemSettings ExportToPdfText="Export to PDF"></CommandItemSettings>
<RowIndicatorColumn FilterControlAltText="Filter RowIndicator column"></RowIndicatorColumn>
<ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column"></ExpandCollapseColumn>
                         <Columns>
              telerik:GridTemplateColumn DataField="Project" HeaderStyle-ForeColor="White" HeaderText="Company"  UniqueName="Company">
                    <ItemTemplate>
<asp:Label id="lblCompany" runat="server"></asp:Label>
   </ItemTemplate>
                    <EditItemTemplate>
                    
<asp:DropDownList id="ddCompany" runat="server" Width="80px"></asp:DropDownList>
                    <asp:RequiredFieldValidator id="vldddProjectRequired" runat="server" ErrorMessage="Please select a Company" 
ControlToValidate="ddCompany">!</asp:RequiredFieldValidator>
</EditItemTemplate>
                    </telerik:GridTemplateColumn> 


                    <telerik:GridTemplateColumn DataField="Employees" HeaderStyle-ForeColor="White" HeaderText="Employees" UniqueName="Employee" >
                    <ItemTemplate>
   <asp:Label id="lblEmployee" runat="server"></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:DropDownList id="ddEmployee" runat="server" Width="170px" ></asp:DropDownList>
</EditItemTemplate>
                    </telerik:GridTemplateColumn>
</Columns>
</MasterTableView>
</telerik:RadGrid>

[Sebastian]

Hello Dharampal,

I noticed that the first id of the grid set via the ajax manager setting is incorrect, see the highlighted part below:

<AjaxSettings>
         <telerik:AjaxSetting AjaxControlID="RadGrid1t">
             <UpdatedControls>
                 <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
             </UpdatedControls>
         </telerik:AjaxSetting>
     </AjaxSettings>

Can this be the reason why your grid is not ajaxified properly? Modify it to match the grid id to see whether this helps.

Generally, using either ajax manager or ajax panel as presented in the examples below should suffice to ajaxify our web grid and make it perform ajax requests instead of plain postbacks:

http://demos.telerik.com/aspnet-ajax/ajax/examples/manager/usercontrol/defaultcs.aspx
http://demos.telerik.com/aspnet-ajax/ajax/examples/panel/firstlook/defaultcs.aspx

Regards,
Sebastian
the Telerik team