Extending the Accoridon Control to support paging

Has anyone every attempted to add paging to the databinding in the accoridon control. It would be very useful to get some of the functionality of the gridview control (sorting and paging). I haven't built an extender control yet, so I fear I am in over my head. Paging workaround suggestions would be appreciated as well.

Thank you,

Tom Bull

Hello Tom,

maybe you've already found a solution for your problem.

I was faced with the same problem some days ago. I've found a solution that works for me.

I described itin my blog. I hope that solution works for you too, if a solution for that is still needed.

Regards

Rolf

Extending Server Controls?

I see this blurb on the tutorials section:

"Extend server controls or control extenders: You might create new behaviors for given server controls by implementing a server control that also implements the IScriptControl to render the ASP.NET "Atlas" client script and register with the ScriptManager in the Web page. Page developers will gain from specific new server-side controls without needing to write ASP.NET "Atlas" script or JavaScript."

This is great to hear, anyone know how this works? ie. I see it says I don't need to write script at all?

Let's say I wanted a input mask textbox - how would I 'extend' the TextBox using IScriptControl and do this code without writing script?

Hi,

check alsothis article from my blog for an introduction to extenders.

Extending collapsible panel

Hi!

I'm kind of new at the use of the control toolkit, and I'm running into some problems. I would like to get a postback event when a user clicks on the header panel of a collapsible panel. I could use a link, but the ui calls for a user to be able to click on any part of the panel in order to make it collapse and expand. This works correctly, but there are other issues to consider:
- If you have drop down menus within the collapsible panel, they will remain visible when the panel collapses, floating strangely on the page. This is a bug in IE, due to the fact that the drop down gets rendered last. I would like to be able to make the drop down control invisible when the enclosing panel is collapsed.
- Since the collapse/expand action doesn't produce a postback, there is no way of dynamically populating the enclosed controls. Instead you have to have some other control that does produce a postback do the work for you. I would prefer that the div.onClick() prompt the postback.

Lastly one unrelated question:
I'm trying to make my own extenders, and put them into a different namespace than the examples. I'm having a hard time getting the javascript to run though. I believe the problem is related to the ClientScriptResource in the extender.cs file.
here's what the line looks like in the toolkit's CollapsiblePanelExtender:

[ClientScriptResource("atlascontroltoolkit", "collapsiblePanelBehavior", typeof(AtlasControlToolkit.CollapsiblePanelExtender), "CollapsiblePanel.CollapsiblePanelBehavior.js")]

here's what it looks like in mine:

[ClientScriptResource("atlascontrols", "collapsiblePanelBehavior", typeof(Netik.Web.AtlasControls.CollapsiblePanelExtender), "CollapsiblePanel.CollapsiblePanelBehavior.js")]

notice the difference? I have a different namespace "Netik.Web.AtlasControls" and for some reason it doesn't like it. Also, the last parameter, "CollapsiblePanel.CollapsiblePanelBehavior.js", why is it specified with the CollapsiblePanel prefix if the file name is CollapsiblePanelBehavior.js? would this have anything to do with my problem?

Thanks for any help!
Mordecai Zibkoff

The 60504 release of the Toolkit has a tweak to make even floating menus disappear if the collapse height goes all the way to 0.

There should be other posts in this forum with details on how to do a manual postback.

Shawn's the expert on ClientScriptResource, but I believe the last parameter reflects the directory hierarchy of the file. Note that the CollapsiblePanelBehavior.js file lives in the CollapsiblePanel directory of the AtlasControlToolkit project directory. I'm guessing your file lives elsewhere.

Hope this helps!

Right, the extra "CollapsiblePanel" at the beginning of the resource name is an artifact of the way VS does it's embedded resource naming. In the main toolkit project, all the components are in sub-directories, so their resources get named accordingly. You probably don't want/need that.

If your DropDowns are within the collapsible panel and you' are allowing to to size all the way to zero, we set display:none onto the parent. That should hide them. If you need a header, create one panel with two sections: the header, and the part that you want to collapse, and point the extender at the latter.

On the PostBack, generally you don't want client components doing postbacks. If you want a notification when this happens, the CollapsiblePanelBehavior does surface an "expandComplete" and a "collapseComplete" event.

So you would do something like this:

<atlasToolkit:CollapsiblePanelProperties ID="cpb" TargetControlID="Panel1" ... />

<script>

function onExpandComplete() {

// do a postback or web-service call...
}

function hookPanelCollapse() {

var collapseBehavior = $object("cpb");

collapseBehavior.expandComplete.add(Function.createDelegate(null, onExpandComplete));
}

</script>

Hope that helps.

My dropdown seems to still be visible. I suspect that its because its insude of an embedded table within the panel. Thatnks for the tip to hook into postback after the animation, I'll give that a try. another odd thing, in the may 4th release the targetted panel no longer renders correctly. For some reason the border thickness doubles up and the panel's size is made narrower. my code is as follows:

<%@. Page Language="C#" MasterPageFile="~/NetikClassic.master" AutoEventWireup="true" CodeFile="IssuerDetail.aspx.cs" Inherits="Issuer_Maintenance_IssuerDetail" Title="Add/Edit Issuer" %>
<%@. Register Assembly="AtlasControlToolkit" Namespace="AtlasControlToolkit" TagPrefix="atlasToolkit" %>
<asp:Content ID="Content1" ContentPlaceHolderID="mainCopy" Runat="Server">
<atlas:ScriptManager id="MasterScriptManager" EnableScriptGlobalization="false" runat="Server"/>

<table border="0" cellpadding="2" cellspacing="0">
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td class="dialog_title"><asp:label runat="Server" ID="TitleLabel">Add/Edit Issuer</asp:label></td>
<td align="right">
<a href="http://links.10026.com/?link=javascript:history.go(-1)"><img border="0" src="http://pics.10026.com/?src=../Images/btn_backS.gif" alt="Back" width="18" height="15"/></a>
<a href="http://links.10026.com/?link=../help/help.htm"><img border="0" alt="Help" src="http://pics.10026.com/?src=../Images/btn_help.gif" width="18" height="15"/></a>
<a href="http://links.10026.com/?link=/"><img border="0" src="http://pics.10026.com/?src=../images/btn_close.gif" alt="Close" width="18" height="15"/></a>
</td>
</tr>
<tr>
<td> </td>
<td colspan="3">
<table cellpadding="2" cellspacing="3" style="background-color: rgb(239,231,207)" width="100%">
<tr>
<td colspan="3"/>
</tr>
<tr>
<td> </td>
<td>
<table cellpadding="0" cellspacing="0">
<tr>
<td>
Issuer Id:
</td>
<td>
<asp:TextBox
runat="server"
ID="IssuerIdTextbox"
visible="false"
MaxLength="16"
Width="175"
/>
<asp:Label
runat="server"
ID="IssuerIdLabel"
Visible="false"
/>
</td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="10" /></td></tr>
<tr>
<td>
Issuer Name:
</td>
<td>
<asp:TextBox
runat="server"
ID="IssuerNameTextBox"
MaxLength="40"
Width="175"
/>
</td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="10" /></td></tr>
<tr>
<td>
Issuer Type:
</td>
<td>
<asp:DropDownList
runat="server"
ID="IssuerTypeDropDown"
Width="160"
/>
</td>
<td>
Legal Form:
</td>
<td>
<asp:DropDownList
runat="server"
ID="LegalFormDropDown"
Width="160"
/>
</td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="10" /></td></tr>
<tr>
<td>
Primary Country:
</td>
<td>
<asp:DropDownList
runat="server"
ID="CountryDropDown"
Width="160"
/>
</td>
<td>
State of Incorp:
</td>
<td>
<asp:DropDownList
runat="server"
ID="StateOfIncorpDropDown"
Width="160"
/>
</td>
</tr>
<tr>
<td>Yr of Incorp/Reg: </td>
<td>
<table cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="left">
<asp:TextBox runat="server" ID="YrofIncorpTextBox" MaxLength="4" Width="50"/>
</td>
<td align="right">Fiscal Yr End Month: </td>
</tr>
</table>
</td>
<td>
<asp:DropDownList runat="server" ID="DropDownList1" Width="65"/>
</td>
<td style="white-space:nowrap">
<asp:RadioButtonList runat="server"
ID="CorpTypeRadioButtonList"
RepeatDirection="Horizontal"
BorderWidth="0"
CellPadding="0"
CellSpacing="0"
>
<asp:ListItem Selected="True" Text="Public" Value="PUBLIC"/>
<asp:ListItem Selected="False" Text="Private" Value="PRIVATE"/>
</asp:RadioButtonList>

