Vertical tabs

What's the best method these days for creating vertical tabs? I currently use the toolkit's tab control for my horizontal tabs but I want to put it in another tabcontainer that has vertical tabs (kinda like an old style TV set with channels as buttons). How are people doing this these days? Doesn't look like the AJAX tab control can be made into vertical tabs and after googling around I didn't see anything that jumped out at me.

Thoughts?

Thanks!

Craig

Hi Craig,

Currently, there isn't a easy way to customize the tab control to show tabs vertically. But I don't think is quite difficult to implement your own one.

1. You may place several buttons vertically on the page.

2. Add some panels with corresponding content in them

3. Add javascript to control the visibility of these panels within the client side click handler of buttons

Very confused about state in my behavior-derived class

I am writing a very simple custom control extender as a first step towards building something slightly more complex. The intention of the extender at this point is just to make a panel visible in the onmouseover event of the target control. The code below is the javascript file that is registered with the control. What I'm finding is that the property I create called _panelId is set properly when the class is initialized (I can tell by the alert box I put in set method), but the property shows up as undefined when the handler for the onmouseover event fires (once again I tested this with an alert box). It's as though the class doesn't know its own properties when it gets to the _onMouseOver function.

My appologies if I'm missing something stupid, but I've been looking at this code all afternoon and can't figure it out...

