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

Wednesday, March 28, 2012

Ajax Updateprogress bar

Hi

I am ussing Ajax controls, and I have a problem to implement a Update progress bar with a to different Update panel.

This is my problem I have a Two diferent Gridview in to different Updatepanel and one Updateprogress bar, the first Updatepanel with the first Gridview has to be updated automatically each 1 second with a timer control process, and and the other Updatepaanel and gridview has to be Updated when I press a button control and has to be appear the progress bar that I put in the Updateprogress bar but is not working as I am saying, when the page is Load the first Gridwiew start to Updated automatically and also the progress bar appear, and when I press the Button to update the other Gridview is also appear the progress bar and when is finish to Update the gridview the progress bar is continusly working.

any suggestion to solve this problem

Thanks and regards.

You can use separate UpdateProgress for each UpdatePanel. Set the AssociateUpdatePanelID of the UpdateProgress control to your designated UpdatePanel.

AJAX UpdatePanel works on dev machine but still flickers on web server.

Hi Guys,

I have a master page, that has a ScriptManager and some "RoundCorner" controls. I also have a child page with a textbox and a FormView.

So I created an UpdatePanel, put my FormView inside the ContentTemplate, created the trigger and assigned to the TextBox's TextChanged event. (to an Async trigger).

When I run the app on the dev machine, it works wonders, no flickering and only the formview gets "refreshed". But as soon as I upload the code to the WebServer, the entire page gets refreshed everytime I change the value on the TextBox.

Am I forgetting to have something setup on the server side? I didn't find a "Deployment guide" for AJAX (If theres one, please point me to the right direction), so I figured that installing the MS Ajax 1.0 on the server would do it.

Thanks!

Marcelo

More info:

Just tried a small example, and again it does not work on the server side (both dates get updated):

<%@. Page Language="C#" AutoEventWireup="true" CodeFile="TestPage.aspx.cs" Inherits="TestPage" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>Untitled Page</title></head><body> <form id="form1" runat="server">From here, it is inside the panel <br /> <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true"> </asp:ScriptManager> <asp:UpdatePanel runat="server" ID="UpdatePanel1"> <ContentTemplate> <asp:Label ID="TestLabel" runat="server" Text=""></asp:Label> </ContentTemplate> <Triggers> <asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" /> </Triggers> </asp:UpdatePanel><hr/>From here down its not inside the Panel<br /> <asp:Label id="Test2Label" runat="server" text="" /> <asp:Button ID="Button1" runat="server" Text="ClickHere" /> </form></body></html>

***********CS content

using System;using System.Data;using System.Configuration;using System.Collections;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 TestPage : System.Web.UI.Page{protected void Page_Load(object sender, EventArgs e) {TestLabel.Text = DateTime.Now.ToString();Test2Label.Text = DateTime.Now.ToString(); }}

Anyone has ideas?

Thanks!

Marcelo


Nobody at all?


Hello,

Take a look at my post and the solution we found:http://forums.asp.net/thread/1649057.aspx

Possibly your case is similar.


Hi there,

At first it seemed that I had my problem solved, since the properties show exactly the same as yours.. So I tried to change the property to true, but no luck, it still does a full refresh on the

server side..

I checked your sample site, and I it does a full refresh aswell.. what part of if should do a partial refresh?

Could you send me the code you have on your page Init?

this is what I've added on mine:

private void Page_Init(System.Object sender, System.EventArgs e) { ScriptManager1.SupportsPartialRendering =true; }

I'm getting frustrated with this...


Hi,

The partial refresh on our page (http://beta.easyquerydemo.com) works only for "Result" panel (at the bottom of the page). If you define some query using "Conditions" panel (for example: "Customer Company Name starts with A") and then click on "Update Result" button the result set should appear almost immediately and without updating the whole page.

As for code: we use exactly the same line of code as you published in your previous post.

Did you check the value of this property after assignment. Maybe it still is set to 'false' because of some limitations in browser which you use to access this page.


In this example of yours, both Labels get updated because you update the datetime in your Page_Load function.

Your Page_Load function should be like this:

Protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
TestLabel.Text = DateTime.Now.ToString();
Test2Label.Text = DateTime.Now.ToString();
}
}

And your button to update the Label inside the updatepanel should call a function to update the datetime of that label.

Protected void UpdateLabel(object sender, eventargs e)
{
TestLabel.Text = DateTime.Now.ToString();
}


Hi,

What i'm doing is the following, on page_init i force the property to be true, and on page load i load all those variables into labels, just like you do on your sample site. It does in fact change that property to True. but the full refrensh still occurs.