</td>
</tr>
<tr>
<td>
Web Site:
</td>
<td>
<asp:TextBox
runat="server"
ID="WebSiteTextBox"
MaxLength="255"
Width="175"
/>
</td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="10" /></td></tr>
<tr>
<td>
Status:
</td>
<td>
<asp:DropDownList
runat="server"
ID="StatusDropDown"
Width="180"
/>
</td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="10" /></td></tr>
<tr>
<td colspan="2">
<asp:ImageButton runat="server" ID="SaveButton" ImageUrl="../Images/btn_savedlg.gif" />
<asp:ImageButton runat="server" ID="CancelButton" ImageUrl="../Images/btn_cancel.gif" />
</td>
<td colspan="2" align="right">
<asp:LinkButton runat="server" ID="ExpandPanelsButton">Expand all settings</asp:LinkButton>
<asp:LinkButton runat="server" ID="CollapsePanelsButton">Collapse all settings</asp:LinkButton>
</td>
</tr>
</table>
</td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>
<asp:Panel runat="server"
ID="IssuerIssuerRelationshipHeaderPanel"
BorderWidth="1px"
BorderStyle="solid"
BorderColor="gray"
style="padding:5px"
><b>ISSUER TO ISSUER RELATIONSHIPS</b></asp:Panel>
<asp:Panel runat="server"
ID="IssuerIssuerRelationshipPanel"
CssClass="editContent"
BackColor="#ddd5bd"
BorderWidth="1px"
BorderStyle="solid"
BorderColor="gray"
>
<table cellpadding="0" cellspacing="0" width="100%">
<tr>
<td> </td>
<td>
<table cellpadding="0" cellspacing="0">
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="5" /></td></tr>
<tr>
<td style="white-space:nowrap">Immediate Parent Issuer ID: </td>
<td style="white-space:nowrap">
<asp:textbox ID="ImmediateParentIssuerIDTextBox" runat="server" MaxLength="16" />
<asp:ImageButton runat="server" id="ImmediateParentIssuerSearchButton" ImageUrl="../images/btn_lookupoff.gif" />
(leave blank, if at top of hierarchy)
</td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="10" /></td></tr>
<tr>
<td>Ultimate Parent Issuer ID: </td>
<td>
<asp:textbox ID="UltimateParentIssuerIDTextbox" runat="server" MaxLength="16" />
<asp:ImageButton runat="server" id="UltimateParentIssuerSearchButton" ImageUrl="../images/btn_lookupoff.gif" />
(leave blank, if at top of hierarchy)
</td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="10" /></td></tr>
<tr>
<td>Role in Parent Hierarchy: </td>
<td>
<asp:DropDownList runat="server" ID="ParentHierarcyRoleDropDown" Width="180">
</asp:DropDownList>
</td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="10" /></td></tr>
<tr>
<td colspan="2"><asp:LinkButton runat="server" ID="AddNewIssuerRelationship">Add another Issuer relationship</asp:LinkButton></td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="10" /></td></tr>
</table>
</td>
<td> </td>
</tr>
</table>
</asp:Panel>
<asp:Panel runat="server"
ID="IssuerPartyRelationshipHeaderPanel"
BorderWidth="1px"
BorderStyle="solid"
BorderColor="gray"
style="padding:5px"
><b>ISSUER TO PARTY RELATIONSHIPS</b></asp:Panel>
<asp:Panel runat="server"
ID="IssuerPartyRelationshipPanel"
CssClass="editContent"
BackColor="#ddd5bd"
BorderWidth="1px"
BorderStyle="solid"
BorderColor="gray"
>
<div style="padding:5px">
<asp:LinkButton runat="server" ID="AddPartyRelationshipLink">Add another party relationship</asp:LinkButton>
</div>
<asp:Panel runat="server" ID="AddPartyRelationshipPanel">
<div style="padding:5px">
<div style="padding:5px;border-width:1px;border-style:solid;">
<table cellpadding="0" cellspacing="0">
<tr>
<td colspan="2"><b>Add this Relationship:</b></td>
</tr>
<tr>
<td>Related Party: </td>
<td>
<asp:TextBox runat="server" ID="RelatedPartyNameTextBox" Width="180" MaxLength="60"/>
<asp:ImageButton runat="server" id="RelatedPartyNameSearchButton" ImageUrl="../images/btn_lookupoff.gif" />
</td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="10" /></td></tr>
<tr>
<td>Relationship: </td>
<td style="white-space:nowrap">
<asp:DropDownList runat="server" ID="PartyRelationshipTypeDropDown" Width="182"/>
Start Date: <asp:TextBox runat="server" ID="PartyRelationshipStartDateTextBox" MaxLength="12" Width="40"/>
End Date: <asp:TextBox runat="server" ID="PartyRelationshipEndDateTextBox" MaxLength="12" Width="40"/>
</td>
</tr>
<tr>
<td colspan="2">
<asp:LinkButton runat="server" ID="AddPartyRelationshipAddLink">Add</asp:LinkButton>
<asp:LinkButton runat="server" ID="AddPartyRelationshipCancelLink">Cancel</asp:LinkButton>
</td>
</tr>
</table>
</div>
</div>
</asp:Panel><!-- end AddPartyRelationshipPanel -->
</asp:Panel>
<asp:Panel runat="server"
ID="ClassificationMembershipHeaderPanel"
BorderWidth="1px"
BorderStyle="solid"
BorderColor="gray"
style="padding:5px"
><b>CLASSIFICATION MEMBERSHIPS</b></asp:Panel>
<asp:Panel runat="server"
ID="ClassificationMembershipPanel"
CssClass="editContent"
BackColor="#ddd5bd"
BorderWidth="1px"
BorderStyle="solid"
BorderColor="gray"
>
</asp:Panel>
</td>
<td> </td>
</tr>
</table>
</td>
</tr>
</table>

