Showing posts with label controls. Show all posts
Showing posts with label controls. Show all posts

Wednesday, March 28, 2012

Link inside a draghandles template

Is it possible to access a link or a textbox inside a draghandle's template?

I want all the controls inside the draghandle to be dragable and also that users could click on these controls inside the draghandle

talking about ReorderList's DragHandle..

I"m trying to do a similar thing. Originally, I wanted to be able to drag any portion of a ReorderItem to a different position. The problem I ran into is that if you don't declare a position for the DragHandle, you can drag from any place on the ReorderItem BUT this means you cannot click on any controls that are contained in the ReorderItem, making them all useless. The control thinks that if you click ANYWHERE, you're trying to drag it, so the controls can never be used.

So, to remedy this problem, I thought to do exactly what you're doing. I added a <DragHandle> to the left side which contains a Label; this Label was to hold the sequence number of the ReorderItems (so the first item would have a 1, the second would contain a 2, etc), but like you I cannot access this control from the code behind when the Reorder event fires.


your problem seems diferent than mine. I don't have any problems accesing controls in the code behind. I'm trying to figure out how to make some parts of the draghandle dragable and some of them "clickable". I guess i need to construct some <div> element consisting of several other <div> elements and put a draghandle inside one of them. But here is another problem: you cannot place the draghandle anywhere you like, just four possitions. So i cannot put it inside a particular <div> element

I guess i need to think another way to do it

link usage by ajax framework

HI, I am new using ajax... so..I created a small project with a few controls inside a page.I was doing well every think fine.So I started a web test project to see the impact of using ajax inside my page (link usage)...and what I see was a use of a "library" off size 250Kb ...Is this correct I doing something wrong ?

The controls that I was testing was part off the toolkit

Hi,

According to my understanding, you noticed a .js file with size of 250 KB was downloaded.

This is the correct behavior. Actually, AJAX is implemented with javascript, which will be responsible for sending request asynchronously, update contents on the web form. And there are also a lot auxiliary methods and objects.

So, it's normal to see this.

Just pay attention to changing the debug mode to false in web.config before you are going to deploy your application.


I would like to know if this .js will be downloaded at each post in the page? For navigation between different pages that use Ajax technology .js will be downloaded several times? What I expected is that .js was to be downloaded only once. But my tests don't show this! Am I correct? Or I am loosing something Thank you Very Much

You need to set debug to false in web.config.

Linking two DropDowns via Atlas?

I have looked at the Atlas controls (January 2006 Release)

What i would like to know is, say i make a dropdown, place it in a
update panel, then link it all up to some datasource, add a trigger to
the page to populate the dropdown, e.g. a button (i get this going
np.)

Now what i would like to do is add a second dropdown and have it
update when i make a selection from the first dropdown, this i can not
get to work.

In the Atlas controls smart tag to add the triggers i only get to see
controls on the page which are not located within a updatepanel,

So i tried to just write then trigger manually, this produced no
visible error on the page, but the second dropdown is not populating
either?

Is this along the lines you are looking to do?

<atlas:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true" />

<atlas:UpdatePanel runat="server" ID="UpdatePanel1" Mode="Conditional" >
<ContentTemplate>
<asp:DropDownList ID="DropDownList1" runat="server" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged" AutoPostBack="True">
<asp:ListItem Text="foo" Value="foo" />
<asp:ListItem Text="bar" Value="bar" />
</asp:DropDownList>
</ContentTemplate>
</atlas:UpdatePanel>
<hr />
<atlas:UpdatePanel runat="server" ID="Computer" Mode="Conditional">
<Triggers>
<atlas:ControlEventTrigger ControlID="DropDownList1" EventName="SelectedIndexChanged" />
</Triggers>
<ContentTemplate>
<asp:DropDownList ID="DropDownList2" runat="server">
</asp:DropDownList>
</ContentTemplate>
</atlas:UpdatePanel>


No thats it exactly, but thank youBig Smile [:D]

Did you have to manually type the second trigger (to populate dropdown2)?

What i was wondering was,

Say you had a button, when pressed, it fired a trigger to populate the first Dropdown1 (Foo, Bar)

Then I wanted to be able to make a selection from the Dropdown1 and then get data to populate Dropdown2,

by running a SQL Query which took the selected item from Dropdown1 as a param.


Made a Typo sorry

I said in last post

No thats it exactly, but thank you

I mean

No thats not exactly it, but thank youWink [;)]


Sad [:(] Example, this does not update the second "Dropdown2", both controls are contained in the 1 UpdatePanel

<atlas:UpdatePanel runat="server" ID="UpdatePanel1" Mode="Conditional">
<ContentTemplate>
<asp:DropDownList ID="DropDownList1" runat="server" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged"
AutoPostBack="True">
<asp:ListItem Text="foo" Value="foo" />
<asp:ListItem Text="bar" Value="bar" />
</asp:DropDownList>
<asp:DropDownList ID="DropDownList2" runat="server">
</asp:DropDownList>
</ContentTemplate>
<Triggers>
<atlas:ControlEventTrigger ControlID="Button1" EventName="Click" />
<atlas:ControlEventTrigger ControlID="DropDownList1" EventName="SelectedIndexChanged" />
</Triggers>
</atlas:UpdatePanel>

Smile [:)] This example does, but you need to have 2 UpdatePanels

<atlas:UpdatePanel runat="server" ID="UpdatePanel1" Mode="Conditional">
<ContentTemplate>
<asp:DropDownList ID="DropDownList1" runat="server" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged"
AutoPostBack="True">
<asp:ListItem Text="foo" Value="foo" />
<asp:ListItem Text="bar" Value="bar" />
</asp:DropDownList>
</ContentTemplate>
<Triggers>
<atlas:ControlEventTrigger ControlID="Button1" EventName="Click" />
</Triggers>
</atlas:UpdatePanel>
<hr />
<atlas:UpdatePanel runat="server" ID="Computer" Mode="Conditional">
<Triggers>
<atlas:ControlEventTrigger ControlID="DropDownList1" EventName="SelectedIndexChanged" />
</Triggers>
<ContentTemplate>
<asp:DropDownList ID="DropDownList2" runat="server">
</asp:DropDownList>
</ContentTemplate>
</atlas:UpdatePanel>


in this example i have the script manager and updateprogress atlas controls on a master page, thus i gane share them around between different pages in the test site this has the button control out site which triggers the population of the dropdown1 control, then making a selection from the dropdown1 populates dropdown2 This is what i wanted to do in the first post i made.

Client side code:

<%@.PageLanguage="VB"MasterPageFile="~/MasterPage.master"AutoEventWireup="false"CodeFile="Default.aspx.vb"Inherits="_Default"title="Untitled Page" %>

<asp:ContentID="Content1"ContentPlaceHolderID="ContentPlaceHolder1"Runat="Server">

<div>

<asp:ButtonID="Button1"runat="server"Text="Button"/>

<atlas:UpdatePanelrunat="server"ID="UpdatePanel1"Mode="Conditional">

<ContentTemplate>

Dropdown 1

<asp:DropDownListID="DropDownList1"runat="server"OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged"

AutoPostBack="True">

<asp:ListItemText="foo"Value="foo"/>

<asp:ListItemText="bar"Value="bar"/>

</asp:DropDownList><br/>

Dropdown 2

<asp:DropDownListID="DropDownList2"runat="server">

</asp:DropDownList>

</ContentTemplate>

<Triggers>

<atlas:ControlEventTriggerControlID="Button1"EventName="Click"/>

<atlas:ControlEventTriggerControlID="DropDownList1"EventName="SelectedIndexChanged"/>

</Triggers>

</atlas:UpdatePanel>

</div>

</asp:Content>

Server Side code:

PartialClass _Default

Inherits System.Web.UI.Page

Dim dsAs Data.DataSet

Dim obsAs Data.DataTable

Dim defAs Data.DataTable

ProtectedSub Page_Load(ByVal senderAsObject,ByVal eAs System.EventArgs)HandlesMe.Load

ds =New Data.DataSet

obs =New Data.DataTable

def =New Data.DataTable

ds.ReadXml("url to my xml datasopurce here")

def = ds.Tables("data-def")

obs = ds.Tables("obs")

EndSub

ProtectedSub DropDownList1_SelectedIndexChanged(ByVal senderAsObject,ByVal eAs System.EventArgs)

Dim xmldocAsNew System.Xml.XmlDocument

xmldoc.LoadXml(ds.GetXml)

Dim obsAs System.Xml.XmlNodeList = xmldoc.SelectNodes("weather-observations/product/group/obs")

Dim xmlEAs System.Xml.XmlElement

ForEach xmlEIn obs

If xmlE.Attributes.Item(4).Value =Me.DropDownList1.SelectedItem.TextThen

Me.DropDownList2.Items.Clear()

Dim xmlEnumeratorAs IEnumerator

xmlEnumerator = xmlE.ChildNodes.GetEnumerator()

xmlEnumerator.Reset()

While xmlEnumerator.MoveNext

Dim eleAs System.Xml.XmlElement

ele = xmlEnumerator.Current

Me.DropDownList2.Items.Add(ele.Attributes.Item(0).Value &" : " & ele.FirstChild.Value)

EndWhile

EndIf

Next

EndSub

ProtectedSub Button1_Click(ByVal senderAsObject,ByVal eAs System.EventArgs)Handles Button1.Click

Me.DropDownList1.DataSource = obs

Me.DropDownList1.DataTextField ="station"

Me.DropDownList1.DataBind()

EndSub

EndClass