Type.registerNamespace('Ballito');Ballito.HoverPanelBehavior = function(element) { Ballito.HoverPanelBehavior.initializeBase(this, [element]);// Propertiesthis._panelId =null;// Eventsthis._onmouseoverHandler =null;this._onmouseoutHandler =null;}Ballito.HoverPanelBehavior.prototype = { initialize : function() { Ballito.HoverPanelBehavior.callBaseMethod(this,'initialize');this._onmouseoverHandler = Function.createDelegate(this,this._onMouseOver);this._onmouseoutHandler = Function.createDelegate(this,this._onMouseOut); $addHandler(this.get_element(),'mouseover',this._onMouseOver); $addHandler(this.get_element(),'mouseout',this._onMouseOut);this.get_element().className =this._nohighlightCssClass; }, dispose : function() {if (this._onmouseoverHandler) { $removeHandler(this.get_element(),'mouseover',this._onmouseoverHandler);this._onmouseoverHandler =null; }if (this._onmouseoutHandler) { $removeHandler(this.get_element(),'mouseout',this._onmouseoutHandler);this._onmouseoutHandler =null; } Ballito.HoverPanelBehavior.callBaseMethod(this,'dispose'); }, _onMouseOver : function(e) { alert('_panelId = ' +this._panelId); var panel = Sys.UI.DomElement.getElementById(this._panelId);if (panel) { panel.Visible ="true"; } }, _onMouseOut : function(e) { var panel = Sys.UI.DomElement.getElementById(this._panelId);if (panel) { panel.Visible ="false"; } }, get_panelId : function() {return this._panelId; }, set_panelId : function(value) {if (this._panelId !=value) {this._panelId =value;this.raisePropertyChanged('panelId'); } alert(this._panelId); }}Ballito.HoverPanelBehavior.descriptor = { properties: [ {name:'panelId', type: String} ]}Ballito.HoverPanelBehavior.registerClass('Ballito.HoverPanelBehavior', Sys.UI.Behavior);Sys.Application.notifyScriptLoaded();

Hi,

the problem is that you are defining delegates but you're not attaching them as event handlers:

$addHandler(this.get_element(),'mouseover',this._onMouseOver);$addHandler(this.get_element(),'mouseout',this._onMouseOut);

becomes:

$addHandler(this.get_element(),'mouseover',this._onmouseoverHandler);$addHandler(this.get_element(),'mouseout',this._onmouseoutHandler);

Hi Garbin,

Thanks very much! That did take care of my state problem. Unfortunately (for me at least), it only got me one step further. Now I get the ID of the panel just fine in the mouse over event, but the call to getElementById() returns null. The documentation on this method is somewhat limited, but it seems to say that if I use the syntax I have in my code (not specifying the parent of the element), document is assumed. My assumption has been that this refers to the document that is referencing the script, i.e. the current page. Is this a valid assumption and regardless of that is this a valid way to grab an element off the page that uses my extender control? If not, is there a way to do that?

Just to make sure I'm clear, I want to set the _panelId property to the ID of a panel control on the page housing the extender control and then to get a reference to that panel using the ID in my mouse over script so I can change properties on it. Is this possible, and if so am I trying to do it the best way?

Thanks for your help,

Lee

Hi,

are you sure that the client id of the panel matches the id that you're passing to getElementById()?

Regarding the extender, I suppose that you want to get a reference to the corresponding behavior, right? If so, you should set the BehaviorID property on the extender and then use its value to get a reference to the behavior, together with the $find method:

var behavior = $find('behaviorID');

Hi Garbin,

Thanks for your response. To answer your question, yes, I am very certain the ID of the panel matches the ID being passed to the getElementById() method. I check the value passed with the alert box immediately preceding the call to getElementById() and it definitely does match the ID of the desired panel on the page where the extender control is defined.

Regarding the second part of your post, I'm not sure exactly where your going. Do I need a reference to the behavior in the script? I was thinking that once I got the reference to the panel from getElementById(), I'd be able to directly set its properties and that that's pretty much all it would take at this point. Is this wrong? Sorry if I'm missing something obvious, just trying to get started here.

Thanks,

Lee

Hi,

sorry, I didn't want to confuse you. If you need a reference to the DOM element (the panel) then getElementById (or $get, a shortcut to access the same method) is the way to go. At this point, since you're getting an error, could you post a simple example that reproduces the problem?

 Hi Garbin,

 Here's the source for a simple page that duplicates the problem:

First, the C# class that derives from ExtenderControl and defines my little "HoverPanel" control:

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;using Microsoft.Web.UI;using System.Collections.Generic;namespace Ballito.CS{ [TargetControlType(typeof(Control))]public class HoverPanel : ExtenderControl {private string _panelId;public string PanelId {get {return _panelId; }set { _panelId =value; } }protected override void OnPreRender(EventArgs e) {base.OnPreRender(e);// Test for ScriptManager and register if it exists ScriptManager sm = Microsoft.Web.UI.ScriptManager.GetCurrent(Page);if (sm ==null)throw new HttpException("A ScriptManager control must exist on the current page."); sm.RegisterExtenderControl(this, FindControl(this.TargetControlID)); }protected override IEnumerable GetScriptReferences() { ScriptReference reference =new ScriptReference(); reference.Path = ResolveClientUrl("HoverPanel.js");return new ScriptReference[] { reference }; }protected override IEnumerable GetScriptDescriptors(Control targetControl) { ScriptBehaviorDescriptor descriptor =new ScriptBehaviorDescriptor("Ballito.HoverPanelBehavior", targetControl.ClientID); descriptor.AddProperty("panelId",this.PanelId);return new ScriptDescriptor[] { descriptor }; } }}

Next, the script file used by the control (largely the same one as in my original post):

// JScript FileType.registerNamespace('Ballito');Ballito.HoverPanelBehavior = function(element) { Ballito.HoverPanelBehavior.initializeBase(this, [element]);// Propertiesthis._panelId =null;// Eventsthis._onmouseoverHandler =null;this._onmouseoutHandler =null;}Ballito.HoverPanelBehavior.prototype = { initialize : function() { Ballito.HoverPanelBehavior.callBaseMethod(this,'initialize');this._onmouseoverHandler = Function.createDelegate(this,this._onMouseOver);this._onmouseoutHandler = Function.createDelegate(this,this._onMouseOut); $addHandler(this.get_element(),'mouseover',this._onmouseoverHandler); $addHandler(this.get_element(),'mouseout',this._onmouseoutHandler); }, dispose : function() {if (this._onmouseoverHandler) { $removeHandler(this.get_element(),'mouseover',this._onmouseoverHandler);this._onmouseoverHandler =null; }if (this._onmouseoutHandler) { $removeHandler(this.get_element(),'mouseout',this._onmouseoutHandler);this._onmouseoutHandler =null; } Ballito.HoverPanelBehavior.callBaseMethod(this,'dispose'); }, _onMouseOver : function(e) { alert(this._panelId); var panel = Sys.UI.DomElement.getElementById(this._panelId); alert(panel);if (panel) { panel.Visible ="true"; } }, _onMouseOut : function(e) { var panel = Sys.UI.DomElement.getElementById(this._panelId);if (panel) { panel.Visible ="false"; } }, get_panelId : function() {return this._panelId; }, set_panelId : function(value) {if (this._panelId !=value) {this._panelId =value;this.raisePropertyChanged('panelId'); } }}Ballito.HoverPanelBehavior.descriptor = { properties: [ {name:'panelId', type: String} ]}Ballito.HoverPanelBehavior.registerClass('Ballito.HoverPanelBehavior', Sys.UI.Behavior);Sys.Application.notifyScriptLoaded();

Finally, the markup for a simple page that uses the control:

<%@. Page Language="C#" %><%@. Register Namespace="Ballito.CS" TagPrefix="ballito" %><!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 id="Head1" runat="server"> <title>ASP.NET AJAX Behavior Sample</title></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server" /> <div> <asp:Panel ID="Panel1" runat="server" BackColor="Cyan" Height="50px" Width="125px" Visible="False"> </asp:Panel> <asp:Button runat="server" ID="SampleButton" Text="Submit Form" /> <ballito:HoverPanel ID="hoverPanel1" runat="server" TargetControlID="SampleButton" PanelId="Panel1" /> </div> </form></body></html>

The behavior I find is that when I run the page and mouse over the button, I can tell the onmouseover event in my control does fire since the alert box in it is displayed. This is the alert box right before the call to getElementById(). As I said in the last post, the alert box shows the value of the _panelId property properly ("Panel1" in this case). The problem is that the alert box that fires right after the getElementById() call shows that the value returned by getElementById() is null instead of [object].

Thanks for the help,

Lee

Hi,

you are setting the Visible attribute of the Panel to false. This means that the Panel won't be rendered on the page and this is the reason why you are getting a null reference.

If you want to hide the panel, you could style the Panel using display:none or visibility:hidden

Hi Garbin,

Well this finally got me going down the road. I'm finding there is still a lot for me to figure out, but I'm starting to get things to work in some sort of expected manner and that's usually what it takes for me to get movement when learning something new. Thanks for all your help.

Lee

VERY new to asp.net AJAX: Enabling controls based on slection from AutoComplete control

I've been reading all day and I'm not finding the solution to my requirement.

I'm developing a form to enter "lead" information, part of the lead data is the name of their Dr. We maintain a MySql DB with leads and Drs information.

When a user is entering a new lead and they type the last name of the Dr I have a AutoCompleteExtension fetching Dr.s that match the last name. When/if the user selects a Dr. from the list I want to DISABLE the other Dr. related fields (FName, address, etc) and insert the data from the selected Dr. If there is no match found, the user will enter the details for the Dr. (new record).

The main issue I'm struggling with is how to respond (client or server) to the user making a selection from the AutoComplete list and enable/disable and populate the related fields. For example, the user picks a Dr. from the list, I then want to disable all the Dr. detail related fields and set the values with the record from the database.

I'm not sure how I will accomplish this yet, I imagine I would need to set those values from the server side and it would in turn use AJAX to push the values down to the client?

If anyone could give me a little guidance I would really appreciate it, I just need a jump start to get this thing going.

Thanks for reading,
Steve

If you're Textbox that has the AutoComplete extention on it loses focus, why not use the onBlur event to check to see if they used your AutoComplete (which would have text in that textbox). If they did use the AutoComplete, then use JavaScript to disable the other textboxes.

You could use the ItemSelected event of the AutoComplete extender in the client and as RTernier says use JavaScript to disable the other textboxes, you could call a webservice to obtain the remaining information of the doctor, check: http://www.asp.net/ajax/documentation/live/tutorials/ExposingWebServicesToAJAXTutorial.aspx
http://www.asp.net/ajax/documentation/live/tutorials/EmbedScriptFile.aspx For information on using WebServices. You could also use an UpdatePanel, I guess you could call a partial post back from the ItemSelected event, although I'm not an expert in UpdatePanel, but I think it would work (personally I like the webservice way better, but it's a matter of choice).

Very Weird Problem with Cascading DropDown

After some version updates both in AJAX.NET and Control Toolkit, I found the Cascading DropDown does not work in my project. The appearance is: the DropDown is simply blank. Even the PromptText is not shown up in the page. DropDown is not populated while the web service is working fine. No error reports to me.

But at mean time, the Sample project of Cascading DropDown page works fine on the same machine.

If I copy my code into the Sample Project, it works. This means the code is correct. And web service is always OK if open asmx page and test it.

My project was created by selecting template of AJAX Enabled website, and then copy the AjaxControlToolkit.dll from Toolkit Sample project Bin folder to my project Bin folder. And then add reference to it. Very standard way.

I compared the difference of the sample project and my project, basically the reference. The only difference is that, the AjaxControlToolkit.dll in my project is versioned as "Auto Update", while in sample project it's versioned as 1.0.61121.0. BUT I DON"T KNOW HOW TO CREATE A PROJECT WITH REFERENCE OF THIS FILE TO BE VERSIONED AS 1.0.61121.0.

For your info, my code is mainly posted as following:

<!-- for aspx code: -->

<asp:DropDownList ID="DropDownList1" runat="server" Width="200px"></asp:DropDownList>
<ajaxToolkit:CascadingDropDown ID="CascadingDropDown1" runat="server" TargetControlID="DropDownList1" Category="Carrier" PromptText="Please select a carrier" LoadingText="[Loading carriers...]" ServicePath="uscarrier.asmx" ServiceMethod="ReturnUSCarriers"></ajaxToolkit:CascadingDropDown>

// webservice code
[WebMethod]
[Microsoft.Web.Script.Services.ScriptMethod()]
public CascadingDropDownNameValue[] ReturnUSCarriers(string knownCategoryValues, string category)
{
SqlConnection cnn = new SqlConnection(ConfigurationManager.ConnectionStrings["CMSConnectionString_Prod"].ConnectionString);
SqlCommand cmd = cnn.CreateCommand();
cmd.CommandType = CommandType.Text;
cmd.CommandText = "select distinct Name, OperatorID from [CMS_Carriers] where OperatorID like '3%' and IsActive = 1";
SqlDataAdapter da = new SqlDataAdapter();
da.SelectCommand = cmd;
DataSet ds = new DataSet();
da.Fill(ds, "Carriers");

List<CascadingDropDownNameValue> carriervalues = new List<CascadingDropDownNameValue>();

for (int i = 0; i < ds.Tables["Carriers"].Rows.Count; i++)
{
DataRow dr = ds.Tables["Carriers"].Rows[i];
carriervalues.Add(new CascadingDropDownNameValue((string)dr["Name"], dr["MBloxOperatorID"].ToString()));
}
return carriervalues.ToArray();
}

The ReturnUSCarriers method needs to be static. (This is covered in the ASP.NET AJAX migration docs as well ashttp://blogs.msdn.com/sburke/archive/2006/10/21/hint-components-that-use-web-services-with-asp-net-ajax-v1-0-beta.aspx.)

David:

Thanks for your reply. I set the method to be static, and it still does not work.

If this is a page method (looks like it is), then you may want to try removing the ServicePath property entirely.
my cascading dropdowns are no longer working as well. I am calling an external web service with the same method signiture as above.
also, this was after I upgraded to the RC and updated control kit.

figured it out, for some reason I was missing this in my web.config:

<addverb="GET,HEAD"path="ScriptResource.axd"type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"validate="false"/>

Shoot, I just realized those were needed for the Ajax to work in IE. And by me removing those lines from the web.config it just does a normal postback and not an asynchronous call. That is why it worked for me. So really nothing has changed. I am back to nothing on why the response.redirect() doesn't work. You guys mentioned that you took the code and were able to get the response.redirect() to work. I'm not sure what in my environment could be any different. I'm running this off of localhost and I do not have IIS running.

ViewState and Atlas

Hi

I encountered a problem involving viewstate and PageMethods (web methods in an aspx page).

I was submitting some control values, only one control on the page is designed as a <asp:listbox />, the rest of the controls are generic HTML. While Atlas.js constructed the proxy to the PageMethod and the arguments (Web.Net.PageMethodRequest) the Atlas.js javascript does some sort of check on the page controls, in which viewstate is a hidden input, adding it to a dictionary (refer line 3495 in Atlas.js)

Some sort of exception is generated but no information is available to determine the source. The code behind to the PageMethod didn't get hit in debug mode and it wasn't until I inspected the request/response in Fiddler that I came across a message indicating a corrupted viewstate.

After disabling viewstate on the <asp:listbox> the request got through to my [WebMethod] in the code-behind.

There is a problem with PageMethods and viewstate, or have I missed something.

Craig

An update for those who might be encountering the same problem with altas (Jan-06 CTP) and ViewState.

As mentioned in my previous post, in the file Atlas.js on line 3495, a procedure adds to the variable bodyDictionary all 'submittable' HTML element e.g <input /> this includes <input type="hidden" /> which means that<inputid="__VIEWSTATE" /> is added to the bodyDictionary variable.

Next in the procedure, is a call Web.Net.WebRequest.createQueryString(bodyDictionary, ...);

This is where IMHO the viewstate corruption is occuring between the client service calls to the server. In my case, I make a call to a [WebMethod] which is contained in an aspx page. So my client function is something like this:

functionfoo() {
PageMethod.GetFoo('hello');
}

My aspx.cs [WebMethod] is like the following:

[WebMethod]
public string GetFoo(string text) {
return text+=" get foo";
}

My page wrapes a user control in an<atlas:UpdatePanel>the user control contains an<asp:Repeater>control.

Has anyone experienced this, or am I the lucky one? To avoid the error 500, I removed the check for HTML elements with a type of hidden. But I'm not sure if this is a good thing...

Craig

PS: I can post the stack trace for those who might be interested.

Further, using PageMethod seems to faciliate the viewstate corruption. for kicks I moved the [WebMethod] from the aspx page into an ASMX file, reversed my Atlas.js script hack and the viewstate problem has gone. I hope the PageManager is a little more robust in the rtm.

Hi,

I'm not able to reproduce the behavior that you described. Could you post the stack trace and also the relevant page code?

Hi Garbin

Stack Trace
[FormatException: Invalid length for a Base-64 char array.]
System.Convert.FromBase64String(String s) +0
System.Web.UI.ObjectStateFormatter.Deserialize(String inputString) +72
System.Web.UI.ObjectStateFormatter.System.Web.UI.IStateFormatter.Deserialize(String serializedState) +4
System.Web.UI.ClientScriptManager.EnsureEventValidationFieldLoaded() +172

[ViewStateException: Invalid viewstate.
Client IP: 127.0.0.1
Port: 3520
User-Agent: Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; .NET CLR 1.1.4322; .NET CLR 2.0.50727)
ViewState: /wEWCAKbhpuAAgLEtM6pBgLN/7aVCAKe4MuSDQLL7+H/CgLL7 3/CgKs5ZucDgLNoqBMLo1Lj5/N S5y dQM87L I5JMzQ=
Referer:http://localhost/Unsd/COC/ExchangeRateView.aspx?countryCode=36
Path: /Unsd/COC/ExchangeRateView.aspx]

[HttpException (0x80004005): The state information is invalid for this page and might be corrupted.]
System.Web.UI.ViewStateException.ThrowError(Exception inner, String persistedState, String errorPageMessage, Boolean macValidationError) +116
System.Web.UI.ClientScriptManager.EnsureEventValidationFieldLoaded() +209
System.Web.UI.ClientScriptManager.ValidateEvent(String uniqueId, String argument) +67
System.Web.UI.Control.ValidateEvent(String uniqueID, String eventArgument) +106
System.Web.UI.WebControls.TextBox.LoadPostData(String postDataKey, NameValueCollection postCollection) +31
System.Web.UI.WebControls.TextBox.System.Web.UI.IPostBackDataHandler.LoadPostData(String postDataKey, NameValueCollection postCollection) +11
System.Web.UI.Page.ProcessPostData(NameValueCollection postData, Boolean fBeforeLoad) +408
System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint) +6953
System.Web.UI.Page.ProcessRequest(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint) +154
System.Web.UI.Page.ProcessRequest() +86
System.Web.UI.Page.ProcessRequestWithNoAssert(HttpContext context) +18
System.Web.UI.Page.ProcessRequest(HttpContext context) +49
ASP.exchangerateview_aspx.ProcessRequest(HttpContext context) in c:\WINDOWS\Microsoft.NET\Framework\v2.0.50727\Temporary ASP.NET Files\unsd_coc\bdef81f1\ee1d3cb5\App_Web_ytigk7vl.8.cs:0
System.Web.CallHandlerExecutionStep.System.Web.HttpApplication.IExecutionStep.Execute() +154
System.Web.HttpApplication.ExecuteStep(IExecutionStep step, Boolean& completedSynchronously) +64

Page Code (aspx.cs)
[WebMethod]
publicExchangeRate GetExchangeRate(int countryCode,int year) {
returnCountryManager.Instance.GetExchangeRate(countryCode,
newint[] { year });
}

Page Code (aspx - javascript)
function GetExchangeRate(countryCode, year) {
// Call the server.
PageMethods.GetExchangeRate(countryCode, year, RequestCallback);
}

function RequestCallback(exchangeRate) {
// Bind the result to the controls.
document.getElementById("ctl00_contentPlaceholder_textboxYear").value = exchangeRate.Year;
document.getElementById("ctl00_contentPlaceholder_textboxIMF").value = exchangeRate.IMF;
document.getElementById("ctl00_contentPlaceholder_textboxUNOP").value = exchangeRate.UNOP;
document.getElementById("ctl00_contentPlaceholder_textboxOther1").value = exchangeRate.Other1;
document.getElementById("ctl00_contentPlaceholder_textboxOther2").value = exchangeRate.Other2;
document.getElementById("ctl00_contentPlaceholder_textboxNote").value = exchangeRate.Note;
}

Page Code (aspx - html)
<!-- Exchange Rate Control -->
<atlas:UpdatePanelID="updatePanelExRate"runat="server"Mode="Conditional">
<ContentTemplate>
<unsd:ExchangeRateControlid="exchangeRateControl"runat="server"/>
</ContentTemplate>
<Triggers>
<atlas:ControlEventTriggerControlID="buttonSave"EventName="Click"/>
</Triggers>
</atlas:UpdatePanel>

The ExchangeRate control is populated in the Page_Load event of the aspx Page by passing an array to a property accessor in the control, the array provides is the data source to a repeater. The ItemTemplate in the repeater contains a link to invoke the GetExchangeRate javascript in the page (above).

Hope this helps.

Craig

I don't know if its the same issue or not, but viewstate corruption is rampant in the QuickStart tutorials... There were several times where I ran 3 or 4 different "run this" tutorials in a row only to have the viewstate corruption error message appear on me. Sometimes it was fixed with a refresh of the page, sometimes it never went away.
hi Guys...
even i got the same problem when i put my [webmethod] in code behind.i tried removing type=hidden from atlas.js line 3495 and it is working.please let me know for the solution as we just can not remove any thing from coreatlas files even though doing the same results in expected output.

thanks
Jaideep

I tried a few things, but was not able to repro. Could you give this a try with the March CTP to see if it still happens?

thanks,
David

I have a similar problem with teh session state.

I have narrowed it down to a web user control that raises an event.

The code behind that implements the event sets the session var and then does a redirects.

on the redirect page the session state is blown away. cant figure out why

steps to reproduce

- create a web user control (define an event and raise it)

- create a page and place the wuc on it (trap for the wuc event and set a session var and do a redirect to 2nd page

- in 2nd page Page_load check the session state

viewstate serialization and atlas

Just testing a little popup calendar user control making use of Atlas. I notice that when I serialize the viewstate unusually (I have a 'StorePage' class that stores the viewstate in the db, keyed on a GUID in a hidden field on the page), the atlas calendar popup fails.

Can I work around this? Do my Atlas pages need to be decended directly from the Page class, or is my GUID-keyed technique flawed?

The calendar uses an updatepanel.

Thanks,

John

Hi John,

Can you explain exactly what doesn't work? Are you registering the hidden field by using ClientScript.RegisterHiddenField?

All pages no matter what will derive from Page, and Atlas doesn't care if there are other intermediate classes in the way (almost all pages have intermediate classes anyway due to code-behind files).

I can't think of any specific reason why this wouldn't work off the top of my head.

Thanks,

Eilon

Virtual Earth Control

How would I set the initial properties of the virtuaEarthMap control?

<virtualEarthMap targetElement="map" Latitude="22" Longitude="-100"MapStyle="Hybrid" ZoomLevel="9" CssClass="map" DataValueField="ID"DataTextField="Name" PushpinCssClass="pushpin"PushpinActivation="Hover">
</virtualEarthMap
Doesnt seemt to work :(
The map "base" shows up, but none of the actual map tiles are showing.

Any help would be awesome :)I have worked with the Virtual Earth before using just the javascriptand found we could display the dashboard but I looked in theAtlasUIMap.js and can't reference any mention of the dashboard ?

Virtual Earth support has since been pulled out of the ASP.NET AJAX "Atlas" Extensions. Because of this, I created a ASP.NET AJAX Virtual Earth Mapping Server Control located here:http://simplovation.com/Page/WebMapsVE.aspx

Virtual Earth Connection/Event Problem When Nested In AJAX Control

Well, I was told today that I needed to make a web portal by the end of the month using .net technologies (my handle says it all) and I just hit my first roadblock.

In a condensed nutshell, I am trying to implement theVirtual Earth tool in an asp.net ajax tab control. When the VE <div> is located outside of the tab control then it works, but when I try to load it inside of the TabPanel it doesn't scroll properly and doesn't refresh.

I clipped out everything from my default.aspx except for the problem (below). Help is very much appreciated.

===================== SOURCE =================

<%@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"> <scriptsrc="http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=4"></script> <scripttype="text/javascript">var map =null; function GetMap() { map =new VEMap('myMap'); map.LoadMap(); }</script> <htmlxmlns="http://www.w3.org/1999/xhtml"><headrunat="server"> <title>Map</title> <metahttp-equiv="Content-Type"content="text/html; charset=utf-8"></head><bodyonload="GetMap();"> <formid="form1"runat="server"> <ajaxToolkit:ToolkitScriptManagerID="ScriptManager1"runat="server"> <Scripts> <asp:ScriptReferencePath="Map.js"> </asp:ScriptReference> </Scripts> </ajaxToolkit:ToolkitScriptManager> <ajaxToolkit:TabContainerID="TabContainer1"runat="server"ActiveTabIndex="0"ScrollBars="Auto"> <ajaxToolkit:TabPanelID="TabPanel1"runat="server"HeaderText="Map Tab"> <ContentTemplate> <divid='myMap'style="position: relative; width: 400px; height: 400px;"/> </ContentTemplate> </ajaxToolkit:TabPanel> </ajaxToolkit:TabContainer> </form></body>

</html>

===================== END SOURCE =================

I had the same problems working with TabContainer Control and Virtual Earth Control .

A workournd I have found that partially solves this issue is to remove the code

ActiveTabIndex="0"

from the definition of the TabContainer control.

You may find more info on this on this URL :

http://www.dotnetside.org/blogs/lucab/archive/2007/10/05/Mappe-di-Virtual-Earth-e-controllo-Tabs-di-AJAX-Control-Toolkit.aspx

George

Virtual Earth and firefox

Hello.
I have some fun with VirtualEarthMap control last night :) I was tryingto make it work in Firefox. The problem occured to be in DOCTYPEdeclaration,
after removing it maps displays well but we can't still change its sizein associated cssClass. After a moment of investigation I used#id_of_map_control instead of cssClass in css stylesheet - works well!
What I ve done is working but isn't elegant :) Maybe I am missing something?
Best regards,
Marcin Daczkowski
That's a bug in the map control. When you apply the class, you apply itto a container div. That container contains a div, in which the actualmap is placed. When the map is initialized, the control uses thewidth/height of this div as the width/height of the map. Your classobviously does not apply to this inner div, which means it will have adefault height/width.

Hello
Thanks for explaination. I was investigating source code and found thatdiv in div, too. But my knowledge of css implementations is not deep -I've found "hack" but was not sure if there is no better (proper)solution (after I have found nothing on google about this i was surethat I am doing sth wrong). Now everything is clear. Thanks!

Best wishes,
Marcin Daczkowski

Virtual Earth Question

Has anyone used the new build of Atlas to display the Virtual Earth control? I am unable to make it work. All I get is the copyright message from microsoft and the background image but not the maps

Any help would be great!!

<components>
<virtualEarthMap id="map" latitude="43.644755000"longitude="-79.392211000" zoomLevel="10" />
</components
that works :)

but looking to see if the Dashboard can be displayed:

params.showDashboard = false;
_map = new Msn.VE.MapControl(this.element, params);

Why is the Dashboard default to not show and theres no way of passingin the parameter or changing the JS ourselves since it is packaged intothe DLL now...

What alternatives can we do in using VE Control in Atlas and customizing the properties?

Virtual Earth kills Accordion

Adding a reference to the VE script makes the content area of the Accordion Control invisible in Firefox. In IE it works fine.

Anybody experienced the same problem and/or found a solution/hack?
I guess you can't use the Accordion control in a VE application and we will have to redesign the user interface...

Ueli
5:PM serious Technology, Brazil

1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">2<html xmlns="http://www.w3.org/1999/xhtml" >3<head>4 <title>Test Page</title>5 <script type="text/javascript" src="http://dev.virtualearth.net/mapcontrol/v4/mapcontrol.js"></script>6</head>7<body>8 <form id="form" runat="server">9 <asp:ScriptManager ID="ScriptManager" runat="server" />10 <ajaxToolkit:Accordion ID="Accordion" runat="server" AutoSize="Fill" >11 <Panes>12 <ajaxToolkit:AccordionPane runat="server">13 <Header>Header A</Header>14 <Content>Content A</Content>15 </ajaxToolkit:AccordionPane>16 <ajaxToolkit:AccordionPane runat="server">17 <Header>Header B</Header>18 <Content>Content B</Content>19 </ajaxToolkit:AccordionPane>20 </Panes>21 </ajaxToolkit:Accordion>22 </form>23</body>24</html>

phew found a solution, was worried there for a second

Basically for some reason or other VE is applying a opacity:0.1 (inline styling) to all the accordian divs in firefox which makes them not display.

To override this you have to do the following

#youraccordianid div
{
opacity:1 !important;
}

This makes all divs of your accordian have an opacity = 1 the !important tells FF & IE7 that this should override all other style

Hope this helps others

Brian Norman
www.earthware.co.uk

virtualEarthMap

Hi!

Can anybody tell something about the magical disappear of AtlasUIMap.js andvirtualEarthMap control in version RC1? With older verisons of Atlas (int time of Microsoft.Web.Atlas.dll, april CTP maybe) it worked fine. But the RC1 unfortunately does not know anything about it :(. Does RC1 have any wrapper for Microsoft Virtual Earth, or in RC1 we only have pure VE SDK, and AJAX gives us no support for mapping?

Thx

Yes there is not support for Virtual earth in currently in ASP.NET Ajax. But the VE SDK is pretty good and well structured so you can use it wothout the need of a wrapper.

VirtualEarchMap Control

Where can I find detailed documentation as to what the API is for the xml-script for the virtualEarthMap control.

I've looked at Jonathan Hawkins' Mashup example (http://blogs.msdn.com/jhawk/archive/2006/03/26/561658.aspx) and it is an excellent starting point but now I'm interested in doing more and I'm not sure what else is supported in the xml script.

Thanks

Hi,

check the url in my signature, it's a mashup based on Virtual Earth.You can download the source code.

hello.

the class is defined on the atlasuimap.js file. if you look at the getDescriptor method, you'll get all the propertties, events and methods that can be used from xml-script.

Visibility problem with ajax control

hi,

I have a textbox and required field validator control.when the page is 1st loaded the Textbox is invisible and after clicking a button it becomes visible but

the problem is that the validator control is not working though the text box is visible now? why any idea pls?

Hi,

Can you post sample code to illustratete problem? I cannot get the same problem just by placing textbox and required validator in update panel and makeing TextBox invisible initially.

-yuriy

If you are using Validators inside UpdatePanel, then it is not compatible with it

http://weblogs.asp.net/scottgu/archive/2007/01/25/links-to-asp-net-ajax-1-0-resources-and-answers-to-some-common-questions.aspx

You can download compatible validators control from here

http://blogs.msdn.com/mattgi/archive/2007/01/23/asp-net-ajax-validators.aspx

hi,

I have used the usual asp validators.Now I have add the tag mapping required in web.config file and add reference to validation.dll.But when I run the program it shows error in my user controls which are in another folder with a custom namespace.any idea pls? the pages are not showing error but the user controls are showing error.By the By the Pages where these user controls are imported are also in a folder.

pls reply...

I have put the error messags given in my User Controls below:

pls see this and reply quickly............

Error 150 Could not load file or assembly 'Validators, Version=1.0.0.0' or one of its dependencies. The system cannot find the file specified. (D:\SSDTracker\Tracker\web.config line 92) D:\SSDTracker\Tracker\User Controls\CompetencyDatabase\CompetencySectionUI.ascx 32

Hi,

I think the error message explained the issue clear.Make sure Validators.dll is in the right folder and the version of it is right. Make sure you made the right setting in the config file.

Good luck!

Visual Studio 2008 And AJAX Framework 3.5 - Control KIT

Hi friends ...

I need heap of helps on AJAX Framwork 3.5.
I just Installed Visual Studio 2008 and AJAX Control ToolKit for Ms Framework 3.5 - 11119

I've got Error Message (below) when i create Accordion AJAX Control Kit.

Error 1 The type or namespace name 'AjaxControlToolkit' could not be found in the global namespace (are you missing an assembly reference?)

I've included the AjaxControlKit.dll in my Bin folder. I've added the <%@dotnet.itags.org. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
at the top of the page. i've created the Ajax Control Kit. but still facing this problem.

I've got a warning : Generation of designer file failed, unknown tag ... on my textboxWatermarkextender. but strangely when i run the project, the target textbox runs properly.

anyone have any experienced ?

By the way, for moderator :)

Last week, i forgot my password to log in to this forum, i clicked the "forgotten password" link ... as it asks me to enter my email address when i register for this forum.
i put in my email address , and request for a new password.

When the email confirmation arrived in my inbox, i clicked the formatted link as instructed in the email, but when it always say ... " You dont have permission to do the task " ... MsgID = 31 ...
i tried many times and came with no result. Fortunately as 10 days past by, suddenly i remember my password ...

how it could be happening? and what to do next if i forgot my password ? :)

thanks ...

Hi On3_Cool,

on3_cool:

I need heap of helps on AJAX Framwork 3.5.
I just Installed Visual Studio 2008 and AJAX Control ToolKit for Ms Framework 3.5 - 11119

I've got Error Message (below) when i create Accordion AJAX Control Kit.

Error 1 The type or namespace name 'AjaxControlToolkit' could not be found in the global namespace (are you missing an assembly reference?)

I've included the AjaxControlKit.dll in my Bin folder. I've added the <%@. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
at the top of the page. i've created the Ajax Control Kit. but still facing this problem.

I've got a warning : Generation of designer file failed, unknown tag ... on my textboxWatermarkextender. but strangely when i run the project, the target textbox runs properly.

anyone have any experienced ?

It is recommended to add reference to the AjaxControlToolkit.dll(right click on the bin directory, and choose "Add Reference"), and then AjaxControlToolkit.dll will be added to the bin directory automatically.

Also you can register AjaxControlToolkit on the web.config. You can use template to create an Ajax Control Toolkit enabled website.

For your second question, please send private messages to the website moderators. Thanks for understanding.

If you have more questions , please feel free to let me know.

Best regards,

Jonathan

Visual verification extender

Hi,

Are there any plans for a visual verification extender that would be linked to a textbox control and that would show an obscured code that has to be entered by the user to protect against automated registrations?

Would be a nice control for the toolkit.

Thanks,

Jason

As far as I know there is currently no one working on a CAPTCHA extender, but we do have the NoBot extender which is designed to prevent many cases of automated posting that a turing test like CAPTCHA is supposed to block. Take a look athttp://ajax.asp.net/ajaxtoolkit/NoBot/NoBot.aspx

Cool...that should do the trick. Thanks.

visual web developer 2005 express

Hi,

will the sample control toolkit work in visual web develoer? i installed the ajax .net rc1, control sample web site, latest ctp. When i open and run the sample project, it shows no error and displays the controls. but, the none of the controls is working.

thanks

it will work under visual web developer

do you see any javascript error?

No. there is no compilation, runtime or javascript error. But, it the sample controls still not working

thanks

VS 2005 IDE now unstable and crashing

I recently installed AJAX and the control toolkit, setup a sample website and it worked very slick. I have an existing app written in VB.net in VS 2005 that i am integrating the AJAX toolkit, specifically the dropdownshadow extender, scriptmanager and updatepanel, having copied the needed configuration into my web.config from the small app i wrote.

The problem is my environment is now extremenly unstable and crashes whenever i try to change a property of a control within the update panel or on any page containing an ajax control. Simply clicking on a textbox within the AJAX control will randomly cause an error screen i have never seen before saying Visual Studio has encountered an error and must restart.

Once the crash happens i cannot switch to design view as it says no AJAX tags are recognized, yet if i compile and run it works fine, not much help if i cannot design tho. I strip the tags out in code view and i am off again until the next crash.

After some crashes i try to drag an AJAX control onto a page and i get an 'Error: control could not be created' , control is not recognized. I have to reboot my system to get it to work.

I installed SP1 Beta and the problem still persists. This is very frustrating as the controls are working great other than when they crash my IDE. I will attach a screenshot if needed once i get in front of my dev station.

Hopefully someone has had this problem already.

Cheers!! And great work so far!!

I have never seen that, but can be a bug fixed in the new SP1 for VS2005http://alpascual.com/blog/al/archive/2006/12/15/Visual-Studio-2005-Service-Pack-1-has-been-released.aspx

See if installing it fixes your problems

This happens to me much more often as well after installing AJAX.

Sorry been away for a while, i installed SP1 but still unstable. I also constantly get

Error 182 Element 'ScriptManager' is not a known element. This can occur if there is a compilation error in the Web site.

It does not occur everytime but when it does i cannot change to design view. The site still runs fine but it is frustrating that i have to reboot or wait for the 'magic' in the air to sort the problem out. I have seen this in many forums but no one ever has an answer yet.

VS2005 often crashes when I try to shut it down with SP1 and SP1 for Vista. I get memory corrupt errors and it can't recognize the ASP.NET Ajax tags most of the time. I am running Vista x64 RC1 though so some problems could be related to that...

VS 2008 - Add extender helper icon on controls

I have downloaded and installed VS 2008, .NET 3.5 and current Ajax Control Toolkit. I have added the toolkit to the VS Toolbox.

The little 'helper' arrow, as described in the video linked below (around the 7 min mark), does not appear for me. I add a button to a page, highlight it in design mode and it doesn't show the helper arrow. I can drag and drop an extender from the Toolbox, but it would be nice to have this added functionality as described.

http://asp.net/learn/3.5-videos/video-224.aspx

Am I missing something?

Thanks,
Tim

I have the same problem.

FYI, in addition to the installation process described in the Toolkit instructions I also tried installing them the same way Joe Stagner described in the video you referenced with no success. Joe suggests copying all files/dir in the Ajax Control Toolkit's SampleWebSite\bin directory into the toolkit's Binaries subdirectory, then adding them to the Visual Studio Toolbox from there.

More info:
http://forums.asp.net/t/1184181.aspx

But no solution?

Hi,

Please try the following steps:

1. Download the source code of ajax controltoolkit

2. Open in Visual Studio

3. Open property page for AjaxControlToolkit project

4. Click Assembly Information

5. Change Assembly Version from 3.5.11119.* to 3.5.0.0

6. Rebuild the project and use this assembly in your project

I downloaded the source. When I try to open the AjaxControlToolkit.sln in VS 2008, I get the error "[file path]\AjaxControlToolkit.csproj cannot be opened because its project type (.csproj) is not supported by this version of Visual Studio. To open it, please use a version that supports this type of project."

I cannot open in VS 2005 either. I don't have any other versions of VS.

Am I doing something wrong?

Thanks
Tim

Hi Tim,

Which version of Visual Studio are you using?

Please useVisual C# 2008 Express edition (which is free )or higher (e.g., professional version).

Waitscreen animated gif. Where?

Hello

Sometime ago there was a link to multiple waitscreen animated gifs for use with UpdateProgress control. I've searched this forum and google, but cannot seem to find it. Anybody have that link?

Thanks

This is a good resource:http://www.napyfab.com/ajax-indicators/