<!-- controls the Relationships/Memberships panels -->
<atlasToolkit:CollapsiblePanelExtender ID="IssuerIssuerRelationshipCollapsiblePanelExtender" runat="Server">
<atlasToolkit:CollapsiblePanelProperties
TargetControlID="IssuerIssuerRelationshipPanel"
ExpandControlID="IssuerIssuerRelationshipHeaderPanel"
CollapseControlID="IssuerIssuerRelationshipHeaderPanel"
Collapsed="True"
SuppressPostBack="true"
/>
</atlasToolkit:CollapsiblePanelExtender>
<atlasToolkit:CollapsiblePanelExtender ID="IssuerPartyRelationshipCollapsiblePanelExtender" runat="Server">
<atlasToolkit:CollapsiblePanelProperties
TargetControlID="IssuerPartyRelationshipPanel"
ExpandControlID="IssuerPartyRelationshipHeaderPanel"
CollapseControlID="IssuerPartyRelationshipHeaderPanel"
Collapsed="True"
SuppressPostBack="true"
/>
</atlasToolkit:CollapsiblePanelExtender>
<atlasToolkit:CollapsiblePanelExtender ID="ClassificationMembershipCollapsiblePanelExtender" runat="Server">
<atlasToolkit:CollapsiblePanelProperties
TargetControlID="ClassificationMembershipPanel"
ExpandControlID="ClassificationMembershipHeaderPanel"
CollapseControlID="ClassificationMembershipHeaderPanel"
Collapsed="True"
SuppressPostBack="true"
/>
</atlasToolkit:CollapsiblePanelExtender>
<atlasToolkit:CollapsiblePanelExtender ID="AddPartyRelationshipCollapsiblePanelExtender3" runat="Server">
<atlasToolkit:CollapsiblePanelProperties
TargetControlID="AddPartyRelationshipPanel"
ExpandControlID="AddPartyRelationshipLink"
CollapseControlID="AddPartyRelationshipCancelLink"
Collapsed="True"
SuppressPostBack="true"
/>
</atlasToolkit:CollapsiblePanelExtender
</asp:Content
one more question;
I'm not clear on who/how hookPanelCollapse() get called.
You need to call it from your code somewhere, after load happens for the document

Cool UI by the way - looks great.

I'm actually not reproducing this behavior - you mean the top "ISSUER TO ISSUER RELATIONSHIPS " panel, right?

For me it collapses and expands just fine and the dropdown doesn't show. Are you sure you're using May 4th bits?

Not sure what you mean about the panels - you mean the border gets left over?

Thanks for the complement ;)

it seems that the display stuff is the result of the fact that the sytle information assigned to the target panel is being copied to the "inner" panel that you are creating to allow the cllaposng effect. I was able to eliminate the problem by moving the style stuff into a nested structure (either a nested table or div). After having a fresh look at it this morning, I realized that the drop down indeed seem to disappear on collapse.Things do get a little hinky at times, but I think thats just the result of having debugger statements in the javascript code. There may be some issues related to nested collapsible panels though. you can see some of this nonsense if you click the "Add another party relationship" link within the "ISSUER TO PARTY RELATIONSHIPS" panel then try closing the outer panel. clicking the "Cancel" link will cause the inner panel to collapse. Also, for some reason in my javascipt code the follwoign statement doesn't work:

var ParentHierarchyRoleDropDown = Sys.Application.findObject("ParentHierarchyRoleDropDown");

ParentHierarchyRoleDropDown comes back as undefined!

here is the revised code, thanks again for all your help!:

<%@. Page Language="C#" MasterPageFile="~/NetikClassic.master" AutoEventWireup="true" CodeFile="IssuerDetail.aspx.cs" Inherits="Issuer_Maintenance_IssuerDetail" Title="Add/Edit Issuer" %>
<%@. Register Assembly="AtlasControlToolkit" Namespace="AtlasControlToolkit" TagPrefix="atlasToolkit" %>
<asp:Content ID="Content1" ContentPlaceHolderID="mainCopy" Runat="Server">
<atlas:ScriptManager id="MasterScriptManager" EnableScriptGlobalization="false" runat="Server"/>

<table border="0" cellpadding="2" cellspacing="0">
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td class="dialog_title"><asp:label runat="Server" ID="TitleLabel">Add/Edit Issuer</asp:label></td>
<td align="right">
<a href="http://links.10026.com/?link=javascript:history.go(-1)"><img border="0" src="http://pics.10026.com/?src=../Images/btn_backS.gif" alt="Back" width="18" height="15"/></a>
<a href="http://links.10026.com/?link=../help/help.htm"><img border="0" alt="Help" src="http://pics.10026.com/?src=../Images/btn_help.gif" width="18" height="15"/></a>
<a href="http://links.10026.com/?link=/"><img border="0" src="http://pics.10026.com/?src=../images/btn_close.gif" alt="Close" width="18" height="15"/></a>
</td>
</tr>
<tr>
<td> </td>
<td colspan="3">
<table cellpadding="2" cellspacing="3" style="background-color: rgb(239,231,207)" width="100%">
<tr>
<td colspan="3"/>
</tr>
<tr>
<td> </td>
<td>
<table cellpadding="0" cellspacing="0">
<tr>
<td>
Issuer Id:
</td>
<td>
<asp:TextBox
runat="server"
ID="IssuerIdTextbox"
visible="false"
MaxLength="16"
Width="175"
/>
<asp:Label
runat="server"
ID="IssuerIdLabel"
Visible="false"
/>
</td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="10" /></td></tr>
<tr>
<td>
Issuer Name:
</td>
<td>
<asp:TextBox
runat="server"
ID="IssuerNameTextBox"
MaxLength="40"
Width="175"
/>
</td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="10" /></td></tr>
<tr>
<td>
Issuer Type:
</td>
<td>
<asp:DropDownList
runat="server"
ID="IssuerTypeDropDown"
Width="160"
/>
</td>
<td>
Legal Form:
</td>
<td>
<asp:DropDownList
runat="server"
ID="LegalFormDropDown"
Width="160"
/>
</td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="10" /></td></tr>
<tr>
<td>
Primary Country:
</td>
<td>
<asp:DropDownList
runat="server"
ID="CountryDropDown"
Width="160"
/>
</td>
<td>
State of Incorp:
</td>
<td>
<asp:DropDownList
runat="server"
ID="StateOfIncorpDropDown"
Width="160"
/>
</td>
</tr>
<tr>
<td>Yr of Incorp/Reg: </td>
<td>
<table cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="left">
<asp:TextBox runat="server" ID="YrofIncorpTextBox" MaxLength="4" Width="50"/>
</td>
<td align="right">Fiscal Yr End Month: </td>
</tr>
</table>
</td>
<td>
<asp:DropDownList runat="server" ID="DropDownList1" Width="65"/>
</td>
<td style="white-space:nowrap">
<asp:RadioButtonList runat="server"
ID="CorpTypeRadioButtonList"
RepeatDirection="Horizontal"
BorderWidth="0"
CellPadding="0"
CellSpacing="0"
>
<asp:ListItem Selected="True" Text="Public" Value="PUBLIC"/>
<asp:ListItem Selected="False" Text="Private" Value="PRIVATE"/>
</asp:RadioButtonList>

