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.

ListSearch Tab or enter key event?

Hello,

I'm pretty new to Ajax and Aps.net so hopefully this question can easily be answered.

I have a ListSearch that extends a dropdownlist. When a user types for the list search, the correct item is chosen but I also want the dropdownlist to fire an event, preferably SelectedIndexChanged, if the user clicks the key Tab or enter. Right now a tab shows the correct item when a Tab is clicked but no event is fired. The SelectedIndexChanged event fires when a user clicks changes a GridView. I want the grid view to also change when the tab or enter key is pressed when using the ListSearch Any Ideas?

thanks for the help.

We have anissue tracking the selectedindex change event. If the tab key is hit when the focus is in the listbox should cause the onblur event to fire and you can hook into that. See thisbug for the enter/tab autopostback issue. You could update it with your scenario as well to make sure that the fix is covers it.

I'm running into the same problem as you guys are. I love how ListSearch Ajax works, but can't use it because it doesn't fire an event for the dropdownlist or manage the tab index.

In the meantime, I found this add-on tool that does what I'm looking for. Of course, it comes with a price. :-(

Go check out the "Contact Information" section.

http://samples.asplib.net/AspLibSamples/ComboBox.aspx

Load On-demand using PopupControlExtender

Hi-

I am displaying a Panel that contains a web usercontrol using PopupControlExtender in AJAXToolKit. Since the web usercontrol has pretty expensive database task, I would like to display the Panel only when a user clicked on a link that displays the PopupControlExtender.

Is there a way to accomplish this? Please advice.

Regards,

Prabhu

Hi Prabhu,

According to my understanding to your question, you plan to load contents of a popup dynamically via asynchronous request.

Here isa thread that implement dynamical loading with TabContainer extender, you may try the same solution. The only difference is that you may need to invoke the method that fetches data in popup showing event handler. For instance:

<ajaxToolkit:PopupControlExtender ID="PopupControlExtender2" runat="server"BehaviorID="pce" ......... />
function pageLoad(sender, args)
{
$find("pce")._popupBehavior.add_showing(onPopupShow);

}

function onPopupShow(sender, args)
{
// get data dynamically here
}

Hope this helps.

Load UserControl After PageLoad is completed

I'm still pretty new to the ajax / javascript scene, so I'm finding myself stumped on what may be a very simple thing. If anybody can point me in the right direction, I will be very grateful.

What I have is this:

I have a user control that has an update panel wrapped around a listview control that gets data from a data source.

I have a page that has the user control on it.

What I want to happen is for the page to load then the user control to go get its data and refresh the listview. Something like pageflakes. Where the page loads while the widgets are updating themselves, except in this case it will be a user control updating.

Is this possible? If so, can somebody point me in the right direction?

Thanks in advance!!

Kendra

http://mattberseth.com/blog/2007/07/delay_load_an_updatepanel.html

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

Thank you thank you thank you... i have read tons of Matt's articles and hadn't run across this one yet. Of course, using the right search term helps as well.