In the latest rev of Atlas, controls within the UpdatePanel should not require an explicit trigger as this is implied. If you want the UpdatePanel to refresh based on controls outside the UpdatePanel then the trigger is required. This therefore means that controls outside the UpdatePanel are traditionally post-back controls unless wired to triggers.The simplified example (#1) therefore should be OK without the DropDownList trigger. The Click handler of the button could be used to drive population of drop-down list 1. I'll try and work on a server binding sample for you.


Odd -- I was trying my own code (pretty much the exact code as above) and I get an "Unknown Error". I tried this code, and I get the same error. Its a pretty vague error, but any ideas as to where I should begin to look?

Thanks!


I checked this code ( the good one ) and put one breakpoint at first line in page load method. Every time I changed the option in the DropDownList and the application stopped on the breakpoint.

I don't know if this control (UpdatePanel ) works in this way or is something wrong in the code but I supossed that the panel is updated with an asynchronous server call. Could anybody explain me the functionality of the control?

Thanks.


The Code is Good But Doesnt Work ...

Please help ..

List controls not refreshing in UpdatePanels

I'm trying to figure out why when I click Remove on any listbox the postback doesn't refresh the listbox to show the change. I thought that every updatepanel refreshes. If this is so, then why isn't my listbox automatically reloading the updated list after I remove an item? I end up having to refresh the whole page manually in order to see any removed items from my listboxes

<%@dotnet.itags.org. Control Language="vb" AutoEventWireup="false" CodeBehind="Main.ascx.vb" Inherits="xxxx" %>

<asp:scriptmanager id="ScriptManager1" runat="server" />

<table class="medium" border="0" cellpadding="0" cellspacing="0" width="100%">

<tr style="padding-left 5px;">

<!-- Left Content Bucket -->

<td valign="top">

<table align="left" border="0" cellpadding="0" cellspacing="2" width="100%">

<tr>

<td height="20"></td>

</tr>

<tr>

<td class="tableHdrBlack" colspan="2">

<asp:label id="GeneralInformationHeader" runat="server" />

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="Program" runat="server" />

</td>

<td align="left" valign="top">

<asp:dropdownlist id="ddlPrograms" runat="server" width="300px" />

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="Cuent" runat="server" />

</td>

<td align="left" valign="top">

<asp:updatepanel id="CuentUpdatePanel" runat="server">

<contenttemplate>

<asp:listbox id="lbCuent" runat="server" width="214px" /><br />

</contenttemplate>

</asp:updatepanel>

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="ApdCs" runat="server" />

</td>

<asp:updatepanel id="ApdCsUpdatepanel" runat="server">

<contenttemplate>

<td align="left" valign="top">

<asp:listbox id="lbApdCs" runat="server" width="214px" /><br />

<asp:button id="btnAddApdCs" runat="server" width="63px" />

<asp:button id="btnRemoveApdCs" runat="server" width="83px" />

</td>

</tr>

<asp:panel id="pnlAddApdCs" runat="server" visible="false">

<tr>

<td>

</td>

<td>

<table>

<tr>

<td>

<asp:dropdownlist id="ddlAddApdCs" runat="server" width="90px" />

</td>

<td>

<asp:button id="btnInsertApdCs" runat="server" width="50px" />

</td>

</tr>

</table>

</td>

</tr>

</asp:panel>

</contenttemplate>

</asp:updatepanel>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="FtyMang" runat="server" />

</td>

<td align="left" valign="top">

<asp:listbox id="lbFtyMang" runat="server" width="214px" />

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="lHDee" runat="server" />

</td>

<td align="left" valign="top">

<asp:updatepanel id="HDee" runat="server">

<contenttemplate>

<asp:listbox id="lbHDee" runat="server" width="214px" /><br />

<asp:button id="btnAddHDee" runat="server" width="63px" />

<asp:button id="btnRemoveHDee" runat="server" width="83px" />

</contenttemplate>

</asp:updatepanel>

</td>

</tr>

<asp:panel id="pnlAddHDee" runat="server" visible="false">

<tr>

<td>

</td>

<td>

<table>

<tr>

<td>

<asp:dropdownlist id="ddlAddHDee" runat="server" width="90px" />

</td>

<td>

<asp:button id="btnInsertHDee" runat="server" width="50px" />

</td>

</tr>

</table>

</td>

</tr>

</asp:panel>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="Ces" runat="server"></asp:label>

</td>

<td align="left" valign="top">

<asp:updatepanel id="CesUpdatepanel" runat="server">

<contenttemplate>

<asp:listbox id="lbCes" runat="server" width="214px" /><br />

<asp:button id="btnAddCes" runat="server" width="63px" />

<asp:button id="btnRemoveCes" runat="server" width="83px" />

</contenttemplate>

</asp:updatepanel>

</td>

</tr>

<asp:panel id="pnlAddCes" runat="server" visible="false">

<tr>

<td>

</td>

<td>

<table>

<tr>

<td>

<asp:dropdownlist id="ddlAddCes" runat="server" width="90px" />

</td>

<td>

<asp:button id="btnInsertCes" runat="server" width="50px" />

</td>

</tr>

</table>

</td>

</tr>

</asp:panel>

</table>

</td>

<td width="10px"></td>

<!-- Right Content Bucket -->

<td valign="top">

<asp:updatepanel id="FtyUpdatePanel" runat="server">

<contenttemplate>

<table align="left" border="0" cellpadding="0" cellspacing="2" width="100%">

<tr>

<td height="20"></td>

</tr>

<tr>

<td colspan="3" class="tableHdrBlack">

<asp:label id="FtyHeader" runat="server" />

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="left" valign="top" colspan="3">

<asp:label id="RealName" runat="server" />

</td>

</tr>

<tr>

<td></td>

<td align="left" colspan="3">

<table align="left" border="0" cellpadding="0" cellspacing="2">

<tr>

<td>

<asp:label id="lblFirstName" runat="server" />

</td>

<td align="left">

<asp:textbox id="FirstName" runat="server" width="150px" />

</td>

<td>

<asp:label id="lblLastName" runat="server" />

</td>

<td align="left">

<asp:textbox id="LastName" runat="server" width="150px" />

</td>

</tr>

</table>

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="left" valign="top" colspan="3">

<asp:label id="Address" runat="server" />

</td>

</tr>

<tr>

<td></td>

<td align="left" colspan="3">

<table align="left" border="0" cellpadding="0" cellspacing="2">

<tr>

<td>

<asp:label id="lblFtyStreet" runat="server"></asp:label>

</td>

<td colspan="5">

<asp:textbox id="FtyStreet" runat="server" width="340px" />

</td>

</tr>

<tr>

<td align="right">

<asp:label id="lblFtyCity" runat="server"></asp:label>

</td>

<td width="20px">

<asp:textbox id="FtyCity" runat="server" width="100px" />

</td>

<td align="right" width="20px">

<asp:label id="lblFtyState" runat="server" />

</td>

<td>

<asp:dropdownlist id="FtyStateList" runat="server" width="50px" />

</td>

<td align="right">

<asp:label id="lblFtyZip" runat="server" />

</td>

<td align="right">

<asp:textbox id="FtyZip" runat="server" width="100px" />

</td>

</tr>

</table>

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr align="left">

<td></td>

<td align="left" colspan="3">

<table align="left" border="0" cellpadding="0" cellspacing="2">

<tr>

<td>

<asp:label id="Phone" runat="server" />

</td>

<td>

<asp:textbox id="AreaCode" runat="server" width="53px" />

-

<asp:textbox id="Prefix" runat="server" width="58px" />

-

<asp:textbox id="Suffix" runat="server" width="68px" />

</td>

</tr>

</table>

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="left" colspan="3" valign="top">

<asp:label id="Shipping" runat="server" />

</td>

</tr>

<tr>

<td>

</td>

<td align="left" colspan="3">

<table align="left" border="0" cellpadding="0" cellspacing="2">

<tr>

<td>

<asp:label id="lblShippingStreet" runat="server" />

</td>

<td colspan="5">

<asp:textbox id="ShippingStreet" runat="server" width="340px" />

</td>

</tr>

<tr>

<td align="right">

<asp:label id="lblShippingCity" runat="server" />

</td>

<td width="20px">

<asp:textbox id="ShippingCity" runat="server" width="126px" />

</td>

<td align="right" width="20px">

<asp:label id="lblShippingState" runat="server" />

</td>

<td>

<asp:dropdownlist id="ShippingStateList" runat="server" width="50px" />

</td>

<td align="right">

<asp:label id="lblShippingZip" runat="server" />

</td>

<td align="right">

<asp:textbox id="ShippingZip" runat="server" width="100px" />

</td>

</tr>

<tr>

<td height="10">

</td>

</tr><tr>

<td>

</td>

<td align="left">

<asp:button id="btnUpdateFPenalInfo" runat="server" width="60px" />

</td>

</tr>

</table>

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="left" class="tableHdrBlack" colspan="3">

<asp:label id="CouTauder" runat="server" />

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td colspan="4">

<table align="left" border="0" cellpadding="0" cellspacing="2">

<tr>

<td align="right" valign="top">

<asp:label id="LastCourse" runat="server" />

</td>

<td align="left" valign="top">

<asp:label id="LatSsionValue" runat="server"/>

</td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="LatSsion" runat="server" />

</td>

<td align="left" valign="top">

<asp:label id="LatSsionValue" runat="server" />

</td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="MisSeions" runat="server"/>

</td>

<td align="left">

<asp:label id="MisSeionsValue" runat="server" />

</td>

</tr>

<tr>

<td height="10">

</td>

</tr>

<tr>

<td align="left" valign="top">

<asp:label id="CourTt" runat="server" />

<br />

</td>

</tr>

<tr>

<td colspan="2">

<asp:gridview id="CourTtList" runat="server" />

</td>

</tr>

</table>

</td>

</tr>

</table>

</contenttemplate>

</asp:updatepanel>

</td>

</tr>

</table>

Hello,

How do you get the data into the listbox? Try this:
for example the list box inside this updatePanel

<asp:updatepanel id="CuentUpdatePanel" runat="server">
<contenttemplate>
<asp:listbox id="lbCuent" runat="server" width="214px" /><br />
</contenttemplate>
</asp:updatepanel>

After you click Remove, for sure you have to call a function right? In that function, also call: CuentUpdatePanel.Update()
This will update the UpdatePanel ... and if your list box uses a ObjectDataSource ... example below

<asp:updatepanel id="CuentUpdatePanel" runat="server">
<contenttemplate>
<asp:listbox id="lbCuent" runat="server" DataSourceID="GetListITems" width="214px" /><br />
</contenttemplate>
</asp:updatepanel>

then in your function, you do this: lbCuent.Databind();

Hope it helps ... by the way, next time don't bother post all of your HTML in here, too much, waste your time. =) just the part that you have problem is enough already ... and the code behind that is related to it ... Cheers


The problem is that I didn't rebind my listbox after whatever event (insert, delete, etc.)


I didn't even have to call the .Update() manually, it all works fine now after the obvious missing rebind of my listbox controls

List Search extender - activation on first load

Hi all,

I've encountered a probem with using the List Search Extender. These controls work fine during general use throughout my project (when the dropdown is selected by either clicking or tabbing on to the control).

However, on several pages I am seeking to set the focus to a dropdownlist which has an associated ListsearchExtender during the initial loading of the page. If I attempt to do this using simply:

Dropdown1.Focus()
or
 
ScriptManger.GetCurrent(Me.Page).SetFocus(Dropdown1)
 
.. I encounter a problem - the dropdown is focussed successfully but the listsearchextender is not activated - the user must click off the dropdown then re-select it.
 
I did find the following code useful:
 
 
function pageLoad() { var extender = $find('<%=lseCust.ClientID%>'); if (extender) { extender._handleFocus(); } }
 .. which I successfully activated the listsearch on page load. However, this also activates it across all postbacks, which is not appropriate.
 
Ideally, I would like to be able to "force" the listsearch to activate in all instances when the control is subject to focus, so I tried the following:
 
 
<script type="text/javascript">function ActivateListSearch() { var extender = $find('<%=Dropdown1.ClientID%>'); if (extender) { extender._handleFocus(); } } </script>Page_Load(ByVal sender as object,ByVal e as System.EventArgs)Handles Me.Load
 Dropdown1.Attributes.Add("onfocus","ActivateCustListSearch()")End Sub
 
.. but this doesn't activate the list search during the first page load (no error is encountered), although the listsearch is operational when the user clicks or tabs onto the dropdown.
 
Has anyone else encountered this issue or found a workaround for it? 
 

Hi,

I think you can use the second parameter of pageLoad method to determine if it's a partialPostback.

For instance:

function pageLoad(sender, args) {
if(args.get_isPartialLoad ()) return;
var extender = $find('<%=lseCust.ClientID%>');

if (extender)
{
extender._handleFocus();
}
}


Listbox Client Controls?

I noticed that there's not a lot of support for listboxes on the client side. There's only the Web.UI.Select object, but it's pretty sparse in terms of functionality (ie. no clear or add methods).

Also haven't seen any examples of DataBinding a listbox - all the sample seem to work on ListView controls and binding to individual label elements, which isn't quite possible with lists.

Anybody have an example on how to bind a list using ATLAS declarative or script code?

+++ Rick --

Hi,

here's an example of a Web.UI.Select control bound to a DataTable. Hope it helps.

<%@. Page Language="C#" %>
<%@. Import Namespace="System.Data" %>
<%@. Import Namespace="System.Web.Services" %
<script runat="server">
[WebMethod]
public DataTable GetDummyDataTable()
{
DataTable dt = new DataTable();
dt.Columns.Add(new DataColumn("ID", typeof(int)));
dt.Columns.Add(new DataColumn("Name", typeof(String)));
dt.Columns.Add(new DataColumn("LastName", typeof(String)));

dt.Rows.Add(1, "John", "Doe");
dt.Rows.Add(2, "John", "Smith");

return dt;
}
</script
<!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>ListBox Databinding Example</title>
</head>
<body>
<form id="form1" runat="server">

<atlas:ScriptManager ID="sm" runat="server" />

<div>
<select id="myListBox"></select>
</div>
<div>
<span>Selected Value is </span>
<span id="myLabel"></span>
</div>
</form>
<script type="text/javascript">
function populateList() {
PageMethods.GetDummyDataTable(onGetComplete);
}
function onGetComplete(result) {
var myListBox = Web.Application.findObject('myListBox');

myListBox.set_data(result);
}
</script>
<script type="text/xml-script">
<page>
<components>
<select id="myListBox"
textProperty="LastName"
valueProperty="ID"
firstItemText="Make Your Selection"
/>

<label id="myLabel">
<bindings>
<binding dataContext="myListBox"
dataPath="selectedValue"
property="text"
/>
</bindings>
</label>

<application load="populateList" />
</components>
</page>
</script>
</body>
</html>

Thanks Garbin - fantastic!

Your example and some comments from other post have helped me see more of Atlas outside of the server controls.

Monday, March 26, 2012

Listeners Broadcast in Javascript/ Atlas Library

Is there a framework in place for a Atlas JS Control to raise an eventwhich can have other Controls or global functions listen in on andhandle?

Just like in Web User Control, we can raise Events which can be handledby pages or other controls that 'listens' in on the event, can the samebe accomlished in JS?

The Web User Control shouldnt know who has registered to listen in onthe event but somehow the Control has to communicate that something hashappened.Would any of the below code help in what I want to accomplish?Basically different components can listen in or another componentsevents, and when that event is raised, each of the listeners methodsare invoked?


Type.createEnum('Sys.ActionSequence','BeforeEventHandler', 0,'AfterEventHandler', 1);
Sys.IAction = function() {
this.get_sequence = Function.abstractMethod;
this.execute = Function.abstractMethod;
this.setOwner = Function.abstractMethod;
}
Sys.IAction.registerInterface('Sys.IAction');

Type.Event = function(owner, autoInvoke) {
var _owner = owner;
var _handlers =null;
var _actions =null;
var _autoInvoke = autoInvoke;
var _invoked =false;

this.get_autoInvoke = function() {
return _autoInvoke;
}

this._getActions = function() {
if (_actions && _actions.length && !_owner)throw"Actions are only supported on events that have an owner.";
if (_actions ==null) {
_actions = [];
}
return _actions;
}
this._getHandlers = function() {
if (_handlers ==null) {
_handlers = [];
}
return _handlers;
}
this._getOwner = function() {
return _owner;
}

this.isActive = function() {
return ((_handlers !=null) && (_handlers.length != 0)) ||
((_actions !=null) && (_actions.length != 0));
}

this.get_isInvoked = function() {
return _invoked;
}

this.dispose = function() {
if (_handlers) {
for (var h = _handlers.length - 1; h >= 0; h--) {
_handlers[h] =null;
}
_handlers =null;
}
if (_actions) {
for (var i = _actions.length - 1; i >= 0; i--) {
_actions[i].dispose();
}
_actions =null;
}

_owner =null;
}

this._setInvoked = function(value) {
_invoked =true;
}
}
Type.Event.registerSealedClass('Type.Event',null, Sys.IDisposable);

Type.Event.prototype.add = function(handler) {
this._getHandlers().add(handler);
if (this.get_autoInvoke() &&this.get_isInvoked()) {
handler(this._getOwner(),null);
}
}
Type.Event.prototype.addAction = function(action) {
action.setOwner(this._getOwner());
this._getActions().add(action);
}
Type.Event.prototype.remove = function(handler) {
this._getHandlers().remove(handler);
}
Type.Event.prototype.removeAction = function(action) {
action.dispose();
this._getActions().remove(action);
}
Type.Event.prototype.invoke = function(sender, eventArgs) {
if (this.isActive()) {
var actions =this._getActions();
var handlers =this._getHandlers();
var hasPostActions =false;
var i;

for (i = 0; i < actions.length; i++) {
if (actions[i].get_sequence() == Sys.ActionSequence.BeforeEventHandler) {
actions[i].execute(sender, eventArgs);
}
else {
hasPostActions =true;
}
}

for (i = 0; i < handlers.length; i++) {
handlers[i](sender, eventArgs);
}

if (hasPostActions) {
for (i = 0; i < actions.length; i++) {
if (actions[i].get_sequence() == Sys.ActionSequence.AfterEventHandler) {
actions[i].execute(sender, eventArgs);
}
}
}

this._setInvoked();
}
}


Sorry for the message, I forgot to check the Atlas Client sidereference library where it has a nice page on this:http://atlas.asp.net/docs/Client/Type/Event/default.aspx

but anyone with more concrete examples would be much appreciated :)
Hi,