</td>
</tr>
<tr>
<td>
Web Site:
</td>
<td>
<asp:TextBox
runat="server"
ID="WebSiteTextBox"
MaxLength="255"
Width="175"
/>
</td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="10" /></td></tr>
<tr>
<td>
Status:
</td>
<td>
<asp:DropDownList
runat="server"
ID="StatusDropDown"
Width="180"
/>
</td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="10" /></td></tr>
<tr>
<td colspan="2">
<asp:ImageButton runat="server" ID="SaveButton" ImageUrl="../Images/btn_savedlg.gif" />
<asp:ImageButton runat="server" ID="CancelButton" ImageUrl="../Images/btn_cancel.gif" />
</td>
<td colspan="2" align="right">
<asp:LinkButton runat="server" ID="ExpandPanelsButton">Expand all settings</asp:LinkButton>
<asp:LinkButton runat="server" ID="CollapsePanelsButton">Collapse all settings</asp:LinkButton>
</td>
</tr>
</table>
</td>
<td> </td>
</tr>
<tr>
<td> </td>
<td>
<asp:Panel runat="server" ID="IssuerIssuerRelationshipHeaderPanel">
<table
cellpadding="0"
cellspacing="0"
class="editHeader"
style="
border-left-width:1px;
border-left-style:solid;
border-left-color:Gray;
border-right-width:1px;
border-right-style:solid;
border-right-color:Gray;
border-top-width:1px;
border-top-style:solid;
border-top-color:Gray
"
>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="5" width="510px" /></td></tr>
<tr>
<td> <b>ISSUER TO ISSUER RELATIONSHIPS</b></td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="5" width="510px" /></td></tr>
</table>
</asp:Panel>
<asp:Panel runat="server" ID="IssuerIssuerRelationshipPanel">
<table
cellpadding="0"
cellspacing="0"
width="100%"
class="editContent"
style="
background-color:#ddd5bd;
border-left-width:1px;
border-left-style:solid;
border-left-color:Gray;
border-right-width:1px;
border-right-style:solid;
border-right-color:Gray;
border-top-width:1px;
border-top-style:solid;
border-top-color:Gray
"
>
<tr>
<td> </td>
<td>
<table cellpadding="0" cellspacing="0">
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="5" /></td></tr>
<tr>
<td style="white-space:nowrap">Immediate Parent Issuer ID: </td>
<td style="white-space:nowrap">
<asp:textbox ID="ImmediateParentIssuerIDTextBox" runat="server" MaxLength="16" />
<asp:ImageButton runat="server" id="ImmediateParentIssuerSearchButton" ImageUrl="../images/btn_lookupoff.gif" />
(leave blank, if at top of hierarchy)
</td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="10" /></td></tr>
<tr>
<td>Ultimate Parent Issuer ID: </td>
<td>
<asp:textbox ID="UltimateParentIssuerIDTextbox" runat="server" MaxLength="16" />
<asp:ImageButton runat="server" id="UltimateParentIssuerSearchButton" ImageUrl="../images/btn_lookupoff.gif" />
(leave blank, if at top of hierarchy)
</td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="10" /></td></tr>
<tr>
<td>Role in Parent Hierarchy: </td>
<td>
<asp:DropDownList runat="server" ID="ParentHierarchyRoleDropDown" Width="180">
</asp:DropDownList>
</td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="10" /></td></tr>
<tr>
<td colspan="2"><asp:LinkButton runat="server" ID="AddNewIssuerRelationship">Add another Issuer relationship</asp:LinkButton></td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="10" /></td></tr>
</table>
</td>
<td> </td>
</tr>
</table>
</asp:Panel>
<asp:Panel runat="server" ID="IssuerPartyRelationshipHeaderPanel">
<table
cellpadding="0"
cellspacing="0"
class="editHeader"
style="
border-left-width:1px;
border-left-style:solid;
border-left-color:Gray;
border-right-width:1px;
border-right-style:solid;
border-right-color:Gray;
border-top-width:1px;
border-top-style:solid;
border-top-color:Gray
"
>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="5" width="510px" /></td></tr>
<tr>
<td> <b>ISSUER TO PARTY RELATIONSHIPS</b></td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="5" width="510px" /></td></tr>
<tr><td></td></tr>
</table>
</asp:Panel>
<asp:Panel runat="server" ID="IssuerPartyRelationshipPanel">
<table
cellpadding="0"
cellspacing="0"
width="100%"
class="editContent"
style="
background-color:#ddd5bd;
border-left-width:1px;
border-left-style:solid;
border-left-color:Gray;
border-right-width:1px;
border-right-style:solid;
border-right-color:Gray;
border-top-width:1px;
border-top-style:solid;
border-top-color:Gray
"
>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="5" width="510px" /></td></tr>
<tr>
<td>
<asp:LinkButton runat="server" ID="AddPartyRelationshipLink">Add another party relationship</asp:LinkButton>
</td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="5" width="510px"/></td></tr>
<tr>
<td>
<asp:Panel runat="server" ID="AddPartyRelationshipPanel">
<div style="padding:5px">
<table cellpadding="0" cellspacing="5" width="100%" style="border-width:1px; border-style:solid; border-color:Gray">
<tr>
<td colspan="2"><b>Add this Relationship:</b></td>
</tr>
<tr>
<td>Related Party: </td>
<td>
<asp:TextBox runat="server" ID="RelatedPartyNameTextBox" Width="180" MaxLength="60"/>
<asp:ImageButton runat="server" id="RelatedPartyNameSearchButton" ImageUrl="../images/btn_lookupoff.gif" />
</td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="5" /></td></tr>
<tr>
<td>Relationship: </td>
<td style="white-space:nowrap">
<asp:DropDownList runat="server" ID="PartyRelationshipTypeDropDown" Width="182"/>
Start Date: <asp:TextBox runat="server" ID="PartyRelationshipStartDateTextBox" MaxLength="12" Width="40"/>
End Date: <asp:TextBox runat="server" ID="PartyRelationshipEndDateTextBox" MaxLength="12" Width="40"/>
</td>
</tr>
<tr>
<td colspan="2">
<asp:LinkButton runat="server" ID="AddPartyRelationshipAddLink">Add</asp:LinkButton>
<asp:LinkButton runat="server" ID="AddPartyRelationshipCancelLink">Cancel</asp:LinkButton>
</td>
</tr>
</table>
</div>
</asp:Panel><!-- end AddPartyRelationshipPanel -->
</td>
</tr>
</table>
</asp:Panel>
<asp:Panel runat="server" ID="ClassificationMembershipHeaderPanel">
<table
cellpadding="0"
cellspacing="0"
class="editHeader"
style="
border-left-width:1px;
border-left-style:solid;
border-left-color:Gray;
border-right-width:1px;
border-right-style:solid;
border-right-color:Gray;
border-top-width:1px;
border-top-style:solid;
border-top-color:Gray;
border-bottom-width:1px;
border-bottom-style:solid;
border-bottom-color:Gray

"
>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="5" width="510px" /></td></tr>
<tr>
<td> <b>CLASSIFICATION MEMBERSHIPS</b></td>
</tr>
<tr><td><img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="5" width="510px" /></td></tr>
<tr>
<td>
</td>
</tr>
</table>
</asp:Panel>
<asp:Panel runat="server" ID="ClassificationMembershipPanel">
<table
cellpadding="0"
cellspacing="0"
width="100%"
class="editContent"
style="
background-color:#ddd5bd;
border-left-width:1px;
border-left-style:solid;
border-left-color:Gray;
border-right-width:1px;
border-right-style:solid;
border-right-color:Gray;
border-bottom-width:1px;
border-bottom-style:solid;
border-bottom-color:Gray
"
>
<tr>
<td>
<img alt="spacer" src="http://pics.10026.com/?src=../images/spacer.gif" height="5" width="510px"/>
</td>
</tr>
</table>
</asp:Panel>
</td>
<td> </td>
</tr>
</table>
</td>
</tr>
</table>

