This is a migrated thread and some comments may be shown as answers.

ComboBox breaks RadButon OnClick

8 Answers 88 Views
ComboBox
This is a migrated thread and some comments may be shown as answers.
Dan Lehmann
Top achievements
Rank 1
Dan Lehmann asked on 22 Jun 2011, 08:17 PM
Hello, I'm having the common "postback eats a buttonclick event" problem as discussed here and here.
I have a RadButton:
<rad:RadButton ID="btnApplyFilters" runat="server"
Text="Apply Filters" UseSubmitBehavior="false" />

Conflicting with a RadComboBox:
<rad:RadComboBox runat="server"
 ID="rcbSearchLastName"
 EnableLoadOnDemand="true"
 OnItemsRequested="rcbSearchLastName_ItemsRequested"
 AutoPostBack="true"
 ShowWhileLoading="false"
 ShowToggleImage="false" />


When I type in the textbox I am getting suggest style choices in the dropdown. If I select from the dropdown choices the rcbSearchLastName.SelectedIndexChanged event fires in the code behind. While I am typing the rcbSearchLastName_ItemsRequested event is fired.

If I type in the TextBox portion of the RadCombBox, then click a RadButton, the button click event is not fired.

Is it possible to use the components differently so that this conflict doesn't occur? Or is there a way to queue the events with the AjaxManager?

Thanks,
Dan

8 Answers, 1 is accepted

Sort by
0
Dimitar Terziev
Telerik team
answered on 25 Jun 2011, 04:44 PM
Hello Dan,

Could you clarify which version of the controls you are using.

I've made a sample project trying to reproduce the problem you are experiencing, but to no avail. The click event of the RadButton is fired correctly on my side.

Please try to provide more information about your particular implementation and specify whether you are using ajax or not.

All the best,
Dimitar Terziev
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

0
Dan Lehmann
Top achievements
Rank 1
answered on 27 Jun 2011, 03:48 PM
I am using version 2011-1.519.40.

I made a sample project to demonstrate the problem I'm having. In this project, you'll notice I am trying to implement filters. Since I wanted paging of my data I could not use the built in RadFilters plus I have my data layer isolated so I cannot wire up the controls the way most of the examples are, with simple sql statements.

To reproduce the problem I'm having, type in either box and press the Apply Filters btn. My problem is I have to press the btn 2 times.