Now I see the part that uses the update panel (The result on your site). And it actually works.

Do you have any other hint?

Correct me if I'm wrong but, theSupportsPartialRendering property is set based on:EcmaScriptVersion,SupportsCallback andW3CDomVersion; which are properties of HttpBrowserCapabilities that is assigned from a Request.Browser object.

That means that it is checking the Client's Browser capabilities, and nothing to do with the server itself right? If thats true, as long I use the same browser (IE7 for instance) it should not matter where that page is sitting at, it should bring the same value for SupportsPartialRendering...

Is my line of thought correct or I am missing something ?

Thanks a lot for the help you are giving me!


Hi there,

1. About "other hint". No I do not have it unfortunately. The only one thing I can suggest is to try add another UpdatePanel on your page and some simple controls into it (e.g. one button and one label) just for testing and see how it works. Another good idea will be to create another simple testing page using AJAX template in Visual Studio (if you use it) and see how it works on your server.

2. About the properties whichSupportsPartialRendering is based on: yes you are right, at least we understand this part of documentation exactly the same way.

Possibly we should send this request to Microsoft? There must be more conditions for partial rendering support except those ones described in documentation. I think there must be some requirements for server side.



Hey,

I will create a brand new example using the AJAX project template and report back my findings.

I agree, but I never done this before. Usually I can find a work-around for these type of issues, which doesn't seem to be the case right now. How should I proceed on submiting this to MS?

Regards


Hi again there,

More findings:

1. I created a brand new application and used the same sample as before, but this time I added the labels and forced SupportPartialRendering to true.

Amazingly the application worked just fine on the server side.

2. I've added a master page to this application and wired up the old "default.aspx" to the master page, moving the ScriptManager to the master page (and also the SupportPartialRendering portion)

Application stopped working.

3. I moved the ScriptManager (and SupportPartialRendering) back to the Default.aspx and removed from the master page.

Application still didn't work.

At this point I think is safe to conclude that: UpdatePanels will not work with master pages!!!?

PS: All the 3 situations work fine on the development machine.

Anyone has Master Pages + Update panels working properly on a production server?


We finally have solved the same problem. I think your case is similar.

Seehttp://forums.asp.net/thread/1653605.aspx for more info.


Hi korzh,

This is great, now it works like a charm! Thanks a lot for keeping me posted! Now, where in the documentation does it show anything about that property.. :P only a insider would know about it ..

Thanks a lot! Case closed!

Marcelo


Hi korzh,

This is great, now it works like a charm! Thanks a lot for keeping me posted! Now, where in the documentation does it show anything about that property.. :P only an insider would know about it ..

Thanks a lot! Case closed!

Marcelo

Ajax Update Progress

Hello, I need to have three ajax update progress controls on one page. The problem im having is that when an event is triggered for any of the update panels none of the update progress controls appear. What am I doing wrong. Heres my code:

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Image ID="SiteOneThumb" runat="server" Height="158px" Width="210px" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="SiteOneTextBox" EventName="TextChanged" />
</Triggers>
</asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
<img src="http://pics.10026.com/?src=Images/loading.gif" /> <br />
Retrieving Thumbnail...
</ProgressTemplate>
</asp:UpdateProgress
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<asp:Image ID="SiteTwoThumb" runat="server" Height="158px" Width="210px" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="SiteTwoTextBox" EventName="TextChanged" />
</Triggers>
</asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress2" runat="server" AssociatedUpdatePanelID="UpdatePanel2">
<ProgressTemplate>
<img src="http://pics.10026.com/?src=Images/loading.gif" /> <br />
Retrieving Thumbnail...
</ProgressTemplate>
</asp:UpdateProgress
<asp:UpdatePanel ID="UpdatePanel3" runat="server">
<ContentTemplate>
<asp:Image ID="SiteThreeThumb" runat="server" Height="158px" Width="210px" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="SiteThreeTextBox" EventName="TextChanged" />
</Triggers>
</asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress3" runat="server" AssociatedUpdatePanelID="UpdatePanel3">
<ProgressTemplate>
<img src="http://pics.10026.com/?src=Images/loading.gif" /> <br />
Retrieving Thumbnail...
</ProgressTemplate>
</asp:UpdateProgress>

Thanks!

Hi.

Why dont you use only one Updatepanel and updateprogress control and bind different asynchronous events to this update panel. And it shud work.

If i am in wrong direction, please elaborate more.

Cheers