the Atlas framework gives you the ability to declare multiple handlers for an event. Just use the add() method on the exposed event to add a handler.

For example, if the instance myObject exposes a myevent event, you can write a statement like:

myObject.myevent.add(myMethod);

to register a handler for that event.
Thanks for your response Garbin (+ props to your weblog)

Looking at your pager example:

// Events.
// The Pager exposes the pageChanged event, which is raised
// when the page index to be displayed changes.
this.pageChanged =this.createEvent();
...

Which exposes a pageChanged property where I can pass in one method on the initialization of the Atlas Control.

td.addEvent('pageChanged',true);

...

The event is raised by:

this.pageChanged.invoke(this,new AtlasNotes.PagerEventArgs(_pageIndex, _pageSize, _totalRecords));

so going by your post, I can append more methods to be handled by going:

myObject.pageChanged.add(myMethod);

If so, Ill try it on Monday :D


The above code works beautifully :)

ListSearchExtender AutoPostback not firing

We have a few list boxes that do an auto post back. When I extend the controls with the ListSearchExtender, the search works, but i can only get the autopostback to fire if I scroll down and click what I want. If i type what i want till it is selected and then tab away, hit enter, or click that item, the autopoastback does not work.

The dropdowns are in a wizard control and the wizard is in an update panel if that makes a difference.