Here's my aspx:
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default2.aspx.vb" Inherits="Default2" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="rad" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<head runat="server">
    <title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
    <rad:RadScriptManager ID="RadScriptManager1" runat="server" />
    <rad:RadWindowManager ID="RadWindowManager1" runat="server" EnableShadow="true" />
    <rad:RadAjaxManager ID="RadAjaxManager1" runat="server">
        <AjaxSettings>
            <rad:AjaxSetting AjaxControlID="RadAjaxManager1">
                <UpdatedControls>
                    <rad:AjaxUpdatedControl ControlID="RadAjaxPanel1" />
                    <rad:AjaxUpdatedControl ControlID="rgCustomers" />
                </UpdatedControls>
            </rad:AjaxSetting>
            <rad:AjaxSetting AjaxControlID="RadAjaxPanel1">
                <UpdatedControls>
                    <rad:AjaxUpdatedControl ControlID="rgCustomers" />
                </UpdatedControls>
            </rad:AjaxSetting>
            <rad:AjaxSetting AjaxControlID="btnApplyFilters">
                <UpdatedControls>
                    <rad:AjaxUpdatedControl ControlID="rgCustomers" />
                </UpdatedControls>
            </rad:AjaxSetting>
            <rad:AjaxSetting AjaxControlID="btnClearFilters">
                <UpdatedControls>
                    <rad:AjaxUpdatedControl ControlID="rgCustomers" />
                </UpdatedControls>
            </rad:AjaxSetting>
        </AjaxSettings>
    </rad:RadAjaxManager>
 
    <h2>NW Customers</h2>
    <rad:RadAjaxPanel runat="server" ID="RadAjaxPanel1">
        <div style="width:100%;text-align:right;margin-bottom:2px;float:none;">
            <rad:RadButton ID="btnApplyFilters" runat="server" Text="Apply Filters" Skin="Outlook" Width="90px" UseSubmitBehavior="false" />
            <rad:RadButton ID="btnClearFilters" runat="server" Text="Clear Filters" Skin="Outlook" Width="90px" UseSubmitBehavior="false" />
        </div>
        <rad:RadComboBox runat="server" ID="rcbSearchCompanyName" Width="150px" ShowToggleImage="false" EnableLoadOnDemand="true" OnItemsRequested="rcbSearchCompanyName_ItemsRequested" AutoPostBack="true" LoadingMessage="" CollapseDelay="0" CollapseAnimation-Type="None" ExpandAnimation-Type="None" ShowWhileLoading="false" />
        <rad:RadComboBox runat="server" ID="rcbSearchContactName" Width="150px" ShowToggleImage="false" EnableLoadOnDemand="true" OnItemsRequested="rcbSearchContactName_ItemsRequested" AutoPostBack="true" LoadingMessage="" CollapseDelay="0" CollapseAnimation-Type="None" ExpandAnimation-Type="None" ShowWhileLoading="false" />
    </rad:RadAjaxPanel>
 
    <rad:RadGrid ID="rgCustomers" runat="server" Skin="Vista" AllowSorting="false" AllowFilteringByColumn="false" AllowPaging="false" AllowCustomPaging="false" Width="100%" AutoGenerateColumns="false" ShowFooter="false" ShowHeader="true" >
        <ClientSettings EnablePostBackOnRowClick="true">
            <Selecting AllowRowSelect="True"  />
        </ClientSettings>
        <MasterTableView Width="100%" TableLayout="Fixed" GridLines="Both" >
            <Columns>
                <rad:GridBoundColumn UniqueName="CustomerID" DataField="CustomerID" ReadOnly="true" Visible="false" />
                <rad:GridBoundColumn HeaderText = "Company Name" DataField="CompanyName" ItemStyle-Width="100%" HeaderStyle-Width="110px" />
                <rad:GridBoundColumn HeaderText = "Contact Name" DataField="ContactName" ItemStyle-Width="100%"  HeaderStyle-Width="100px" />
                <rad:GridBoundColumn HeaderText = "Postal Code" DataField="PostalCode" ItemStyle-Width="100%" HeaderStyle-Width="85px" />
                <rad:GridBoundColumn HeaderText = "Phone" DataField="Phone" ItemStyle-Width="100%" HeaderStyle-Width="50px" />
            </Columns>
        </MasterTableView>
    </rad:RadGrid>
</div>
</form>
</body>
</html>

And my codebehind:
Imports System.Data
Imports System.Data.SqlClient
Imports Telerik.Web.UI
 