Hi I think it cannot be done currently. Atleast i think so . I have tried it. Probably you can use any no of updatepanels but a single updateprogress control.We can set this update progress control to monitor all the partial rendering happens in the entire page.To implement that just remove the AssociatedUpdatePanelID property. By default it will watch the entire page for all Partial renderings.

hello.

well, if i'm not mistaken, i'm under the impression that updateprogress will only work if the postback is started by a control placed inside an updatepanel. anyway, not all is lost :)

you can hande the beginRequest and endRequest client event fired the by the client pagerequestmanager object that is inserted on the page when you use updatepanels. during the beingrequest, you need to get a reference to the control responsible for the async postback and you need to map it to the "correct" updateprogress control. after doing this, you only need to show the contents of that updateprogress by setting the display (or visible) css property of it. dyuring the endrequest event, you need to hide the contents of the panel again.

Ajax update panel and performance

Dear all

I am using asp.net 2.0 and ajax. in my ui i have multiple controls. some i need to update some other dont want to update. but the controls that i need to update is not in serial order in ui. so i need to place them in multiple update panels. is that a performance issue if i use multiple update panels(may be 6 or 7 update panels in 1 UI) ?

Thanks

Update panels makes client [browser] little heavy. performance is same, since it postback's the whole view state. It is just for user experience. But putting more update panels and showing too much data in update panels makes browser too heavy it might crash the browser

Ajax Update Panel & Opening a new browser window

Please excuse my terminolgy, I am not used to discussing in detail Embarrassed

I have a fairly complicated page, containing various asp controls. One of which is a dynamically populated datagrid. Rows on this datagrid can be clicked and then within the SelectedIndexChanged Event on the grid I am working out several values and passing them as query strings into a URL and am then using response.redirect to open the URL as a new page with the parameters available to it. This works fine.

Response.Redirect("'MyPage.aspx?Sdate=" & sdate & "&Edate=" & edate & "&AreaCode=" & AreaCode & "&Qsdate=" & Qsdate & "&Qedate=" & Qedate & "")

The problem is that the whole page is wrapped in an Ajax Update Panel, for various reasons, and I now need to open the new page (after clicking a row on the datagrid) in a new browser window.

The usual method I think would be -

Response.Write("<script>window.open 'MyPage.aspx?Sdate=" & sdate & "&Edate=" & edate & "&AreaCode=" & AreaCode & "&Qsdate=" & Qsdate & "&Qedate=" & Qedate& "', '_new','width=400, height=200');</script>")

BUT... I gather Response.Write can't be used with Ajax and when I have tryed it, I just aget a parsing error. Can anyone suggest how I can open a new browser window from the SelectedIndexChanged Event, whilst still keeping the datagrid within the Ajax update panel.

You can add a label, and make it initially invisible.// Label1.Visible =false;

Assign the Text property of that label, the java script you want to execute.

And on the SelectedIndexChanged event set the visibility of the Label to true and text to the javascript.

Label1.Text = "<script>window.open 'MyPage.aspx?Sdate=" & sdate &"&Edate=" & edate & "&AreaCode=" & AreaCode &"&Qsdate=" & Qsdate & "&Qedate=" & Qedate& "','_new','width=400, height=200');</script>";

Label1.Visible = true;

But, basically, you could do all of that on the client side. I see no reason why you make a post back, if you just append some values from the client side and concatenate them.


That still won't work with Ajax, I think that might be due to the way the event fires on the datagrid? It is making the lable visible and setting the text to that of the javascript when I debug, but once the page is loaded it just highlights the row selected and nothing else, the label is not even visible.

I don't think this method is right for what I am trying to achieve anyway, as there are variable values in my VB Code behind that need to be passed to the URL.Therefore how can I actually pass values held in vb.net variables into the javascript code?

i.e. - "<script>window.open 'MyPage.aspx?Sdate=" &sdate& "'

sdate is a variable that is used in my vb.net code that holds a date and I need that to be in the URL that is used in the javascript, same as all the other variables above - edate, areacode, etc.

Any other suggestions?


*Bump*


jaYKay:

Response.Write("<script>window.open 'MyPage.aspx?Sdate=" & sdate & "&Edate=" & edate & "&AreaCode=" & AreaCode & "&Qsdate=" & Qsdate & "&Qedate=" & Qedate& "', '_new','width=400, height=200');</script>")

Check what isRegisterStartupScript(Page, Type, String, String, Boolean) for a server side solution, or seeASP.NET AJAX Client Life-Cycle Events. if you need a client side solution.


Did you ever find a solution to this problem? I have the exact same situation and have spent the last 2 days trying to find a way to open a new browser window with dynamic values.