Is this expected behaviour or am I missing something?

Other than that this is a really good new tool in the toolkit.

Hi, I am having the same problem. Here is an example of my controls. The autopostback is not firing. Any help would be appreciated:

<asp:TableCell>
<asp:DropDownListID="ddlConsumer"AutoPostBack="True"CssClass="DropDownLists"runat="server" />
<asp:RequiredFieldValidatorID="valConsumer"ControlToValidate="ddlConsumer"ValidationGroup="Header"Text="*"runat="server"ErrorMessage="Consumer required"CssClass="ErrorMessages" />
<ajaxToolkit:ListSearchExtenderID="lseConsumer"TargetControlID="ddlConsumer"PromptPosition="Top"PromptCssClass="ListSearchExtenderPrompt"runat="server"/>
</asp:TableCell>


There is a workitem related to this issue -- please vote if you are affected by it:

http://www.codeplex.com/AtlasControlToolkit/WorkItem/View.aspx?WorkItemId=8744

I'm guessing you wouldn't want/expect the auto-postback to fire every time an item is selected as you do an incremental search ... I presume you'd want it to fire just when you tabbed away from the ListBox -- or perhaps when you hit enter?

Thanks,

Damian


Yes onBlur or when enter button is pressed.

Thanks, will vote.


I was affected by this as well, but I implemented the following workaround. I hope that this works for you guys:

Basically, I created a client side js method called RaisePostBack that asks for a control reference.
<script type="text/javascript">
<!--
// This function is called by the AJAX List Extender control. It's just an easy way to raise a post
// back event from the client-side. This is only needed because there are child controls that are
// dependent on the requester's selected data in order to retrieve the correct data
function RaisePostBack(Control)
{
// First we need to make sure that the postback event doesn't fire when the value is blank
if(Control.value != "")
{
// Call the postback event
__doPostBack("", "");
}
}
//--></script>

As you can see there is a method being called __doPostBack("", "") which does the magic needed to emulate AutoPostBack="True" on the control itself. I also added the initial check for the value because I'm calling this method onBlur of the control and do not want to have it executed if the user is just tabbing thru the controls. I would also recommend adding an isDirty method possibly.

Here is what I added to my dropdownlist controls:
<asp:DropDownList ID="FacilityDropDownList" runat="server" AutoPostBack="True"onBlur="RaisePostBack(this)" onChange="RaisePostBack(this)">
</asp:DropDownList>
<AjaxToolkit:ListSearchExtender ID="FacilityListSearchExtender" runat="server" TargetControlID="FacilityDropDownList" PromptText=" ">
</AjaxToolkit:ListSearchExtender>

Good luck and happy coding.


This link indicates the fix has been released with version10606 of the Ajax Control Toolkit. I downloaded and installed this, as well as version 10618, but the postback by the DropDownList is still not getting fired.

Am I missing something, is there still a problem, or what? Should I try one of the work-arounds posting in this thread?

Thanks so much for any assistance.

Dan


Hi Dan,

It fires when you leave the ListBox or hit Enter -- there is a method you can call to have it fire the OnChange as soon as a change is made.

Can you let me know if this is the behavior you are seeing?

Thanks,

Damian


I tried hitting enter and also leaving the field with the tab key. moving focus to another textbox on the page. The SelectedIndexChanged did not fire in either case.