Partial Class Default2
    Inherits System.Web.UI.Page
 
    Public Shared Function GetData_DataTable(query As String, Optional param1 As String = Nothing, Optional param2 As String = Nothing) As DataTable
        Dim information As New DataTable()
        Dim conn As New SqlConnection(ConfigurationManager.ConnectionStrings("NorthwindConnectionString").ConnectionString)
        Try
            conn.Open()
            Dim adapter As New SqlDataAdapter()
 
            Try
                adapter.SelectCommand = New SqlCommand(query, conn)
                If param1 IsNot Nothing Then
                    adapter.SelectCommand.Parameters.AddWithValue("@param1", param1)
                End If
                If param2 IsNot Nothing Then
                    adapter.SelectCommand.Parameters.AddWithValue("@param2", param2)
                End If
                adapter.Fill(information)
            Finally
                If Not [Object].Equals(adapter.SelectCommand, Nothing) Then
                    adapter.SelectCommand.Dispose()
                End If
            End Try
        Finally
            If conn.State = ConnectionState.Open Then
                conn.Close()
            End If
        End Try
 
        Return information
    End Function
    Public Function GetData_ddlCompanyName() As DataTable
        Return GetData_DataTable("SELECT CompanyName FROM [Customers] WHERE CompanyName LIKE '%' + @param1 + '%' AND ContactName LIKE '%' + @param2  + '%'", Session("CompanyName"), Session("ContactName"))
    End Function
    Public Function GetData_ddlContactName() As DataTable
        Return GetData_DataTable("SELECT ContactName FROM [Customers] WHERE CompanyName LIKE '%' + @param1 + '%' AND ContactName LIKE '%' + @param2  + '%'", Session("CompanyName"), Session("ContactName"))
    End Function
    Public Function GetData_grid() As DataTable
        Return GetData_DataTable("Select CustomerID, CompanyName, ContactName, PostalCode, Phone FROM [Customers] WHERE CompanyName LIKE '%' + @param1 + '%' AND ContactName LIKE '%' + @param2  + '%'", Session("CompanyName"), Session("ContactName"))
    End Function
    Protected Sub Page_Load(sender As Object, e As System.EventArgs) Handles Me.Load
        If Not IsPostBack Then
            Session("CompanyName") = ""
            Session("ContactName") = ""
        End If
    End Sub
    Protected Sub rgCustomers_NeedDataSource(sender As Object, e As Telerik.Web.UI.GridNeedDataSourceEventArgs) Handles rgCustomers.NeedDataSource
        rgCustomers.DataSource = GetData_grid()
    End Sub
    Protected Sub rcbSearchCompanyName_ItemsRequested(sender As Object, e As Telerik.Web.UI.RadComboBoxItemsRequestedEventArgs) Handles rcbSearchCompanyName.ItemsRequested
        Session("CompanyName") = Trim(e.Text)
        Dim Customers As DataTable = GetData_ddlCompanyName()
        For i As Int32 = 0 To Customers.Rows.Count - 1
            Dim objDR As DataRow = Customers.Rows(i)
            rcbSearchCompanyName.Items.Add(New RadComboBoxItem(objDR.Item("CompanyName"), objDR.Item("CompanyName")))
        Next
    End Sub
    Protected Sub rcbSearchContactName_ItemsRequested(sender As Object, e As Telerik.Web.UI.RadComboBoxItemsRequestedEventArgs) Handles rcbSearchContactName.ItemsRequested
        Session("ContactName") = Trim(e.Text)
        Dim Customers As DataTable = GetData_ddlContactName()
        For i As Int32 = 0 To Customers.Rows.Count - 1
            Dim objDR As DataRow = Customers.Rows(i)
            rcbSearchContactName.Items.Add(New RadComboBoxItem(objDR.Item("ContactName"), objDR.Item("ContactName")))
        Next
    End Sub
    Protected Sub rcbSearchCompanyName_SelectedIndexChanged(sender As Object, e As Telerik.Web.UI.RadComboBoxSelectedIndexChangedEventArgs) Handles rcbSearchCompanyName.SelectedIndexChanged
        Session("CompanyName") = Trim(e.Text)
    End Sub
    Protected Sub rcbSearchContactName_SelectedIndexChanged(sender As Object, e As Telerik.Web.UI.RadComboBoxSelectedIndexChangedEventArgs) Handles rcbSearchContactName.SelectedIndexChanged
        Session("ContactName") = Trim(e.Text)
    End Sub
 
    Private Sub btnClearFilters_Click(sender As Object, e As System.EventArgs) Handles btnClearFilters.Click
        Session("CustomerFilterApplied") = False
        rcbSearchCompanyName.Text = ""
        rcbSearchContactName.Text = ""
        Session("CompanyName") = ""
        Session("ContactName") = ""
        rgCustomers.Rebind()
        rgCustomers.MasterTableView.Rebind()
    End Sub
    Private Sub btnApplyFilters_Click(sender As Object, e As System.EventArgs) Handles btnApplyFilters.Click
         
        rgCustomers.MasterTableView.Rebind()
        btnApplyFilters.Text = "Apply Filters"
    End Sub
End Class

