Ajaxify imgbutton in rad grid

2 posts, 0 answers
  1. Brian
    Brian avatar
    1 posts
    Member since:
    Oct 2012

    Posted 02 Mar 2012 Link to this post

    I am using 2 RadButtons to search for a (Host or Victim) student then load 2 Radgrids via ajax.
    I am pre populating the search criteria txtFirstName with "Cor" and txtLastName with "A".
    This returns 5 rows from my DB.
    When the Radgrids bind the ajax fires correctly and I can compare the 2 Students below.
    In the Other radgrids that hold additional information.
    If I change my search criteria to something else that will return more rows to the RadGrid.
    The ajax is only firing for the first 5 rows.
    If I swap out my 2 search RadButtons with regular ASP:Buttons and fire a post back to bind the 2 SearchRadGrids then all the rows are able to fire the ajax correctly.

    any help is appreciated? Thanks


    <
    telerik:RadScriptManager ID="RadScriptManager1" runat="server" />
                <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel1">
                    <AjaxSettings>
                        <telerik:AjaxSetting AjaxControlID="btnHostSearch">
                            <UpdatedControls>
                                <telerik:AjaxUpdatedControl ControlID="hostSearchGrid"
                                    LoadingPanelID="hostSearchLoadingPanel" />
                            </UpdatedControls>
                        </telerik:AjaxSetting>
                        <telerik:AjaxSetting AjaxControlID="btnVictimSearch">
                            <UpdatedControls>
                                <telerik:AjaxUpdatedControl ControlID="victimSearchGrid"
                                    LoadingPanelID="victimSearchLoadingPanel" />
                            </UpdatedControls>
                        </telerik:AjaxSetting>
                        <telerik:AjaxSetting AjaxControlID="hostSearchGrid">
                            <UpdatedControls>
                                <telerik:AjaxUpdatedControl ControlID="hostStudentInfoGrid"
                                    LoadingPanelID="hostStudentInfoLoadingPanel" />
                                <telerik:AjaxUpdatedControl ControlID="hostSchoolInfoGrid"
                                    LoadingPanelID="hostSchoolInfoLoadingPanel" />
                                <telerik:AjaxUpdatedControl ControlID="hostAdmissionInfoGrid"
                                    LoadingPanelID="hostAdmissionInfoLoadingPanel" />
                            </UpdatedControls>
                        </telerik:AjaxSetting>
                        <telerik:AjaxSetting AjaxControlID="victimSearchGrid">
                            <UpdatedControls>
                                <telerik:AjaxUpdatedControl ControlID="victimStudentInfoGrid"
                                    LoadingPanelID="victimStudentInfoLoadingPanel" />
                                <telerik:AjaxUpdatedControl ControlID="victimSchoolInfoGrid"
                                    LoadingPanelID="victimSchoolInfoLoadingPanel" />
                                <telerik:AjaxUpdatedControl ControlID="victimAdmissionInfoGrid"
                                    LoadingPanelID="victimAdmissionInfoLoadingPanel" />
                            </UpdatedControls>
                        </telerik:AjaxSetting>
                    </AjaxSettings>
                </telerik:RadAjaxManager>
                <%--Loading Panels--%>
                <telerik:RadAjaxLoadingPanel ID="hostSearchLoadingPanel" runat="server"></telerik:RadAjaxLoadingPanel>
                <telerik:RadAjaxLoadingPanel ID="victimSearchLoadingPanel" runat="server"></telerik:RadAjaxLoadingPanel>
                <telerik:RadAjaxLoadingPanel ID="hostStudentInfoLoadingPanel" runat="server"></telerik:RadAjaxLoadingPanel>
                <telerik:RadAjaxLoadingPanel ID="hostSchoolInfoLoadingPanel" runat="server"></telerik:RadAjaxLoadingPanel>
                <telerik:RadAjaxLoadingPanel ID="hostAdmissionInfoLoadingPanel" runat="server"></telerik:RadAjaxLoadingPanel>
                <telerik:RadAjaxLoadingPanel ID="victimStudentInfoLoadingPanel" runat="server"></telerik:RadAjaxLoadingPanel>
                <telerik:RadAjaxLoadingPanel ID="victimSchoolInfoLoadingPanel" runat="server"></telerik:RadAjaxLoadingPanel>
                <telerik:RadAjaxLoadingPanel ID="victimAdmissionInfoLoadingPanel" runat="server"></telerik:RadAjaxLoadingPanel>
     
                <telerik:RadFormDecorator ID="FormDecorator1" runat="server" DecoratedControls="Buttons">
                </telerik:RadFormDecorator>
                <br />
                <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server">
                    <asp:Label Text="First Name:" runat="server"></asp:Label>
                    <asp:TextBox ID="txtFirstName" runat="server"></asp:TextBox>
                    <asp:Label ID="Label1" Text="Last Name:" runat="server"></asp:Label>
                    <asp:TextBox ID="txtLastName" runat="server"></asp:TextBox>
                    <telerik:RadButton ID="btnHostSearch" runat="server" OnClick="btnHostSearch_Click" Font-Underline="false" Text="Search for Host">
                        <Icon PrimaryIconCssClass="rbSearch" PrimaryIconLeft="4" PrimaryIconTop="4" />
                    </telerik:RadButton>
                    <telerik:RadButton ID="btnVictimSearch" runat="server" OnClick="btnVictimSearch_Click"  Font-Underline="false" Text="Search for Victim">
                        <Icon PrimaryIconCssClass="rbSearch" PrimaryIconLeft="4" PrimaryIconTop="4" />
                    </telerik:RadButton>
                </telerik:RadAjaxPanel>
     
                <br />
                <h5><%--Host Students--%></h5>
                <hr />
                <telerik:RadGrid ID="hostSearchGrid" runat="server" AllowFilteringByColumn="false" AllowPaging="false"
                    AllowSorting="false" GridLines="None" OnItemCommand="hostSearchGrid_Click_ItemCommand"  OnNeedDataSource="hostSearchGrid_NeedDataSource">
                    <MasterTableView AutoGenerateColumns="true" DataKeyNames="StudentID">
                        <Columns>
                            <telerik:GridTemplateColumn UniqueName="TemplateColumn1" HeaderText="Select">
                                <ItemStyle HorizontalAlign="Center" />
                                <ItemTemplate>
                                    <asp:ImageButton ID="ibtnAddToCart" CommandName="Compare" runat="server" Height=25px Width=25px ImageUrl="~/_Images/circle-up.png" AlternateText="Select" />
                                </ItemTemplate>
                            </telerik:GridTemplateColumn>
                        </Columns>
                    </MasterTableView>
                </telerik:RadGrid>
                <telerik:RadGrid ID="victimSearchGrid" runat="server" AllowFilteringByColumn="false" AllowPaging="false"
                    AllowSorting="false" GridLines="None" OnItemCommand="victimSearchGrid_Click_ItemCommand" OnNeedDataSource="victimSearchGrid_NeedDataSource">
                    <MasterTableView AutoGenerateColumns="true" DataKeyNames="StudentID">
                        <Columns>
                            <telerik:GridTemplateColumn UniqueName="TemplateColumn1" HeaderText="Select"
                                AllowFiltering="false">
                                <ItemStyle HorizontalAlign="Center" />
                                <ItemTemplate>
                                    <asp:ImageButton ID="ibtnAddToCart" runat="server" Height=25px Width=25px ImageUrl="~/_Images/circle-up.png"
                                    AlternateText="Select" CommandName="Compare"/>
                                </ItemTemplate>
                            </telerik:GridTemplateColumn>
                        </Columns>
                    </MasterTableView>
                </telerik:RadGrid>
                <br />
                <br />
                <h5><%--Host Students--%></h5>
                <hr />
                <telerik:RadTabStrip ID="RadTabStrip1" runat="server" Skin="Outlook" MultiPageID="RadMultiPage1"
                    SelectedIndex="0" CssClass="tabStrip">
                    <Tabs>
                        <telerik:RadTab Text="Student Information">
                        </telerik:RadTab>
                        <telerik:RadTab Text="School Information">
                        </telerik:RadTab>
                        <telerik:RadTab Text="Admission Information">
                        </telerik:RadTab>
                    </Tabs>
                </telerik:RadTabStrip>
                <telerik:RadMultiPage ID="RadMultiPage1" runat="server" SelectedIndex="0" CssClass="multiPage">
                    <telerik:RadPageView ID="RadPageView1" runat="server">
                        <telerik:RadGrid ID="hostStudentInfoGrid" runat="server" AllowFilteringByColumn="false" AllowPaging="false"
                            ShowFooter="true" AllowSorting="false" GridLines="None"
                            PageSize="5">
                            <MasterTableView AutoGenerateColumns="True" DataKeyNames="StudentName">
                                <NoRecordsTemplate>
                                    No Records Found.
                                </NoRecordsTemplate>
                                <Columns>
     
                                </Columns>
                            </MasterTableView>
                        </telerik:RadGrid>
                        <telerik:RadGrid ID="victimStudentInfoGrid" runat="server" AllowFilteringByColumn="false" AllowPaging="false"
                            ShowFooter="true" AllowSorting="false" GridLines="None"
                            PageSize="5">
                            <MasterTableView AutoGenerateColumns="True" DataKeyNames="StudentName">
                                <NoRecordsTemplate>
                                    No Records Found.
                                </NoRecordsTemplate>
                                <Columns>
     
                                </Columns>
                            </MasterTableView>
                        </telerik:RadGrid>
                    </telerik:RadPageView>
                    <telerik:RadPageView ID="RadPageView2" runat="server" CssClass="pageViewEducation">
                        <telerik:RadGrid ID="hostSchoolInfoGrid" runat="server" AllowFilteringByColumn="false" AllowPaging="false"
                            ShowFooter="true" AllowSorting="false" GridLines="None"
                            PageSize="5">
                            <MasterTableView AutoGenerateColumns="True" DataKeyNames="StudentName">
                                <NoRecordsTemplate>
                                    No Records Found.
                                </NoRecordsTemplate>
                                <Columns>
     
                                </Columns>
                            </MasterTableView>
                        </telerik:RadGrid>
                        <telerik:RadGrid ID="victimSchoolInfoGrid" runat="server" AllowFilteringByColumn="false" AllowPaging="false"
                            ShowFooter="true" AllowSorting="false" GridLines="None"
                            PageSize="5">
                            <MasterTableView AutoGenerateColumns="True" DataKeyNames="StudentName">
                                <NoRecordsTemplate>
                                    No Records Found.
                                </NoRecordsTemplate>
                                <Columns>
     
                                </Columns>
                            </MasterTableView>
                        </telerik:RadGrid>
                    </telerik:RadPageView>
                    <telerik:RadPageView ID="RadPageView3" runat="server">
                        <telerik:RadGrid ID="hostAdmissionInfoGrid" runat="server" AllowFilteringByColumn="false" AllowPaging="false"
                            ShowFooter="true" AllowSorting="false" GridLines="None"
                            PageSize="5">
                            <MasterTableView AutoGenerateColumns="True" DataKeyNames="StudentName">
                                <NoRecordsTemplate>
                                    No Records Found.
                                </NoRecordsTemplate>
                                <Columns>
     
                                </Columns>
                            </MasterTableView>
                        </telerik:RadGrid>
                        <telerik:RadGrid ID="victimAdmissionInfoGrid" runat="server" AllowFilteringByColumn="false" AllowPaging="false"
                            ShowFooter="true" AllowSorting="false" GridLines="None"
                            PageSize="5">
                            <MasterTableView AutoGenerateColumns="True" DataKeyNames="StudentName">
                                <NoRecordsTemplate>
                                    No Records Found.
                                </NoRecordsTemplate>
                                <Columns>
     
                                </Columns>
                            </MasterTableView>
                        </telerik:RadGrid>
                    </telerik:RadPageView>
                </telerik:RadMultiPage>

               'General Controls
            Protected txtFirstName, txtLastName As TextBox
            Protected RadAjaxManager1 As RadAjaxManager
            Protected WithEvents btnHostSearch, btnVictimSearch As RadButton
            Protected WithEvents Button1 As Button
            Protected WithEvents hostStudentInfoLoadingPanel, hostSchoolInfoLoadingPanel, hostAdmissionInfoLoadingPanel As RadAjaxLoadingPanel
            ' Host Grids
            Protected WithEvents hostSearchGrid, hostStudentInfoGrid, hostSchoolInfoGrid, hostAdmissionInfoGrid As RadGrid
     
            'Victim Grids
            Protected WithEvents victimSearchGrid, victimStudentInfoGrid, victimSchoolInfoGrid, victimAdmissionInfoGrid As RadGrid
     
            Public Property HostStudentsData() As DataTable
                Get
                    Dim obj As Object = Me.Session("HostStudentsData")
                    If obj IsNot Nothing Then
                        Return DirectCast(obj, DataTable)
                    End If
     
                    Dim _hostStudentData As New DataTable()
                    Dim studentMerge As New MCOECN.DASL.BusinessLogic.SIS.StudentMerge.Merge()
                    _hostStudentData = studentMerge.GetStudentInfo(txtLastName.Text + "%", txtFirstName.Text + "%", CurrentContext.WorkingSchool.DistrictId)
     
                    Me.Session("HostStudentsData") = _hostStudentData
     
                    Return _hostStudentData
                End Get
                Set(value As DataTable)
                    Me.Session("HostStudentsData") = value
                End Set
            End Property
     
            Public Property VictimStudentsData() As DataTable
                Get
                    Dim obj As Object = Me.Session("VictimStudentsData")
                    If obj IsNot Nothing Then
                        Return DirectCast(obj, DataTable)
                    End If
     
                    Dim _victimStudentData As New DataTable()
                    Dim studentMerge As New MCOECN.DASL.BusinessLogic.SIS.StudentMerge.Merge()
                    _victimStudentData = studentMerge.GetStudentInfo(txtLastName.Text + "%", txtFirstName.Text + "%", CurrentContext.WorkingSchool.DistrictId)
     
                    Me.Session("VictimStudentsData") = _victimStudentData
     
                    Return _victimStudentData
                End Get
                Set(value As DataTable)
                    Me.Session("VictimStudentsData") = value
                End Set
            End Property
     
            Protected Sub btnHostSearch_Click(sender As Object, e As EventArgs) Handles Button1.Click
     
                HostStudentsData = Nothing
                hostSearchGrid.Visible = True
                Dim dt As DataTable = HostStudentsData
                dt.AcceptChanges()
                hostSearchGrid.DataSource = dt
     
                hostSearchGrid.DataBind()
     
            End Sub
     
            Protected Sub btnVictimSearch_Click(sender As Object, e As EventArgs)
                VictimStudentsData = Nothing
                victimSearchGrid.Visible = True
                victimSearchGrid.DataSource = VictimStudentsData
                victimSearchGrid.DataBind()
     
            End Sub
     
            Protected Sub hostSearchGrid_NeedDataSource(ByVal source As Object, ByVal e As GridNeedDataSourceEventArgs)
                Dim HostSearchStudents As DataTable = HostStudentsData
                hostSearchGrid.DataSource = HostSearchStudents
     
            End Sub
     
            Protected Sub victimSearchGrid_NeedDataSource(ByVal source As Object, ByVal e As GridNeedDataSourceEventArgs)
                Dim VictimSearchStudents As DataTable = VictimStudentsData
                victimSearchGrid.DataSource = VictimSearchStudents
     
            End Sub
     
            Protected Sub hostSearchGrid_Click_ItemCommand(ByVal source As Object, ByVal e As GridCommandEventArgs)
                If e.CommandName = "Compare" Then
                    Dim itemValues As IDictionary = New Dictionary(Of Object, Object)()
                    hostSearchGrid.Rebind()
     
                    Dim item As GridDataItem = DirectCast(e.Item, Global.Telerik.Web.UI.GridDataItem)
                    itemValues("StudentID") = item.OwnerTableView.DataKeyValues(item.ItemIndex)("StudentID").ToString()
     
                    Dim studentMerge As New MCOECN.DASL.BusinessLogic.SIS.StudentMerge.Merge()
                    Dim studentId As Guid = New Guid(itemValues("StudentID").ToString)
                    Dim studentDS As DataSet = studentMerge.GetStudentInfoById(studentId, CurrentContext.WorkingSchool.DistrictId)
     
                    BindHostInformation(studentDS)
     
                End If
            End Sub
     
            Protected Sub victimSearchGrid_Click_ItemCommand(ByVal source As Object, ByVal e As GridCommandEventArgs)
                If e.CommandName = "Compare" Then
                    Dim itemValues As IDictionary = New Dictionary(Of Object, Object)()
                    victimSearchGrid.Rebind()
     
                    Dim item As GridDataItem = DirectCast(e.Item, Global.Telerik.Web.UI.GridDataItem)
                    itemValues("StudentID") = item.OwnerTableView.DataKeyValues(item.ItemIndex)("StudentID").ToString()
     
                    Dim studentMerge As New MCOECN.DASL.BusinessLogic.SIS.StudentMerge.Merge()
                    Dim studentId As Guid = New Guid(itemValues("StudentID").ToString)
                    Dim studentDS As DataSet = studentMerge.GetStudentInfoById(studentId, CurrentContext.WorkingSchool.DistrictId)
     
                    BindVictimInformation(studentDS)
     
                End If
            End Sub
     
            Private Sub BindHostInformation(ByVal hostStudentDS As DataSet)
     
                hostStudentInfoGrid.DataSource = hostStudentDS.Tables(0)
                hostSchoolInfoGrid.DataSource = hostStudentDS.Tables(1)
                hostAdmissionInfoGrid.DataSource = hostStudentDS.Tables(2)
     
                hostStudentInfoGrid.DataBind()
                hostSchoolInfoGrid.DataBind()
                hostAdmissionInfoGrid.DataBind()
            End Sub
     
            Private Sub BindVictimInformation(ByVal victimStudentDS As DataSet)
     
                victimStudentInfoGrid.DataSource = victimStudentDS.Tables(0)
                victimSchoolInfoGrid.DataSource = victimStudentDS.Tables(1)
                victimAdmissionInfoGrid.DataSource = victimStudentDS.Tables(2)
     
                victimStudentInfoGrid.DataBind()
                victimSchoolInfoGrid.DataBind()
                victimAdmissionInfoGrid.DataBind()
            End Sub
     
            Private Sub Page_Load1(sender As Object, e As System.EventArgs) Handles Me.Load
                If Not IsPostBack Then
                    txtFirstName.Text = "Cor"
                    txtLastName.Text = "A"
                End If
            End Sub
  2. Maria Ilieva
    Admin
    Maria Ilieva avatar
    4017 posts

    Posted 07 Mar 2012 Link to this post

    Hello Brian,

    I reviewed the provided code and noticed some basic issues with the ajax settings you are adding in your application:
    1. Please note that it is not supported to have RadAjaxPanel added in the RadAjaxManager settings or use the both controls for updating the same part of the page. Therefore I would suggest you to replace the RadAjaxPanel with regular asp Panel.
    2. Note that single PageView of control form PageView could not be added as AJAX initiator or updated control in the AJAX settings. The only possible approach is to add the whole MultiPage in the RadAjaxManager settings or wrap the whole control into RadAjaxPanel. When we set the MultiPage as an updated control, you should also include the TabStrip associated with it in the Ajax settings.
    Review the following help topic for more information on this matter:
    http://www.telerik.com/help/aspnet-ajax/ajax-tips-and-tricks.html


    Regards,
    Maria Ilieva
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top