Thanks.

Dan


Is it possible that the previous installation of the Ajax Control Toolkit is in play even though I installed the later version? Is there anything in the GAC, for example, that might be messing things up? Is it possible to uninstall before installing the later version?

Thanks.

Dan


An old version of the toolkit is the most likely explanation, however the toolkit isn't loaded into the GAC (the ASP.NET AJAX assemblies are though). Could you double-check the toolkit assembly reference in your solution to ensure that it is pointing to the new toolkit?

Thanks,

Damian


Thank you for the post. This code does work. However, when I implemented it on my page, the postback now makes the entire page refresh, overriding the updatepanel control, which is the original reason I started using Ajax in the first place, to make a client style web application.

Please don't take this as a criticism. I just wanted to post the results I had using this solution, possibly saving someone else a few minutes if they don't want this behavior.


That was the problem. My project was still using an older AjaxControlToolkit.dll. I replaced it w/ the version from 10618 and now it works fine.

Thanks for all your help.

Dan


This was my problem as well. I just downloaded Ajax from the asp.net website. The default download link points you to version 1.0.10301.0. Maybe I'm blind or dense, but I did not see any options for a newer version until I found the previous post. Perhaps if someone from asp.net is monitoring this forum, they could get that link updated to point to the most recent version. Just a thought.

ListSearchExtender error - System.InvalidOperationException: Extender controls may not be

I created a custom web control (ListSearchControl) using the ListBox and ListSearchExtender control. I added this control to another custom control which is dynamically added to a page. The page ahs a ScriptManager tag before any other controls and inside Form tag. The control works fine on page laod, but gives an error on post back - "System.InvalidOperationException: Extender controls may not be registered after PreRender".