If you or anyone else has a solution to ths problem, could you please post it?

Thanks,

Ken


Hi, I've just coded a way of doing that..it's really ugly one, but this is what I can think of at this moment :)

Here is the web page code:

<%@. Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<script language="javascript" type="text/javascript">
<!--

function PopUp()
{
var label = document.getElementById('Label1');
if(label!=null)
{
window.open(label.innerText);
}
}

//-->
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
<asp:Label ID="Label1" runat="server" visible="false" style="visibility:hidden" />
</ContentTemplate>
</asp:UpdatePanel>
</form>
<script language="JavaScript" type="text/javascript">
var prm = Sys.WebForms.PageRequestManager.getInstance();

prm.add_endRequest(EndRequest);

function EndRequest(sender, args) {
PopUp();
}
</script>
</body>
</html>

and the code behind (in c#):

public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{

}

protected void Button1_Click(object sender, EventArgs e)
{
Label1.Text = "http://www.asp.net";
Label1.Visible = true;
}
}

Hope this will help.

Cheers,

Yani


I was not able to get this variation to work, however on another thread I did get an answer that does work and is much cleaner.

Try this

http://forums.asp.net/p/1114996/1730089.aspx#1730089

Thank you very much for your reply.

Ken


I ended up cheating it really. I just used two panels on top of each other and made the first one and its contents disappear and the second one reappear, therefore giving the illusion that it was a new page, only problem now is that the information for the user is at the top of the second panel and the grid they clicked on is at the bottom of the first so they always have to scroll up to the top of the page each time. It works, if not a bit messy, I just need to set the focus to the top of the page, which is not that simple as the page is not refreshing as such and contains data that was parametised by the user.


Hi,

Have you looked at this thread http://forums.asp.net/t/1122462.aspx . I have posted a solution for similar problem in this thread. I hope this should solve your problem instead of doing it the above way. If you have any queries let us know.


ajax update panel

hi, I have a problem with ajax.net controls. I have a form with some field. When I click a button I validete client-side the fields and then, only if the validation is ok, the page post his data to the same page. It works fine. Now I need to add the updatecontrol (ajax.net) with the script manager. If i do this the page make the validation control and even if it is not ok the page post his data. Why?

thanks

This my be what you need.

http://weblogs.asp.net/lkempe/archive/2007/03/26/asp-net-ajax-and-asp-net-validators.aspx

Ajax Update Panel

Hi guys,

I am using a login page with ValidatorCalloutExtender controls to validate username and password textboxes. On the submit button, I am using UpdateProgress to display an animation while the request is being entertained. Now, when the button's pressed, the animation comes up properly and everything is ok. However, I want the button to be disabled while the "progress" animation is being played and as soon as the results come back (like account not found), I want the button to be enabled again for the user.

How can I switch between the 2 states of the button as above? I would appreciate all help.

Thanks!

Found the solution :)

<scriptlanguage=javascript>

Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);

function BeginRequestHandler(sender, args)

{

var btn = document.getElementById("<%= BtnSubmit.ClientID %>");btn.disabled =true;

}

function EndRequestHandler(sender, args)

{

var btn = document.getElementById("<%= BtnSubmit.ClientID %>");btn.disabled =false;

}

</script>

Monday, March 26, 2012

AJAX toolkit without asp

Hi,

Are there any examples of using some of the basic controls in the toolkit, without asp. Any sample would be appreciated.

vaidhy

see Online DEMO athttp://ajax.asp.net/ajaxtoolkit/

AJAX Toolkit install on Vista reverts back to Beta version & whats up with the sub folders

Anyone have issues install AJAX on Vista OS? It appears that the controls revert back to <cc1 etc... as was in beta version dubbed Atlas... Anyone know why the many sub-folders?

Previous apps however do recognize the controls from the Toolkit as <ajaxToolkit: etc...

Thanks,

It has worked fine with us. We have a couple people using Ultimate x64 and others using Ultimate x86.

Ajax Toolkit Controls disabled

I downloaded ajasx control toolkit for .net 3.5 and added into separate tab in visual studio 2008 tolbox.

Problem is they are invisible (disabled when pres Show All in toolbox).

Anybody familiar with this issue?

Hi Ekaan,

Someone has met this kind of issue before. Please have a test by followingthis article.

This response contains a reference to a third party World Wide Web site. Microsoft is providing this information as a convenience to you. Microsoft does not control these sites and has not tested any software or information found on these sites; therefore, Microsoft cannot make any representations regarding the quality, safety, or suitability of any software or information found there. There are inherent dangers in the use of any software found on the Internet, and Microsoft cautions you to make sure that you completely understand the risk before retrieving any software from the Internet.