<!-- controls the Relationships/Memberships panels -->
<atlasToolkit:CollapsiblePanelExtender ID="IssuerIssuerRelationshipCollapsiblePanelExtender" runat="Server">
<atlasToolkit:CollapsiblePanelProperties
ID="IssuerIssuerRelationshipCollapsiblePanelExtenderProperties"
TargetControlID="IssuerIssuerRelationshipPanel"
ExpandControlID="IssuerIssuerRelationshipHeaderPanel"
CollapseControlID="IssuerIssuerRelationshipHeaderPanel"
Collapsed="True"
SuppressPostBack="true"
/>
</atlasToolkit:CollapsiblePanelExtender>
<atlasToolkit:CollapsiblePanelExtender ID="IssuerPartyRelationshipCollapsiblePanelExtender" runat="Server">
<atlasToolkit:CollapsiblePanelProperties
ID="IssuerPartyRelationshipCollapsiblePanelExtenderProperties"
TargetControlID="IssuerPartyRelationshipPanel"
ExpandControlID="IssuerPartyRelationshipHeaderPanel"
CollapseControlID="IssuerPartyRelationshipHeaderPanel"
Collapsed="True"
SuppressPostBack="true"
/>
</atlasToolkit:CollapsiblePanelExtender>
<atlasToolkit:CollapsiblePanelExtender ID="ClassificationMembershipCollapsiblePanelExtender" runat="Server">
<atlasToolkit:CollapsiblePanelProperties
ID="ClassificationMembershipCollapsiblePanelExtenderProperties"
TargetControlID="ClassificationMembershipPanel"
ExpandControlID="ClassificationMembershipHeaderPanel"
CollapseControlID="ClassificationMembershipHeaderPanel"
Collapsed="True"
SuppressPostBack="true"
/>
</atlasToolkit:CollapsiblePanelExtender>
<atlasToolkit:CollapsiblePanelExtender ID="AddPartyRelationshipCollapsiblePanelExtender" runat="Server">
<atlasToolkit:CollapsiblePanelProperties
ID="AddPartyRelationshipCollapsiblePanelExtenderProperties"
TargetControlID="AddPartyRelationshipPanel"
ExpandControlID="AddPartyRelationshipLink"
CollapseControlID="AddPartyRelationshipCancelLink"
Collapsed="True"
SuppressPostBack="true"
/>
</atlasToolkit:CollapsiblePanelExtender>

<!-- Javasctipt to handle post expand/collapse behaviors -->
<script language="javascript" type="text/javascript"
var PartyRelationshipTypeDropDown;
var ParentHierarchyRoleDropDown;
var IssuerIssuerRelationshipBehavior;
var IssuerPartyRelationshipBehavior;
var ClassificationMembershipBehavior;
var AddPartyRelationshipBehavior;

function pageLoad()
{
//init the dropdown references
ParentHierarchyRoleDropDown = Sys.Application.findObject("ParentHierarchyRoleDropDown");
PartyRelationshipTypeDropDown = Sys.Application.findObject("PartyRelationshipTypeDropDown");

//init collapsible panel events
HookupCollapsiblePanelEvents();
}

//this function initially hooks up the event handlers for the collapsible panels on the page
function HookupCollapsiblePanelEvents()
{
IssuerIssuerRelationshipBehavior = $object("IssuerIssuerRelationshipCollapsiblePanelExtenderProperties");
IssuerIssuerRelationshipBehavior.expandComplete.add(Function.createDelegate(null, issuerIssuerRelationshipPanel_OnExpanded));
IssuerIssuerRelationshipBehavior.collapseComplete.add(Function.createDelegate(null, issuerIssuerRelationshipPanel_OnCollapsed));

IssuerPartyRelationshipBehavior = $object("IssuerPartyRelationshipCollapsiblePanelExtenderProperties");
IssuerPartyRelationshipBehavior.expandComplete.add(Function.createDelegate(null, issuerPartyRelationshipPanel_OnExpanded));
IssuerPartyRelationshipBehavior.collapseComplete.add(Function.createDelegate(null, issuerPartyRelationshipPanel_OnCollapsed));

ClassificationMembershipBehavior = $object("ClassificationMembershipCollapsiblePanelExtenderProperties");
ClassificationMembershipBehavior.expandComplete.add(Function.createDelegate(null, classificationMembershipPanel_OnExpanded));
ClassificationMembershipBehavior.collapseComplete.add(Function.createDelegate(null, classificationMembershipPanel_OnCollapsed));

AddPartyRelationshipBehavior = $object("AddPartyRelationshipCollapsiblePanelExtenderProperties");
AddPartyRelationshipBehavior.expandComplete.add(Function.createDelegate(null, addPartyRelationshipPanel_OnExpanded));
AddPartyRelationshipBehavior.collapseComplete.add(Function.createDelegate(null, addPartyRelationshipPanel_OnCollapsed));
}

function issuerIssuerRelationshipPanel_OnExpanded()
{
//make sure that dropdowns are visible
}

function issuerIssuerRelationshipPanel_OnCollapsed()
{}

function issuerPartyRelationshipPanel_OnExpanded()
{}

function issuerPartyRelationshipPanel_OnCollapsed()
{}

function classificationMembershipPanel_OnExpanded()
{}

function classificationMembershipPanel_OnCollapsed()
{}

function addPartyRelationshipPanel_OnExpanded()
{}

function addPartyRelationshipPanel_OnCollapsed()
{}

</script
</asp:Content
More nested collapsible panel nonsense! it get even more frustrating, because it only screws up sometimes! Now, the inner collabsible panel expands, but its contents are invisible!

That's coming back null because no client-side object has been created for it. You want:

var dd = $("ParentPropertyDropDown"); // this gives you the DOM elemenet

or

var dd = new Sys.UI.Select("ParentPropertyDropDown); // this gives you an Atlas object that wraps the DOM element.

the CollapsiblePanelProperties is missing an ID property. it makes the asp.net designer complain when switching into design mode.
It shouldn't. ID's aren't required on properties declarations.

Extenders: Sub-categories for properties in design-mode?

I noticed that when creating properties for an extender control that they appear by default on the target control properties display in the designer all under the same category (the extender control name). The <category> attribute of the extender properties seems simply to be ignored. My control has a lot of properties (client-side charts) and it would be nice to be able to categorize them.

Is there a way to actually create sub-categories under the ExtenderName category for properties on the targeted control?

Thanks in advance,
Pascal

Unfortutately not, the property grid doesn't support categories on sub-objects. There really isn't a clean solution for this as an extender, but based on your description, I'm not sure an extender is what you really want to be using.

My guess is that you want to write a control that emits an extender as part of it's rendering process. That way, you can expose the properties via your control as you would a normal component, and then just pass those values down to the extender via code.

Extenders not visible?

Hello. I'm new to the Microsoft developer environment...very new.

I installed Visual Web Developer 2008 as well as the AJAX Control Toolkit (3.5 with source). I installed the Toolkit and have all of the available mods in a separate tab. I added the script manager above the default form tag. If I drag and drop a standard button onto the platform I am not getting the arrow icon to view available extensions.

Is there something obvious I am missing?

Hi there,

The script manager should be placed just after the form tag, not above form tag. Please correct it.

Srinath
Dont forget to click "Mark as Answer" on the post that helped you.
It marks your thread as Resolved so we will all know you have been helped.

Moved the script manager below the form tag. Still no luck. Any other suggestions?

Hi, got the same issue. The Toolkit is installed but when I mark a button, I get no "Button task" where I can select Extenders. I run VS 2008 Prof.

L.

Lokaboy keep me posted if you will. If I find some help i'll PM you right away.

Sure :-) Thanks