Are you able to reproduce the issue?
0
Veronica
Telerik team
answered on 30 Jun 2011, 11:55 AM
Hi Dan,

Dimitar will be of until the end of the week so I'll take this issue.

Could you please attach your full code as well as the database in a .zip file and send it to us via one of the sites for free online storage as 4shared.com. That way we can inspect it and help you.

Thank you!

Regards,
Veronica Milcheva
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

0
Dan Lehmann
Top achievements
Rank 1
answered on 30 Jun 2011, 02:51 PM
Here is the project
To reproduce the problem,
1 .Open Default2.aspx
2. Type "al" in the first textbox
3. Click the Apply Filters btn
4. Click Apply Filters again

I think the filtering onClick in step 3 is blocked by the call to rgCustomers.NeedDataSource after the textbox onblur but before the click event. If you wait for the NeedDataSource to finish before clicking the button in step 3 the button works no problems.. I'm trying to think of some way to maybe delay the onblur and call it async or maybe putting the button click into an async call.

Thanks,
Dan
0
Veronica
Telerik team
answered on 07 Jul 2011, 02:31 PM
Hello Dan Lehmann,

Thank you for the attached project.

Please note that we are in the process of working for the upcomming Release. I'll contact as soon as possible.

Thank you for your patience.

All the best,
Veronica Milcheva
the Telerik team

Register for the Q2 2011 What's New Webinar Week. Mark your calendar for the week starting July 18th and book your seat for a walk through of all the exciting stuff we will ship with the new release!

0
Dan Lehmann
Top achievements
Rank 1
answered on 16 Aug 2011, 03:32 PM
Hi,
I'm still having this issue with 2011.2.712.40.

Do I have the most recent release?  Does this issue occur on your end?

Thanks,
Dan
0
Accepted
Kalina
Telerik team
answered on 22 Aug 2011, 01:01 PM
Hello Dan Lehmann,

We have downloaded your code and reproduced the issue.
I am suggesting you change the Ajax Settings on your page in this manner:
<rad:RadAjaxManager ID="RadAjaxManager1" runat="server">
    <AjaxSettings>
        <%--    <rad:AjaxSetting AjaxControlID="RadAjaxManager1">
            <UpdatedControls>
                <rad:AjaxUpdatedControl ControlID="RadAjaxPanel1" />
                <rad:AjaxUpdatedControl ControlID="rgCustomers" />
            </UpdatedControls>
        </rad:AjaxSetting>
        <rad:AjaxSetting AjaxControlID="RadAjaxPanel1">
            <UpdatedControls>
                <rad:AjaxUpdatedControl ControlID="rgCustomers" />
            </UpdatedControls>
        </rad:AjaxSetting>--%>
        <rad:AjaxSetting AjaxControlID="btnApplyFilters">
            <UpdatedControls>
                <rad:AjaxUpdatedControl ControlID="rgCustomers" />
            </UpdatedControls>
        </rad:AjaxSetting>
        <rad:AjaxSetting AjaxControlID="btnClearFilters">
            <UpdatedControls>
                <rad:AjaxUpdatedControl ControlID="rgCustomers" />
            </UpdatedControls>
        </rad:AjaxSetting>
      <rad:AjaxSetting AjaxControlID="rcbSearchCompanyName">
          <UpdatedControls>
              <rad:AjaxUpdatedControl ControlID="rgCustomers" />
              <rad:AjaxUpdatedControl ControlID="rcbSearchCompanyName" />
          </UpdatedControls>
      </rad:AjaxSetting>
    </AjaxSettings>
</rad:RadAjaxManager>


Kind regards,
Kalina
the Telerik team

Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

0
Dan Lehmann
Top achievements
Rank 1
answered on 23 Aug 2011, 02:58 PM
Thanks! That worked perfect!
Tags
ComboBox
Asked by
Dan Lehmann
Top achievements
Rank 1
Answers by
Dimitar Terziev
Telerik team
Dan Lehmann
Top achievements
Rank 1
Veronica
Telerik team
Kalina
Telerik team
Share this question
or