If it doesn't work, please feel free to let me know.

Best regards,

Jonathan


Thanks but that didn't help.
I can use them trough source (markup or C#) but it slows down my development :-(

I have same issue with Telerik prometheus controls.


Hi Ekaan,

ekaan:

Problem is they are invisible (disabled when pres Show All in toolbox).

Would you please describe your issue more clearly for us?

Best regards,

Jonathan

Ajax Toolkit

We noticed that there is an update to the toolkit which includes 2 additional controls namely the Search Listbox and the slide show and other enhancements such as comment stripping etc.

In order for us to utilise these new features, can we just replace the existing toolkit dll with the new one or do we have to make a complete re-install.

Thanks in advance.

You may find that you are able to just install over the top with no problems. However that depends on the version of the controls you currently have. Since the toolkit is constantly in development, a Microsoft Development Team member advised me to always un-install first, just to avoid any possible complications.

AJAX to grab a server controls RenderContents() output

Hi everyone,

My web application dynamically loads custom built server controls at runtime from seperate assemblies using the reflection namespace. Everything works fine, and the server controls display on the page as required.

I would like to extend this, to enable the server controls to be displayed asycronously. Is it possible to make an asynronous request to the web server and then when the server control is loaded, pass back the HTML that is generated in the RenderContents() method as the responseText?

How would I go about doing this? Example code would be great.

Any help is much appreciated,
Ad

Hi,

I'm still stuck on this on this one, any ideas?

Thanks again,
Ad


Hi,

Please refer to this:Emailing the Rendered Output of an ASP.NET Web Control, it implements the function you need.

Hope this helps.

NOTE:This response contains a reference to a third party World Wide Web site. Microsoft is providing this information as a convenience to you. Microsoft does not control these sites and has not tested any software or information found on these sites; therefore, Microsoft cannot make any representations regarding the quality, safety, or suitability of any software or information found there. There are inherent dangers in the use of any software found on the Internet, and Microsoft cautions you to make sure that you completely understand the risk before retrieving any software from the Internet.


This link looks like a good start, but a bit more sample code especially on the Ajax part would be very helpful.

Regards

Dion


Hi Dion,What probelms do you have after you've got the output of a control?

Saturday, March 24, 2012

ajax timer problem

Hi..
Iam using Ajax Enabled website in my Project iam using two Ajax Timer controls for displaying
two images in different time one for 5 seconds another for 2 seconds but it is displaying only one image

have you used two update panels for two timer controls?
Try updating panel, once one image is displayed. Then enable another timer.

i.e

timer1.enabled=true;
timer2.enabled=false;

timer1_tick() {
//display image

timer1.enabled=false;
timer2.enabled=true;
updatepanel.update() //if updatemode is set to conditional
}

timer2_tick() {
//display image

timer2.enabled=false;
updatepanel.update() //if updatemode is set to conditional

}


Hi,

I used two update panels for two timer controls then also its not working

protectedvoid HomeImages(object sender,EventArgs e)

{

if (n > 13)

n = 1;

if (n != 4)

{

Image1.ImageUrl =String.Concat("Dimages/image", n.ToString(),".jpg");

}

Image1.ImageUrl ="Dimages/images" + n.ToString() +".jpg";

n++;

homeImages.Enabled =false;Timer1.Enabled =true;

UpdatePanel1.Update();

}

protectedvoid Timer1_Tick3(object sender,EventArgs e)

{

if (k > 6)

k = 1;

Image3.ImageUrl =String.Concat("ClientsImages/clientimage", k.ToString(),".jpg");

// Image1.ImageUrl = "Dimages/images" + n.ToString() + ".jpg";

k++;

Timer1.Enabled =false;

UpdatePanel2.Update();

}


Hi Pathipati,

I have made a sample for your situation. Please wholly copy my source code and have a test.

<%@. 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">public static bool timer1State = false; public static bool timer2State = false; protected void Timer2_Tick(object sender, EventArgs e) { if (timer2State) { Image2.ImageUrl = "~/pic/expand.jpg"; } else { Image2.ImageUrl = "~/pic/collapse.jpg"; } timer2State = !timer2State; UpdatePanel2.Update(); } protected void Timer1_Tick(object sender, EventArgs e) { if (timer1State) { Image1.ImageUrl = "~/pic/expand.jpg"; } else { Image1.ImageUrl = "~/pic/collapse.jpg"; } timer1State = !timer1State; UpdatePanel1.Update(); }</script><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>Untitled Page</title></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"> <ContentTemplate> UpdatePanel1:<%=DateTime.Now.ToString()%> <asp:Image ID="Image1" runat="server" ImageUrl="~/pic/expand.jpg" /> </ContentTemplate> <Triggers> <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick"/> </Triggers> </asp:UpdatePanel> <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional"> <ContentTemplate> UpdatePanel2:<%=DateTime.Now.ToString()%> <asp:Image ID="Image2" runat="server" ImageUrl="~/pic/expand.jpg"/> </ContentTemplate> <Triggers> <asp:AsyncPostBackTrigger ControlID="Timer2" EventName="Tick" /> </Triggers> </asp:UpdatePanel> <asp:Timer ID="Timer1" runat="server" Interval="5000" ontick="Timer1_Tick"> </asp:Timer><asp:Timer ID="Timer2" runat="server" Interval="2000" ontick="Timer2_Tick"> </asp:Timer> </form></body></html>

Best regards,
Jonathan

AJAX Timer control

Hi

I have a problem trying to display the timer control in ajax.

I have installled the controls and the collapsible panel works ok but not the timer control.

below is the code

<asp:ScriptManagerID="ScriptManager1"runat="server"></asp:ScriptManager>

<asp:UpdatePanelID="UpdatePanel1"runat="server">

<ContentTemplate>

<asp:LabelID="Label1"runat="server"Text="Label"></asp:Label>

<asp:TimerID="Timer1"runat="server"Interval="3000">

</asp:Timer>

</ContentTemplate>

</asp:UpdatePanel>

any help wud be great

cheers

The timer does not display anything on the HTML is just a way to call the server side every X amount of time. In Design mode, look at the properties, you'll find an event, double click and will create a method on your code behind. Now you can add any code that will be executed every x amount of time, in your case every 3 seconds.

Ajax Timer & Validators

Hello Everybody,

I have this problem: One page with lots of ASP.NET validation controls and tried to add one AJAX timer that must tick every 20 seconds. My update panel is really simple now, just the timer and a label to show the timer... the problem is that the timer just tick once. I know is due to validation controls 'cause I create a simple test page with just one textbox and a range validator and of course my timer, and after the first tick, it doesn't tick again. I already add this code in the Web.Config for Validators:

<tagMapping>

<addtagType="System.Web.UI.WebControls.CompareValidator"mappedTagType="Sample.Web.UI.Compatibility.CompareValidator, Validators, Version=1.0.0.0"/>

<addtagType="System.Web.UI.WebControls.CustomValidator"mappedTagType="Sample.Web.UI.Compatibility.CustomValidator, Validators, Version=1.0.0.0"/>

<addtagType="System.Web.UI.WebControls.RangeValidator"mappedTagType="Sample.Web.UI.Compatibility.RangeValidator, Validators, Version=1.0.0.0"/>

<addtagType="System.Web.UI.WebControls.RegularExpressionValidator"mappedTagType="Sample.Web.UI.Compatibility.RegularExpressionValidator, Validators, Version=1.0.0.0"/>

<addtagType="System.Web.UI.WebControls.RequiredFieldValidator"mappedTagType="Sample.Web.UI.Compatibility.RequiredFieldValidator, Validators, Version=1.0.0.0"/>

<addtagType="System.Web.UI.WebControls.ValidationSummary"mappedTagType="Sample.Web.UI.Compatibility.ValidationSummary, Validators, Version=1.0.0.0"/>

</tagMapping>

and I added too the Validators.dll... So anyone has an idea of what is missing?

Thanks,

Alejandra

Ok, I solved this problem. I just had to add an "EnableClientValidation = false" to every single validator and it worked, now the timer ticks every 20 seconds... the problem is that I still need to do a couple of Client Validations... hmmm.. I think I would need to do a workaround for this. Any suggestions?

Thanks

AJAX Time entry control

Are there any slick AJAX controls available that would allow a user to select a valid time i.e. 4:20PM? If so then how could I incorporate two of those controls to populate a text box with the time difference between the two values. So Control1 = 4:20PM ; Control2 = 4:30PM ; Textbox1 = 10minutes.

Thanks in advance.

http://www.asp.net/learn/ajax-videos/video-131.aspx

I found a good tutorial that pretty much solves my request to validate Time data entry. It uses the MaskedEdit control and the MaskedEditValidator control.

Now I just have to find the VB command that will do the arithmetic.


Nice one.

Vij

Ajax Textbox Issue

Hi,

I have created a ASp .NET 2.0 Ajax enabled Website. I have two textbox controls on the default page. These controls are added to the UpdatePanel. What I want is, when the first textbox looses focus and moves to textbox2 the datetime should automatically get added to the first textbox.

All I find is the serverchange event of the first textbox. An article on web should that it can be done through onblur but since the textbox control is a server side control, I think onblur will not work.

Please help!!

Thank You,

~B.

You can add onblur in the code behind file if you do something like TextBox1.Attributes.Add("onblur","dothis();");


onblur, onfocus, etc. will work with the server controls. You can also add them right in source view, though the Visual Studio IDE may tell you that they are not supported attributes.


You can use onblur or lostfocus event

TextBox.Attributes.Add("onblur","functionName()");

TextBox.Attributes.Add("lostfocus","functionName()");

Ajax Tabs UI and Data Controls

Hi all

Not too sure if this is covered else where? Does the Ajax Tab control have a display on demand method?

I want to display customer details on an Ajax Tab UI, I could do this with a custom tab but would like to use the MS Ajax framework where possible.

The tabs need to include the following:

tab 1: Customer Summary/Details

tab 2: Customer Contacts

tab 3: Customer Orders/History

and so forth...

My issue is, I don't quite know how to do this as each tab accesses a different DataSource/Stored Procedure to bring back the results. I obviously want to write this in a "best practices" way and therefore avoid long loading times etc... Any help would be greatly be appreciated.

Thanks in advance.

Check this out:http://blogs.msdn.com/sburke/archive/2007/06/13/how-to-make-tab-control-panels-load-on-demand.aspx

-Damien


Thanks Damian, I'll give it a go.

AJAX Tabs in SharePoint Web Part

Has anyone seen an issue like the one below where the AJAX Tab Control's tabs have a white space when used as part of a web part in SharePoint?

Tabs With Blank Spots


Notice the white space slightly overlapping the text on each tab. Also notice that the white space begins at the tabs left most point, but ends before the right most point. Has anyone else seen this issue and resolved it?

Hello,I have exactly the same problem when I use this AJAX Control in my webpart SharePoint, only with IE (with Firefox the display is good). But when I use this AJAX Control in a page .aspx (not in a webpart) the display is normal with IE and Firefox.Actually I don't success to find a solutionSad If anybody has an advice, I am interestedWink Thank you


The solution we have arrived with is as follows...but you will need to get the Ajax Toolkit with Source Code. (This is not tested in Firefox as we are only supporting IE at the current time!!!!! If you try this with Firefox please post the results back!)

Open the Tabs folder of the Ajax Toolkit and change the tabs.css to be:

/* default layout */
/* .ajax__tab_default .ajax__tab_header {white-space:nowrap;} */ <!-- Remove only if you want to allow the tabs to wrap across multiple lines as well. It actually doesn't look bad. -->
.ajax__tab_default .ajax__tab_outer {display:-moz-inline-box;display:inline-block}
.ajax__tab_default .ajax__tab_inner {display:-moz-inline-box;display:inline-block}
.ajax__tab_default .ajax__tab_tab {margin-right:4px;overflow:hidden;text-align:center;cursor:pointer;display:-moz-inline-box;display:inline-block}

/* xp theme */
.ajax__tab_xp .ajax__tab_header {font-family:verdana,tahoma,helvetica;font-size:10px;background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab-line.gif")%>) repeat-x bottom;}
.ajax__tab_xp .ajax__tab_outer {padding-right:4px;background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab-right.gif")%>) no-repeat right;}
.ajax__tab_xp .ajax__tab_inner {padding-left:3px;background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab-left.gif")%>) no-repeat;}
.ajax__tab_xp .ajax__tab_tab {height:21px;padding:4px;margin:0;background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab.gif")%>) repeat-x;}
.ajax__tab_xp .ajax__tab_hover .ajax__tab_outer {background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab-hover-right.gif")%>) no-repeat right;}
.ajax__tab_xp .ajax__tab_hover .ajax__tab_inner {background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab-hover-left.gif")%>) no-repeat;}
.ajax__tab_xp .ajax__tab_hover .ajax__tab_tab {background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab-hover.gif")%>) repeat-x;}
.ajax__tab_xp .ajax__tab_active .ajax__tab_outer {background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab-active-right.gif")%>) no-repeat right;}
.ajax__tab_xp .ajax__tab_active .ajax__tab_inner {background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab-active-left.gif")%>) no-repeat;}
.ajax__tab_xp .ajax__tab_active .ajax__tab_tab {background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab-active.gif")%>) repeat-x;}
.ajax__tab_xp .ajax__tab_body {font-family:verdana,tahoma,helvetica;font-size:10pt;border:1px solid #999999;padding:8px;background-color:#ffffff;}

/* scrolling */
.ajax__scroll_horiz {overflow-x:scroll;}
.ajax__scroll_vert {overflow-y:scroll;}
.ajax__scroll_both {overflow:scroll}
.ajax__scroll_auto {overflow:auto}

Once you have done this recompile the DLL, link it in and deploy your solution. Also...you may find that if you deploy the Ajax Toolkit as part of a solution into the standard "BIN" directory you may get a 403 Forbidden error until an Administrator logs into the system. If you experience this then deploy the Ajax Toolkit to the GAC, this will resolve the issue.


Thank you for your answer. I will test this monday morning at work !Smile


I had a similar problem. It's not really an issue. It was caused by your stylesheet referencing:

You probably have this:

<%@. Page Language="VB" AutoEventWireup="true" CodeFile="Default.aspx.vb" Inherits="_Default" %>
<link href="http://links.10026.com/?link=StyleSheet.css" rel="stylesheet" type="text/css" />
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">


Do this instead:

<%@. Page Language="VB" AutoEventWireup="true" CodeFile="Default.aspx.vb" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<link href="http://links.10026.com/?link=StyleSheet.css" rel="stylesheet" type="text/css" />

You will be fine.


Notice we are using this as part of a SharePoint (actually MOSS 2007) AJAX enabled Web Part. Since we have no idea where the web part will be deployed (what page) modifying the code on the page is not what we want to do. Instead the modifications within the CSS have allowed us to deploy our web part with the tab control within it and not have to worry about where the CSS refernece appears on the page.


Make sure the doctype is XHTML. That used to occur before I upgraded our app from HTML 4. The toolkit is not 100% compatible with HTML 4. I'm not using SharePoint, but it shouldn't make a difference.


I am having the same problem, and i have compiled your suggestion. It now works in IE, but now the right side of each tab is jacked up in Firefox.


It seems to look just fine on our site.

Our site is a MOSS 2007 site, we have not used this on any other older technologies.


I have not tried any other methods 1) because we needed the issue solved quickly and 2) because we wanted to modify some of the other behaviors like allowing the tabs to wrap. I don't think you will be able to because you cannot get access to the Tab objects to modify their CSS class setting.

On the other hand we believe that we have found the culpret to this issue. Its appears if you ever to a response.write during a page load and have malformed HTML then the issue of the white space occurs, even on ASP.NET sites. We have not dug into the MOSS 2007 page to see where this could be occuring or how to fix it, but it is the most likely source of the issue.

Wednesday, March 21, 2012

AJAX TabPanels and user defined controls

Hi,

I've built a control in which I implement the behaviour described in this video:How Do I: Trigger an UpdatePanel Refresh from a DropDownList Control? Basically, I want to update the nodes of a TreeView when I change the item in a DropDownList.

This works great except if I load the control dynamically into a tab panel...In this case, the first SelectedIndexChanged event doesn't trigger anything and all of the following events trigger a full page postback...

So, to sum this up:

    User control statically defined in a page -> OKUser control statically defined in a tab panel -> OK (it works when I put the code of the control inside the tab panel)User control dynamically loaded into a placeholder -> OK (using PlaceHolder1.Controls.Add(Page.LoadControl("WebUserControl.ascx"));)User control dynamically loaded into a tab panel -> NOT OK! (using both TabPanel1.Controls.Add(Page.LoadControl("WebUserControl.ascx")); and TabPanel1.ContentTemplate = Page.LoadTemplate("WebUserControl.ascx");)

I can't put the code of the control inside the tab panel statically (point 2 in the previous list) because the tab panels are being generated dynamically also...

Anyone has suggestions to solve this, please??

When are you adding these dynamically created controls? It sould be during the Page_Init event and not later (such as during the Page_Load).


I'm not adding the controls in the Page_Init as I can't do that...when my page first loads it has only a DropDownList with a list of options.

Then, when the selected option is changed, there is a postback (as the DropDownList has AutoPostBack = "True") and only then the tabs are created and the user control is loaded.

The user defined control is being rendered and is visible, but its behaviour is strange...


If you dynamically add your contorls into an updatepanel, the issue comes.

There are few good articles written byScott Mitchell on dynamically loading Controls which you will find in the following links:

Dynamic Controls in ASP.NETWorking with Dynamically Created ControlsDynamic Web Controls, Postbacks, and View State