Extenders for controls inside TabContainer/TabPanel

Hi,

I have a textbox control (ID="'PasswordTxtBox' ") inside TabPanel and I am trying to attach watermark extender to it. In design mode TargetControlID for watermark extender does not appear and when I manually write it in the markup I get run time error saying

The TargetControlID of 'TextBoxWatermarkExtender1' is not valid. A control with ID 'PasswordTxtBox' could not be found

Please guide.

Regards & thanks

Kapil

My bad. I was _not_ putting the extender control in the contenttemplate of tabpanel.

Regards

Kapil

extenders arent working at all

Hi. I have installed libarary and control toolkit, and I have the following code:

<%@dotnet.itags.org. Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="TaskCenter.WebForm1" EnableEventValidation="true" %><%@dotnet.itags.org. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajax" %><%@dotnet.itags.org. Register Assembly="Microsoft.Web.Extensions" Namespace="Microsoft.Web.UI" TagPrefix="aj" %><%@dotnet.itags.org. Register Assembly="Microsoft.Web.Extensions" Namespace="Microsoft.Web.UI.Controls" TagPrefix="aj" %><!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>Untitled Page</title></head><body> <form id="form1" runat="server"> <div> <aj:ScriptManager ID="sm" EnablePartialRendering="True" runat="Server" /> <asp:Label ID="test" runat="Server">test</asp:Label> <asp:Panel ID="panel1" runat="server" Enabled="true">testtttt</asp:Panel><ajax:DropDownExtender runat="server" ID="DDE" TargetControlID="test" DropDownControlID="panel1" OnResolveControlID="DDE_ResolveControlID" /> </div> </form></body></html>

Problem is, it doesn't work. The app builds without any problem, and when I open the page i see two text labels - test and testtt, no extender, no dropdown.

How do I fix it?

Look in the web.config for the SampleWebsite. Make sure you have the sections under httpHandlers and httpModules in your web.config.

Extenders and windowed control problem

Hi,

we are using a couple of extenders such as the Calendar extender, Autocomplete extender etc...

The problem with those is when the form contains windowed controls such as the select box just below them... in that case, the usual "problem" of seeing the select through the extender div happens.

Before today, we were building our forms by keeping that in mind... making sure to avoid such positions. But now, our system should allow external people to define forms; which has quickly led to the above problem...

There is a workaround to this problem, using an empty iframe positioned right below the div; but is there any way to have extenders do the same to avoid the problem ? (as this problem is quite common, we think it is weird that it is not part of the extender functionality)

Thanks

/Tharn

ok, issue closed. They actually do it; but it does not work anymore as soon as controls are in relatively positioned elements.

I'll better report that to the codeplex project.

/t

ExtenderControlProperty expression without quotes

How do I create an extender control property that will refer to a client function handler (or client object, or any client expression)?

If I create an extender propety as string (eg. string Property1), it will be rendered in client control creation as a quoted string:

$created(myComponent,{"Property1" : "value in quotes", ...

However I want it to be passed as client-side expression like that:

$create(myComponent,{"Property1": value without quotes, ...

I need something similar to ExtenderControlEvent attribute, which references a client-side handler, but it can only reference the ajax handler like MyFunction(EventArgs), and not any function with custom parameters, nor any custom client object).

In your client-side setter for the property, you can use: "this._expression = eval(value);".
I would suggest that, in your server-side setter, you make sure to check to make sure the developer doesn't try to use any parameters and to remove "()" from the value. If you don't, the above expression will execute the function and set this._expression to the return value of that function instead of setting this._expression to the function itself.

Hope that helps.

Extender for two controls (Toggle-able Collapsible Panels)

I'm looking to build my first extender and the one I've chosen is a variation on the CollapsiblePanel so I've started with that control as my base. I've removed the ExpandControlID property and forced the CollapseControlID to always be a toggle. I've also added a property, CollapsePanelID, which is the ID of a second panel. At startup, the TargetControlID is expanded, the CollapsePanelID is collapsed and the CollapseControlID is used to toggle the two of them together.

I'm having trouble setting up the animation for the second panel. For the first, I see the line:
_animation.set_target( this );
I can't figure out how to call a similar function for the CollapsePanelID. I thought maybe there was a Sys.UI.Panel object I could create and configure for the second panel but I don't see one. The idea is that I would set up a second animation for the second panel, then in the _doOpen and _doClose functions, I'd play it along with the existing one.

This is for my own edification, not for any specific problem. I've already been able to do this functionally with two CollapsiblePanels. Just picked this as my project for learning extenders. Even as I write this, I'm thinking there might be a better way to do this but it would still involve the ability to create a Sys.UI control that maps to an asp:panel object.

Thanks,
Kyle

Hi Kyle,

Check out the JavaScript inFAQ item #13. It does essentially what you want - given an ID"Link1" it creates a newSys.UI.Control wrapper for it. This is what you need to pass intoset_target.

It's also worth mentioning that we've got a similar control in the works for the next release of the Toolkit. You check it out in the Prototypes project on CodePlex if you're interested.

Thanks,
Ted

Thanks, Ted. That FAQ item does look like what I want. I'll check it out.

Downloaded the source from CodePlex and had trouble opening the Prototypes project ("The project type is not supported by this installation"). I'll get it worked out but thought I'd raise the issue.

Thanks again,
Kyle

Never mind about the error. Read the instructions, installed the web app update and all is well.

Extender fails after partial postback in IE7 only

I have a simple extender which sets focus to a textbox when the page loads. In IE after a partial postback this control doesn't reset the focus. It does work on page load however and it works every time in FireFox. Any suggestions? Below is the JS for the extender:

Type.registerNamespace('AjaxFocus');

AjaxFocus.AjaxFocusBehavior = function(element)
{
AjaxFocus.AjaxFocusBehavior.initializeBase(this, [element]);
}

AjaxFocus.AjaxFocusBehavior.prototype =
{
initialize : function()
{
AjaxFocus.AjaxFocusBehavior.callBaseMethod(this, 'initialize');

var e = this.get_element();

if (e != null)
e.focus();
},

dispose : function()
{
AjaxFocus.AjaxFocusBehavior.callBaseMethod(this, 'dispose');
}
}

AjaxFocus.AjaxFocusBehavior.registerClass('AjaxFocus.AjaxFocusBehavior', AjaxControlToolkit.BehaviorBase);

Is the Extender inside of the update panel?

Extender Controls not compiling

Hello ,

I recently started working with Ajax/Atlas. I have set up atlas extensions , and am trying to add the control toolkit . I follwoed the instructions , The items show up in the toolbox. When I drag any of the controls onto a webform . Intellisense tell me that the control is not a known element.

I realize this is vague, but if anyone can point me in the right. direction .

Thanks in advance

It seems to be related to how the controls are registered in the site . I have opened other sample projects where the controls are being used and they work fin, in that project .

Extender controls may not be registered before PreRender.

Anytime I insert a calendar extendar control or any other control from the Ajax toolkit in gridview or detailsview template. I get the page exception error. "Extender controls may not be registered before PreRender". I am using the latest Atlas DLL's.

I noticed other posts about the same subject but no clear or detailed answer to the solution. Any help will be greatly appreciated. Preferebly in vb.net please.

Hi,

by "latest Atlas DLL" do you mean ASP.NET AJAX 1.0 ?

Yes,

I meant ASP.NET AJAX 1.0 Garbin. Thanks for the offer to help. I did eventually found the fix for this problem by trial and error. I simply took the ScriptManager out of the Detailsview Control -Insertview section and placed it on the page I had the Detailsview control and Walla! problem resolved. I am sure this is probably cheating but hey it worked. If anybody has any insight as to why this happens and what is the right fix for it please enlight us all.

Once again to recreate the problem try the following steps.

1. Drag and drop a detailsview control on your page.
2. Bind the detailsview control to any datasource.
3. In Detailsview Insert mode drag and drop a textbox then any drag and drop any Atlas control ( I tried Calendar Extendar) right inside the Detailsview insert item template.
4. Bind Calendar extender to the Textbox.
5. Preview your page on your web browser and you will see the ugly exception "Extender controls may not be registered before PreRender."

Hi,

I'm not sure why it's happening, but the ScriptManager control should always be declared in the page (or in the Master Page) rather than in a control's template.

Thanks man! This fixed my problem.

I ran into this problem after I added a Login Control on my Master Page. I had to move my script manager from my "inner page" into my Master Page and that fixed the problem.

Cheers!

Extender Control properties in a switch/case

Hello,

I have problems using properties of an Extender Control in a switch/case selection.

I wrote an ASP.NET AJAX Extender Control to control a GridView with keyboard shortcuts. For that, the user can configure declaretively what keys to use for e.g. paging in the GridView. The key values are mapped to properties in the JavaScript part of the Extender Control (Sys.UI.Behavior class).

In a handler function I determine which key the user has pressed and call the porper _postBack. This works fine with if/else, e.g. if (KeyEvent.keyCode == this._delKeyCode). But with switch/case, e.g. switch (KeyEvent) { case this._delKeyCode: ... break; .. the pressed key is not determined and nothing happens with the GridView. There are also no JavaScript errors. It seems, that with switch/case a control property can't be determined as with if/else.

Thank You

Regards

Rolf

The switch should be:

switch (KeyEvent.keyCode) {
case this._delKeyCode:
// Something
break;
}

-Damien

Thanks Damien,

but sorry it is a typo in my post. I'am actually using

switch (KeyEvent.keyCode) instead ofswitch (KeyEvent) as I wrote. So I'am actually using the switch statement you suggest.

Regards

Rolf

My only guess why it isn't working is because you are comparing against a variable (e.g. this._delKeyCode), try using the actual numeric key code...

-Damien

Extender control nested in 2 DataControls

Hello all!

I have problem when using The CollapsiblePanel Extender control nested in 2 dataControls.

My Code like this

1<asp:DataList id="1" DataSourceID="sds1" runat="server">2 <ItemTemplate>3 <asp:Panel id="pl1" runat="server">4 <asp:Label id="lbl1" runat="server" text="<%# Bind("NewsTitle")%>"/>5 </asp:Panel>6 <asp:LinkButton runat="server" id="lb1"/>7 <asp:Repeater id="gv1" runat="server" DataSourceID="sds2">8 <ItemTemplate>9 <asp:Label id="lbl1" runat="server" text="<%# DataBinder.Eval(Container.DataItem,"NewsTitle")%>"/>1011<atlasToolkit:CollapsiblePanelExtender ID="cpe" runat="Server">12 <atlasToolkit:CollapsiblePanelProperties13 TargetControlID="pl1"14 CollapsedSize="0"15 ExpandedSize="300"16 Collapsed="True"17 ExpandControlID="lb1"18 CollapseControlID="lb1"19 ScrollContents="True"20 TextLabelID="Label1"21 CollapsedText="Show Details..."22 ExpandedText="Hide Details"23 ImageControlID="Image1"24 ExpandDirection="Height"/>25</atlasToolkit:CollapsiblePanelExtender>262728 </ItemTemplate>29 </asp:Repeater>30 </ItemTemplate>31</asp:DataList>

Then when view this page in browser, it throw the message "Can't find Control 'pl1' for the extender 'cpe'"

How can i fix this error? Thank all!

If you move the CollapsiblePanel declaration up a level so that it sits right next to the label/panel it touches, this scenario seems to work fine for me. Have you tried that?

HiDavid!

Thank for your reply! But, i dont want move it up a level, it must be this current DataControl.

Eample, in a news site, i use datalist for display a list of new catalogue, in each news catalogue, i display some news.

My extenderControl is not Collapsible Panel, it my owner, when you click in a news Title (This News Title is in DataControl level 2 -- so DataControl level 2 have more than 1 link like that) , an Panel near this DataControl level2 and in DataControl level 1 will display some text from server (This text get by My Extender control).

So, do you know why i cant not move it up a level?

I have try Reflector and saw this error message in OnPreRender (At Microsoft.Web.UI.ExtenderBase...<T>). And this Code only support for Control in this.Page or this.NamingContainer,...

I think Atlas not good in processing it, for the best, i think this code (or another code like this ^_^) is require to find All Control that name "ID"

Control myctl =this;Control control1;while (myctl !=null){ control1 = myctl.FindControl("ID");if (control1 ==null) myctl = myctl.Parent;else myctl =null;}

Do you think so?

Thank!

oh! Im so sorry! My code:

1Control myctl =this;23Control control1;45while (myctl !=null)67{89 control1 = myctl.FindControl("ID");10if (control1 ==null) control1 = myctl.NamingContainer.FindControl("ID");11if (control1 ==null) myctl = myctl.Parent;1213else myctl =null;1415}16

Okay, there's a way to do this, but it's subject to change in the future, so it's probably best not to rely on it. But what you can do to help resolve controls that couldn't otherwise be found is to add a OnResolveTargetControlID property to your extender and then write a simple method that does the resolution for you. The OnResolveTargetControlID method is called when the extender fails to resolve the TargetControlID using its usual steps (current naming context, parent naming context, page naming context). This applies only for TargetControlID, but when it works, it's nice. :) Here's a complete sample to demonstrate the concept. Note that I've got the same basic structure you have with the extender nested deeper than the control it's targetting. Hope this helps!

<%@. Page Language="C#" %><%@. Register Assembly="AtlasControlToolkit" Namespace="AtlasControlToolkit" TagPrefix="atlastoolkit" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><script runat="server"> protected override void OnLoad(EventArgs e) { base.OnLoad(e); xds1.DataFile = HttpContext.Current.Server.MapPath("~/App_Data/CarsService.xml"); } protected void ResolveTargetControlID(object sender, Microsoft.AtlasControlExtender.ResolveControlEventArgs e) { if ("p1" == e.ControlID) { e.Control = ((Control)sender).NamingContainer.NamingContainer.NamingContainer.FindControl(e.ControlID); } }</script><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>Untitled Page</title></head><body> <form id="form1" runat="server"> <div> <atlas:ScriptManager ID="sm1" runat="server"> </atlas:ScriptManager> <asp:XmlDataSource ID="xds1" runat="server"></asp:XmlDataSource> <asp:DataList ID="dl1" runat="server" DataSourceID="xds1"> <ItemTemplate> <asp:Panel ID="p1" runat="server" BackColor="Lime"> Hello </asp:Panel> <asp:Repeater ID="r1" runat="server" DataSourceID="xds1"> <ItemTemplate> Hi <atlastoolkit:DropShadowExtender ID="dse" runat="server" OnResolveTargetControlID="ResolveTargetControlID"> <atlastoolkit:DropShadowProperties TargetControlID="p1" Width="2" /> </atlastoolkit:DropShadowExtender> </ItemTemplate> </asp:Repeater> </ItemTemplate> </asp:DataList> </div> </form></body></html>

e.Control = ((Control)sender).NamingContainer.NamingContainer.NamingContainer.FindControl(e.ControlID); 

^_^

So many "NamingContainer" --> so fun.

Thank you first! I will try your help!

Hello again! i've try your help and get the best! thanks you very much, with other control, not the target, there is no problem!

But i want to know: Is there an other way to do this? Some time, we dont know how many 'NamingContainer' needed!

You could build a more flexible implementation that kept searching each naming container up the chain until it reached the top (null) or found the control. But the basic idea's the same as what I showed: find the control near where you expect it to be. Glad this worked for you!

extender control inside databound controls

I will show you a piece of code that worked with the last CTP:

<%@dotnet.itags.org.PageLanguage="C#"AutoEventWireup="true"CodeFile="test.aspx.cs"Inherits="test" %>

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

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

<headrunat="server">

<title>Databound Controls</title>

</head>

<body>

<formid="form1"runat="server">

<atlas:ScriptManagerEnablePartialRendering=trueID="sm"runat="server"></atlas:ScriptManager>

<

asp:RepeaterID="rpt"runat="server"DataSourceID="xmlData"OnItemDataBound="rpt_ItemDataBound">

<ItemTemplate>

<%# XPath("name") %><asp:TextBoxID="textInside"runat="server"></asp:TextBox><br/>

<atlastoolkit:TextBoxWatermarkExtenderID="watInside"TargetControlID="textInside"runat="server"WatermarkText="Inside TextBox"/>

</ItemTemplate>

</asp:Repeater>

Somebody<asp:TextBoxID="textOutside"runat="server"></asp:TextBox><br/>

<atlastoolkit:TextBoxWatermarkExtenderID="watOutside"runat="server"TargetControlID="textOutside"WatermarkText="Outside TextBox"/>

<asp:XmlDataSourceID="xmlData"runat="server"XPath="contacts">

<Data>

<contacts>

<name>Peter</name>

</contacts></Data>

</asp:XmlDataSource>

</form>

</body>

</html>

This piece of code is not working anymore more. The responsible is the “new” behaviour of the TargetControlID. Now, you need the ClientID of the target control, not the usual control ID.

In the easy case, both (ClientID and ID) are the same, but not inside databound controls. So what you need now is:

First, you need to DataBind() the Page at load stage; this is because you need the extender controls in the control tree before the (Pre)Render stage; otherwise, they won’t render.

Second, you need to delete the TextBoxWatermarkExtender instantiated declaratively, and add it at runtime:

protectedvoid rpt_ItemDataBound(object sender,RepeaterItemEventArgs e)

{

AjaxControlToolkit.TextBoxWatermarkExtender tbe =new AjaxControlToolkit.TextBoxWatermarkExtender ();

tbe.TargetControlID = (e.Item.FindControl("textInside")asTextBox).ClientID;

tbe.ID ="watInside";

tbe.WatermarkText ="Inside Text";

tbe.ResolveControlID +=new AjaxControlToolkit.ResolveControlEventHandler(tbe_ResolveControlID);

e.Item.Controls.Add(tbe);

}

Finally, the extender control is not still able to find the TargetControlID, so you have to make up your own FindControl (like this one) :

void tbe_ResolveControlID(object sender, AjaxControlToolkit.ResolveControlEventArgs e)

{

e.Control =Util.FindControl(e.ControlID,"_",this.Page);

}

publicstatic System.Web.UI.Control Util.FindControl(string cliendid,string separator, System.Web.UI.Control root)

{

int i = 0;

string[] sepControls = cliendid.Split(separator[0]);

System.Web.UI.Control fc =null;

for (fc = root; (null != fc) && i < sepControls.Length; i++)

{

fc = fc.FindControl(sepControls[i]);

}

if (fc !=null && fc.ClientID == cliendid)return fc;

elsereturnnull;

}

If someone knows any other way to simplify this case, please tell me. Otherwise, my project has become a nightmare.

fran

Your original sample works fine for me with the addition of only:

protected override void OnLoad(EventArgs e)
{
base.OnLoad(e);
rpt.DataBind();
}

More details here:http://forums.asp.net/thread/1441672.aspx.

Extender control CalendarExtender1 cannot extend DropDownList1

there is no problem when i try to extend the Calendar extender to the text box it is running fine, but

the Exception is :'AjaxControlToolkit.CalendarExtender' cannot extend controls of type 'System.Web.UI.WebControls.DropDownList',

im getting this Exception when i try to extend Ajax-calender Extender conrtol to dropdownlist,i have assigned the dropdown list control in the targetcontrolid of the Calender extender and set the dateformat and popup control id ,is ther any other thing i should do get this right,

Prakash,

Telesoft India ,Bangalore.

that is because the calendar extendar is designed to work with a textbox. If you really want the result in a drop down list you could try putting a textbox on your field and making it hidden. Then attach the calendar extender to that hidden textbox and when the user clicks a date, assign the drop down list to the value of the textbox

Extender control ... cannot extend controls of type ...

Hi all,

I have a custom ImageButton that inherits from the standard ImageButton.

When I try to extend this button with ConfirmButtonExtender, I receive the following error:

Extender control 'cbeDelete' cannot extend 'ibDelete'.
Extender controls of type 'AjaxControlToolkit.ConfirmButtonExtender' cannot extend controls of type 'MyControls.ImageButton'.

Thx in advance

Any suggestions?

Even I am having same problem.

Extender control

Hi,

Can someone explain how the extender concept works? I like the fact that you can drop an extender on a page for a particular type and all types on the page will extend a couple of properties.

I would like to apply this to some other scenarios but I dont necessarily want to use ajax to do it.

How does this work?

Is the source code available to find out?

Regards

hello.

extenders will only wrap client side behaviors so that it's easier to associate them with page controls. in my opinion, you should only use them if you're using client behaviors and you want to define its properties from the server side.

I find the use for extenders limited / tedious though. Remember that one extender is required per control you want to extend.

If you want to extend the behaviour of the whole type without adding any controls, you should look into control adapters.

Ooops, forgot the URL to the atlas control toolkit. This is the best way (IMHO) to learn about the mechanics: http://www.codeplex.com/Project/FileDownload.aspx?ProjectName=AtlasControlToolkit&DownloadId=4059

I will investigate this further, thanks for the feedback!!!

Thanks, I will check it out.

Extend an extender?

I am in need of a custom control that utilizes the ModalPopupExtender. Specifically I'm wanting to create some custom properties/methods for several different classes and have the functionality of the ModalPopup. I tried to Inherit the ModalPopupExtender control in my classes, but I'm having no luck creating an extender of an extender. Also, my code is in VB.NET but the CLR should allow me to inherit across languanges (I'd imagine). Anyone have any tips on creating a control or an extension of a control that also incorporates the ModalPopupExtender functionality? I thought of maybe creating a composite control but since I have never created server controls, it will take me a long while to figure out if it was a good idea or not. This may be a silly question, but I have spent many moons trying to figure out what I'm doing wrong.

Thanks everyone in advance! I use this site on a constant, daily basis and I respect everyone's time, knowledge and volunteerism to help out those in need!

Bump?