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

Ajaxified multicolumn Combobox with checkbox fires a full refresh on checkbox click

2 Answers 106 Views

ComboBox

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

Ashwin Kumar asked on 08 Mar 2011, 08:43 PM

Hi,

I am currently using the Q3 2010 NET40 version of the ajax controls, and I am trying ot have a multi column combobox with checkboxes fire off an ajax request to refresh a grid on the same page. But no matter what I do, when I click on the checkbox, a full page refresh is fired, making it impossible for the user to click on multiple checkboxes. I already did everything that was recommended by the below support link - although am not sure if its still applicable to this version.

http://www.telerik.com/help/aspnet-ajax/troubleshooting-ajaxified-control-item-template-full-postback.html

I built a separate page with almost no code behind just to simulate the issue, with a datasource that brings data from my database. The code is as below

I am currently developing for one of your clients, and I can get the support details if need be. Please advise how I can ajaxify the checkbox, multi column combobox. Your early response would be highly appreciated.

Thank you.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ManageData.aspx.cs" Inherits="MasterDataManagementSystem.ManageData" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

<style type="text/css">

.rcbHeader ul,

.rcbFooter ul,

.rcbItem ul, .rcbHovered ul, .rcbDisabled ul

{

width: 100%;

display: inline-block;

margin: 1;

padding: 0;

list-style-type: none;

font-family : Verdana;

font-size:8pt;

}

.rcbColumn

{

font-family:Verdana;

font-size:8pt;

float: left;

margin: 1;

line-height: 14px;

padding: 2px 5px 2px 0;

}

.rcbColumn li

{

vertical-align:middle;

}

</style>

</head>

<body>

<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">

<script type="text/javascript">

<!--

function stopPropogation(e) {

e.cancelBubble = true;

if (e.stopPropagation) {

e.stopPropagation();

}

function callAttachDropDown() {

var combo = $find("<%= rcbSourceElement.ClientID %>");

combo.attachDropDown();

}

-->

</script>

</telerik:RadScriptBlock>

<form id="form1" runat="server">

<div>

<asp:ScriptManager ID="ScriptManager1" runat="server">

</asp:ScriptManager>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadComboBox1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadGrid1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" Runat="server"

Skin="Default">

</telerik:RadAjaxLoadingPanel>

<telerik:RadComboBox ID="rcbSourceElement" runat="server"

HighlightTemplatedItems="True" DataTextField="PrimaryFieldValue" AutoPostBack="true"

Width="400px" Height="200px" DataValueField="ELEMENT_VALUE_KEY" DataSourceID="odsSourceElement"

AllowCustomText="True" EmptyMessage="Choose an option here...">

<ItemTemplate>

<div onclick="stopPropagation(event)">

<asp:CheckBox ID="chkSourceElementValue" runat="server" AutoPostBack="true" onclick="callAttachDropDown()" Text='<%# Eval("PrimaryFieldValue") %>'

oncheckedchanged="chkSourceElementValue_CheckedChanged"/>

</div>

</ItemTemplate>

</telerik:RadComboBox>

<asp:ObjectDataSource ID="odsSourceElement" runat="server"

SelectMethod="GetSourceElementValuesForDisplayInSubjectTab"

TypeName="MasterDataMgmt.BL.Helper">

<SelectParameters>

<asp:Parameter Name="TargetSubjectKey" DefaultValue="1" Type="Int32" />

</SelectParameters>

</asp:ObjectDataSource>

<telerik:RadGrid ID="RadGrid1" runat="server">

</telerik:RadGrid>

</div>

</form>

</body>

</html>

Thank you.

2 Answers, 1 is accepted

answered on 16 Mar 2011, 04:58 PM

example.zip

Hello Ashwin,

I've already replied to your support ticket, but I'm also attaching here a sample page with the desired functionality implemented.

All the best,
Dimitar Terziev
the Telerik team

Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

Ajaxified multicolumn Combobox with checkbox fires a full refresh on checkbox click

2 Answers, 1 is accepted