I tried using the same custom control((ListSearchControl) adding it to the page directly and it works fine even on postback.

Is there any way to get out of the error in the first case, or is there a known problem with using Control toolkit extenders being added dynamically on the page?

Hi,

Please try the workaround in this thread : http://forums.asp.net/t/1160803.aspx

Nai-Dong Jin - MSFT:

Hi,

From your description, it seems that while you are usingASP.NET AJAX Toolkit with your controls, you'll get a message whichsays "Extender controls may not be registered after PreRender", right?

For this kind of issue, one workaround is to call the baseOnPreRender method before declaring your controls while overriding theOnPreRender method on the page where you had the new extender control.See the following code snippet:

protected override void OnPreRender(EventArgs e)
{
// add base.OnPreRender(e); at the beginning of the method.
base.OnPreRender(e);

// codes to handle with your controls.
...


}

Also, there's a good sample on how to create an ASP.NET AJAX Toolkit Extender Control to Extend an standard control. See,
http://weblogs.asp.net/dwahlin/archive/2007/08/08/creating-an-asp-net-ajax-toolkit-extender-control.aspx

ListView / ItemView

Hi,

I wonder what happened to these controls.
If I take a look at thedocumentation I don't see them nor the Sys.UI.Data namespace where I believe they could be found in. Did that namespace and the underlying "controls" dissapear in favour of something else?

Also I heard at TechEd 2006 Barcelona that xml-script is likely to dissapear. Anyone knows what's going on about these?

Grz, Kris.

hello.

the las ttime i've looked, they were in the future bits, in the Sys.Preview.UI.Data namespace. xml-script is still there too, with lots of improvements when compared with the previous versions. i hope that, with time, they do add these features to the core bits...

So that's probably why I didn't find any documentation about it. Too bad. And yes I hope some of the CTP stuff gets into the Extensions pack as well.

Actually, which reflection tool do you use to take a peek into those namespaces?

Grz, Kris.


hello.

well, if you're speaking about the client side, then i don't use any. i just opne the js file a read it when i need something...

Hi,

you could check thisJavascript Class Browser byEilon Lipton. You should be able to browse also the types in the Futures CTP.


hello guys!

well, but you really don't want to loose the thrill of going through lines and lines of javscript, right?

Luis Abreu:

well, but you really don't want to loose the thrill of going through lines and lines of javscript, right?

No, I don't mind but first I need to get a better grasp of the Microsoft AJAX specific code. Yesterday I already did make a mistake with the $addHandler instead of add_EventName for which I apparently made the mistake to think that I should be using $addHandler. So first the basic steps before I can run. Thanks for all the help guys, really appreciate it.

Grz, Kris.


hello.

well, currently i think that there are one or two problems with the $addHandler (for instance, it doesn't work when you try to handle and event form a control maintained in another frame). however, i do believe that you should be using it in order to get browser independence error handling.

Saturday, March 24, 2012

Load ascx in other Page using Ajax

I have one application, which has one Home.aspx, Head.Ascx and Footer.Ascx, Head.aspx has two button, And all controls of head.ascx and footer.ascx in ajax panel, now in home page when i click on one button then i want to load head.ascx in my Home page and if i click on second button then i want to load footer.aspx in Home page and unload Head.ascx. I am using ajax in my application. But not enable to solve this.

Thanks

Hi,

Here is an example made according to your requirement:

<%@. Page Language="C#" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><script runat="server"> protected void btnHeader_Click(object sender, EventArgs e) { ViewState["show"] = "h"; } protected void btnFooter_Click(object sender, EventArgs e) { ViewState["show"] = "f"; } protected void Page_PreRender(object sender, EventArgs e) { if (ViewState["show"] != null) { string show = ViewState["show"].ToString(); if (show == "h") { Control ctrl = this.LoadControl("Header.ascx"); PlaceHolder1.Controls.Add(ctrl); } else { Control ctrl = this.LoadControl("Footer.ascx"); PlaceHolder1.Controls.Add(ctrl); } } }</script><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>Untitled Page</title></head><body> <form id="form1" runat="server"> <div> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> <asp:Button ID="btnHeader" runat="server" Text="Show Header" onclick="btnHeader_Click" /> <asp:Button ID="btnFooter" runat="server" Text="Show Footer" onclick="btnFooter_Click" /> <asp:Button ID="Button3" runat="server" Text="Another Button" /> <asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder> </ContentTemplate> </asp:UpdatePanel> </div> </form></body></html>

Thanks Raymond Wen , it solved

Load data into server controls

I am using Atlas to get a list of Serial numbers from a database as the user types in part of the serial number. It works great. Now I want to be able to populate other textbox controls on the form as the user types in that serial number. Is this possible using Atlas? I know I could put a button next to the serial number so when they get the serial number they are looking for they could submit the form and I could do a "SELECT * FROM inv_assets WHERE sserial_num = txtSerialNum.Text, but this would cause the page to refresh and I would really like to somehow populate the rest of the form as the user types in the serial number.

perhaps using a placeholder into an updatepanel.

Load in-line javascript functions after UpdatePanel refresh

I have a lot of user controls that have in-line javascript functions specific to the content of the user control, validations and automated reactions. This javascript is written mostly by client side developers. Is there any way to allow them to keep writting their in-line javascript on the user controls, but still have that javascript be active after an updatepanel conditionally makes the user control visible? For example imagine a page with a button and the user control. The user control is in an update panel tiggered by the button click. When clicked the user control has its visibility set to true and the user interacts with the newly visible controls contained within. Because the user control was initially in an update panel, the original page source does not contain the in-line javascript functions so they are never evaluated by the browser. In order to keep the client side group's functionali i've had to recreate the client side code on the server side by building a large string that references controls using the control.ClientID property (just like the client side group does with inline scriplets $get(<%= control.ClientId %>) and then registering this string on the page with ScriptManager. This is too inefficient a process and having the javascript placed on every page that uses the user control seems counter productive with regard to user controls. Placing all the javascript in external files that get loaded by ScriptManager is also not an option as the javascript is often control specfic. Is there no way to get the browser to recognise the in-line javascript after an update panel loads it? Is this something that is planned for the future if not?

Well, I don't know if it is the final solution, but I figured that I could use display:none and display:block on a panel wrapping the user control instead of using the Visible property on the control itself. This way the control (and most importantly the javascript) is initially rendered, but not browser visible. If there is still some way to use the built in Visible property to do what I want, please let me know. I like that the inital page load using the Visible property doesn't have the extra weight of controls that are not usuable.


You can give this approach a try:http://blogs.msdn.com/sburke/archive/2007/06/13/how-to-make-tab-control-panels-load-on-demand.aspx

-Damien


I believe that approach will suffer from the same issue. The tabcontainer content will not be initially visible and so any inline javascript contained in a tabcontainer will not be evaluated by the browser.


Sorry about that I miss read your question. If the JS is embedded in the usercontrols they need to be loaded, so your solution works. I'm a bit confused why you need the JS loaded if they are control specific. Sounds like there may be a design problem with your solution.

-Damien

Wednesday, March 21, 2012

Load User Control into Modal Popup

Hi

New to .net / ajax etc but have had some joy and got several bits working.

I am looking for an example of how to load user controls into modal popup, for example, I have two buttons, 1 will load user control1, and button2 will load user control2 into modal popup.

Many thanks for help.

Richard.

An approach for this is to use an UpdatePanel inside the ModalPopup, seehttp://blogs.technet.com/kirtid/archive/2007/05/03/using-updatepanels-with-modalpopups.aspx and then you can load the User Control into the UpdatePanel:http://geekswithblogs.net/rashid/archive/2007/08/11/Loading-UserControl-Dynamically-in-UpdatePanel.aspx

-Damien

LoadControl and UpdatePanel

hi all,

I am having problems with server controls placed inside an UpdatePanel. they are placed in an acsx (web control) and I am loading them (following instructions encoded in an XML) using LoadControl. but, the inside controls are null.

I am quite sure I've got the page lifecycle messed up somehow. here's a detailed description of what I am doing:

I have got a web control named Canvas (as it is supposed to hold other controls, as well as other Canvases). it has got an UpdatePanel with a PlaceHolder in the ContentTemplate.

I have embedded one Canvas (obviously called Root) in my aspx page, which has the ScriptManager in it.

in the Page_Load event of the original aspx page (I tried Page_PreInit as well, doesn't work) I am dynamically creating other Canvases (by LoadControl) and adding it in my PlaceHolder. I have a method that takes an XML and I am calling that method. it works fine for the root.

however, after I have loaded my control, I call the XML accepting method (with a child XML node) of the newly created control. this is where it gets stuck with a null exception. so it's right after the LoadControl call.

I hope I haven't made a trivial mistake. I removed my UpdatePanel and it works just fine. so it can't be terribly wrong! I am using the January CTP.

cheers.

help! somebody? anybody?

I had the same issue and I just resolved it. You need to add an ID to your control... then it will persist on postbacks. That's all you do (and always create the control in the page_load event). Here's my code and it works like a champ and I'm using MS's AJAX panels as well.

i'm placing a unique control on the page based on the tab they are on but you could just add a single control here as well. Don't worry about the LoadData, those are just methods that load my data into the controls.

Good luck!

protected void Page_Load(object sender, EventArgs e) { LoadPageViewData(radCategoryTabStrip.SelectedIndex); }
private void LoadPageViewData(int index) {//-- clear out the controls pageDynamic.Controls.Clear();string guid = String.Empty;if (lblDetailData.Attributes["GUID"] !=null) { guid = lblDetailData.Attributes["GUID"].ToString(); }switch (index) {case 0://-- create the control CustomControls_Group_Edit oCtrlGroupItemEdit = (CustomControls_Group_Edit)LoadControl("~/CustomControls/Group/Edit.ascx");//new CustomControls_Group_Edit(); //-- wire up the event handler, this way we'll get notified when the control //-- save's it's data and we can update the tree on this page. oCtrlGroupItemEdit.GroupItemSaved +=new EventHandler(itemSaved);//-- give it an id, that way the page_load event will know to rebind it //-- to the same instance on postbacks and persist the data //-- (read an article about it and it works) oCtrlGroupItemEdit.ID ="GroupEdit1";//-- add the control to the page before we invoke the first method multiPage.PageViews[0].Controls.Add(oCtrlGroupItemEdit);//-- load the data oCtrlGroupItemEdit.LoadData(guid);break;case 1://-- not doing any custom events for this one, so just load the control CustomControls_Groupings_ProductList oCtrlProductList = (CustomControls_Groupings_ProductList)LoadControl("~/CustomControls/Groupings/ProductList.ascx");//-- add the control the page before we invoke the first method oCtrlProductList.ID ="ProductList1"; pageDynamic.Controls.Add(oCtrlProductList);//-- this must be called after it's added to the control collection (not before or it will fail) oCtrlProductList.LoadData(guid);break;case 2:break;case 3:break; }//-- make sure this control is selected pageDynamic.Selected =true;//-- either works: multiPage.PageViews[0].Selected = true; //-- update the ajax panel updatePanelCategoryInfo.Update(); }

loading a page is taking too long

Hello.. On a page in a AjaxEnabledWebApplication I have 3 server controls (asp:ScriptManager, asp:Timer, asp:UpdatePanel) and some HTML controls(some inputs). Sometimes, when IIS loads the page, the loading works fine(max 1 second)... but sometimes it`s taking a couple of minutes. Everything is on localhost and I don`t have any database connections.

Can someone help me?

thanks

One more specification... This happens only I run the application from Visual Studio 2005(F5). If I run the application from a browser, everything works great.

Thanks


ASP.NET AJAX at the first time when you run your project in degug(F5) may take a few extra time becose the deguge mode is true.when you publish your website specifydebug="false" in web.config file .or try debug = false ,you will see it faster.

Regards.


I think I`ve tricked him... I set the IIS as the development server(from project proprietes... not the one from Visual Studio..) and now works great...

Loading Async User Controls

I have a web page with multiple user controls which causes my page to load slowly. I've been trying to upgrade the page so that the main parts of the page loads then each user control loads seperatly in an async manner similar to what the mighty pageflakes.com does. I've been search for example on how to do this for the past 3 days, and keep coming up with nothing. Can somebody please point me into a direction or give me an example on how I can load my main page, then load each control in an async manner?

Thanks,
Brandon W.

Look at the AJAX frameworkhere. It'll be a lot easier if you're using web services to feed your data directly to the user controls, but you should be able to leverage the AJAX stuff to get the behavior you want.

Loading controls async

I have a control on the frontpage of my site that takes a long time to load, so I want the page to load normally, and then start loading the control asynchronously, so the user will be able to skip to another page if he doesnt want to see the control.

Is there anyway to accomplish this?

Tried with the updatepanel and a timer, and it executes fine, but I'm unable to stop the timer after it does the first Tick event.

The server side timer control has a bug that it cannot be stopped. There are few option like the one suggested in this thread.

http://forums.asp.net/thread/1282319.aspx

Alternatively, you can just trigger the load of control in after Atlas finishes loading.


Rama Krishna:

Alternatively, you can just trigger the load of control in after Atlas finishes loading.

How would I do that?

Loading Controls using an update panel

I'm currently trying to load controls onto the page dynamically and I was trying to use the UpdatePanel so that the controls could load w/o the page refreshing but I'm running into a problem with that. When I click the button that loads the control, it forces a refresh. How do i fix that?

here's the code

<%

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

<!

DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.1//EN""http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<

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

<

headrunat="server"><title>Untitled Page</title>

</

head>

<

body><formid="form1"runat="server"><atlas:ScriptManagerID="ScriptManager1"runat="server"/><asp:ButtonID="btnControl1"runat="server"Text="Load Control 1"CausesValidation="False"OnClick="btnControl1_Click"/><asp:ButtonID="btnControl2"runat="server"Text="Load Control 2"CausesValidation="False"OnClick="btnControl2_Click"/><atlas:UpdatePanelID="udpPanel"runat="server"><ContentTemplate><div><asp:PlaceHolderID="PlaceHolder1"runat="server"></asp:PlaceHolder></div></ContentTemplate><Triggers><atlas:ControlEventTriggerControlID="btnControl1"EventName="Click"/><atlas:ControlEventTriggerControlID="btnControl2"EventName="Click"/></Triggers></atlas:UpdatePanel></form><scripttype="text/xml-script">

<page xmlns:script=

"http://schemas.microsoft.com/xml-script/2005">

<references>

</references>

<components>

</components>

</page>

</script>

</

body>

</

html>

ASPX.cs

using

System;

using

System.Data;

using

System.Configuration;

using

System.Web;

using

System.Web.Security;

using

System.Web.UI;

using

System.Web.UI.WebControls;

using

System.Web.UI.WebControls.WebParts;

using

System.Web.UI.HtmlControls;

public

partialclass_Default : System.Web.UI.Page

{

protectedvoid Page_Load(object sender,EventArgs e)

{

}

protectedvoid btnControl1_Click(object sender,EventArgs e)

{

this.PlaceHolder1.Controls.Add(Page.LoadControl("~/Control1.ascx"));

}

protectedvoid btnControl2_Click(object sender,EventArgs e)

{

this.PlaceHolder1.Controls.Add(Page.LoadControl("~/Control2.ascx"));

}

}

Hi,

it seems that your aren't setting EnablePartialRendering="True" on the ScriptManager control.
I enabled that and I still couldn't get it to work. Any other suggestions?
I fixed it. I'm not quite sure what I did but it works lol.

Loading Controls usning Ajax after loading the main page

I saw this technique on some pages. The point is that my page is loading very slow due to many user controls on it. Would it be possible to load the page first without the user controls and than load the controls, maybe via Ajax invocation (Update Progress). Any idea how to acomplish this? Any samples?

See this

http://mattberseth.com/blog/2007/06/aspnet_ajax_canceling_an_async_1.html


That is not what I was looking for. This is the INITIAL load page process I am talking about. I want to load the whole page first, but without the controls (those take long to load). After the page loads, I want to automaticly execute loading of controls in Ajax manner (with Update Progress)...


I'm interested in hearing options for something of this kind as well.

For my situation, Im communicating to a workflow, which feeds me a collection of controls to be rendered on the page. However, I can not get the collection until an event is handled from the workflow. At present, this means I have to make two round trips for the whole page in order to render the controls handed to the page.

I have attempted triggering a partial page update, but with out any luck in getting the controls to render.


Hi,

This is what you need:Start callback immediately after page loaded

For more information about this topic,seeDelaying Content Load using Timer and UpdatePanel ANDControlling visibility of contents of collapsiblepanel

Best Regards,


Thanks a lot! This is exactly what I was looking for! I like the solution with Update Panel and Timer, as it seems the most "clean" for me:http://smarx.com/posts/delayed-load-with-an-updatepanel.aspx

I will send you the link to the page once I done coding. Excellent!


Ok, I have implemented this on my websitewww.zikbay,com. It is loading Featured panel data as delayed using Ajax Timer technique. I have realized also more use for the Ajax Timer control :)

I have also realized there is no point in having modal progress dialog. It is as good as the old Postback, just little faster and looks much nicer. But the user still losses the possibility to interact with the page when the data is loading... I guess that was the reason why ASP>NET AJAX team removed it after Beta:) I was always wondering why would they remove it. I gues they did not want people to start using it by default:)


Delayed is not working correctly if I place it on my master page (for the location control) and than run search page (with grid). I think this has something to do with this mix: AjaxTimer (master)+Updates Panel (master + search page)+ Griodview...

This is the message I am getting:

"Too many users connected to server"


Thanks for providing linkSmile

It will really helpful to me & other people


So do you guys think it makes sense to use modal update progress? I see they use it on codeplex all over? Yet for example google is not using it... I thought to use it maybe little against the whole Ajax idea of allowing the user to interact while the page is loading. wonder what your opinions are on this one...