Button in RadComboBox itemtemplate

[Ratzai]

I've been searching around the examples and the threads in this forum to find a solution to my problem, so now i'll try to start a new thread and hopefully get a workaround/solution.

I have a RadComboBox that is bound in the itemrequsted event. The combobox has an itemtemplate with a serverside ASP button control. What i want to do is, when a user clicks the button, the item gets deleted. Here is the code for the combobox

 <telerik:RadCombobox
                            ID="ReportCombobox"
                            HighlightTemplatedItems="True"
                            DataTextField="Title"
                            EnableLoadOnDemand="True"
                            Text="Vælg eksisterende rapport"
                            LoadingMessage="Henter rapporter"
                            DataValueField="ReportGUID"
                            Width="180px"
                            runat="server"
                            AutoPostBack="True" SkinsPath="~/RadControls/ComboBox/Skins">
                            <HeaderTemplate>
                                <table width="400" cellpadding="0" cellspacing="0" border="0">
                                    <tr>
                                        <td style="width:230;" class="ReportDropDownTitleHead">Rapport titel</td>
                                        <td style="width:140;" class="ReportDropDownDateHead">Oprettet</td>
                                        <td style="width:80;" class="ReportDropDownUsernameHead">Oprettet af</td>
                                        <td style="width:80;" class="ReportDropDownUsernameHead">Org ID</td>
                                        <td style="width:80;" class="ReportDropDownUsernameHead">Slet rapport</td>
                                    </tr>
                                </table>
                            </HeaderTemplate>
                            <ItemTemplate>

                                <table width="350" cellpadding="0" cellspacing="0" border="0">
                                    <tr>
                                        <td style="width:230;" class="ReportDropDownTitleColumn">
                                            <%# DataBinder.Eval(Container.DataItem, "Title") %>
                                         </td>
                                        <td style="width:140;" class="ReportDropDownDateColumn">
                                            <%# DataBinder.Eval(Container.DataItem, "Date") %>
                                         </td>
                                        <td style="width:80;" class="ReportDropDownUsernameColumn">
                                            <%# DataBinder.Eval(Container.DataItem, "Username") %>
                                         </td>
                                         <td style="width:80;" class="ReportDropDownUsernameColumn">
                                            <%# DataBinder.Eval(Container.DataItem, "MunicipalityIdentifier")%>
                                         </td>
                                         <td>
                                         <div onclick="StopPropagation(this)" >
                                         <asp:Button  runat="server" ID="btnDelete" Visible='<%# showDeleteButton(DataBinder.Eval(Container.DataItem, "CVR").ToString())%>'  OnClientClick="OnClientSelectedIndexChanging()"  Text="X" ToolTip="Slet Rapport" />
                                        </div>
                                        </td>
                                    </tr>
                                </table>

                            </ItemTemplate>
                        </telerik:RadCombobox>

The  Javascripts

<script type="text/javascript">

    var combobox = null;
    function pageLoad()
     {
         combobox = $find("<%= ReportCombobox.ClientID %>");
         alert(combobox.get_value());
    }
    function StopPropagation(e) {
        //cancel bubbling
       alert("stoppropapagtion");
        e.cancelBubble = true;
        if (e.stopPropagation) {
            e.stopPropagation();
        }
    }

    function OnClientSelectedIndexChanging()
    {
        var isConfirm = true;
        isConfirm = confirm("Vil du slette rapporten?");
        if (isConfirm) {
            var combo = $find("<%= ReportCombobox.ClientID %>");
            var hiddenGUID = combo.get_value();
            document.getElementById("<%=hiddenbox.ClientID%>").value = hiddenGUID; // "hest"; //item.get_value();
            alert(hiddenGUID);
        }
        return false;

    }


        </script>

I have two problems now:

1. When i click on the deletebutton first time, the value of the combobox is empty, second time the value is set correct and the item gets deleted. Same thing happends for the next item i try to delete, first time hiddenGUI has the value of the previous item and second time the value is correct.

2. The StopPropagation function is fired correctly as i see the alertbox, but the item is still loaded even though it should only fire the event of the button, and not the item iteself.

I've tried with ASP.NET AJAX 2008 version 1.5.27 and the latest release from november 2009, theres no change. 

I also tried to add a pageLoad javascript function to see if the combo has any value after all controls are loaded, but its also empty. 

[Ratzai]

Still no one who has an answer or some help ??

[Yana]

Hello Ratzai,

Please find attached a simple page based on your code demonstrating the needed approach.

Kind regards,
Yana
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.