Going For AJAX: reset

Showing posts with label reset. Show all posts

Wednesday, March 28, 2012

How Do I Reset Scroll Position Inside UpdatePanel?

Hello,

I have a UserControl inside an UpdatePanel. The UserControl contains several DIVs that I show and hide through partial postback. I want the contents of each DIV to be scrolled to the top when I show it. I have tried using the ScriptManager to set focus onto the topmost control of each DIV when I show it, but it doesn't work. I have also tried through javascript to no avail. I know this is kind of the opposite of the behavior that many folks want from AJAX, but I need it for this piece of my application. I have tried searching but all examples are page-centric, not usercontrol-centric and speak to SmartNavigation.

Any help is appreciated.

Brendan

not sure if this would help, but I found something interestingin terms of firing off some js code during a partial page update :

http://ajax.asp.net/docs/ClientReference/Sys.WebForms/PageRequestManagerClass/default.aspx

It was particularly useful for displaying a message to the user to indicate something was happening...

Good luck,

Bob

I ended up just using this in the codebehind of the ascx:

ScriptManager.RegisterStartupScript(Page,typeof(PageTemplate),"Focus","focus();",true);

And including this function in a .js file (one line for each section):

Seems to work on all but the initial page change, which is 'good enough' for me at this stage.

How do I reset a ModalPopup?

How do a reset the contents of a ModalPopup that has been closed (using the .Hide() method or by clicking the cancel button) to it's initial state (at page load)?

I am using a ModalPopup control that contains a UserControl that allows users to search for records in a database. If they find a match, they can click the 'Select' link in the GridView (where the subsequent event handler calls the ModalPopup.Hide() method). They can also click on the Cancel button to close the popup if they don't find what they are looking for.

Everything is working perfectly, except after the ModalPopup has been used once, subsequent use shows the ModalPopup in the exact state it was when it was closed, either by the .Hide() method or the cancel button.

Is there a way around this?

If its a usercontrol in the modalpopup why not create a public reset method in the usercontrol to set all the values back to "" or whatever needs to be done. You could call that right before your .hide(). It sounds like the viewstate of the controls are on. You may be able to kill viewstate on your usercontrol or set initial values, but that could potentially cause problems depending if your user control posts back a bunch of times.

HTH,

AjaxButter

I have started down the road of creating a .ResetForm() method for the user control and will see if that works.

I am hopeful that your suggestion about disabling the ViewState will work, since ideally the ModalPopup should be at it's initial state whenever it's loaded and this would involve the least amount of effort (and code to test). The only issue here might be the use of UpdatePanels for partial-page postbacks (both in the main page on in the popup), so it might not work as hoped.

I guess my best option will be to leave the ModalPopup.TargetID property blank (if it's not required) and handle showing the popup from a button Click() event that resets the UserControl first.

Thanks for the assistance.

Creating a reset event in the UserControl and calling it after certain events works for simple controls (manually created and handled forms). There are still some issues remaining...

Trapping the cancel button click event and performing a reset there causes a full page refresh since it's not wired up through the ModalPopupExtender control (and it can't be part of the UpdatePanel in the popup). Maybe I'm doing something wrong here?

If the ModalPopup contains a UserControl with a FormView (for inserting & updating), the data remains as is after the cancel button is clicked. I tried disabling the ViewState, but since the page has not been refreshed, the FormView stays the same. I also tried creating a _Click() method for the cancel button, but the event doesn't seem to get called for some reason.

Do I have to do some funky client-side scripting to get this to work?

Nevermind... I did some more playing and figured out what I was doing wrong. Staring at it for too long sometimes prevent you from seeing the forest through the trees! Wink

If I moved the cancel button into the UpdatePanel in the popup (and left the ModalPopupExtender.CancelControlID property blank), then this started to work as hoped (without the full page refreshes).

Resetting the FormView inside the UserControl turned out to be as simple as calling for the FormView.ChangeMode() method and setting it to the default mode (insert in this case) and then calling the DataBind() method (may not be needed?).

If anyone else agrees, please mark this post as an answer.

Monday, March 26, 2012

How do i clear/reset a cascadingdropdown?

i have three dropdownlists. once i've selected third i fire a postback using the third dropdown's autopostback property. my question is how do i get all the dropdowns to reset back to their prompt messages ready to be used again.

i've tried changing the selectedindexes for the dropdowns to 0 and -1 but that doesn't work

Check outthis thread.

isn't there an easier way of doing this? Seems like a lot of work just to reset the dropdownlists

Hi Iljones,

Based on my research, I think the best solution is to modify the source code to meet your expectation. Here is another sample, please add the code below to your source code. When the last CascadingDropDown populated , onpopulated function will be called and it will set the first CascadingDropDown's selectedIndex to be 0.

Hope this help.

Best Regards,

Jonathan

Jonathan Shen – MSFT:
Hi Iljones,
Based on my research, I think the best solution is to modify the source code to meet your expectation. Here is another sample, please add the code below to your source code. When the last CascadingDropDown populated , onpopulated function will be called and it will set the first CascadingDropDown's selectedIndex to be 0.
<script type="text/javascript" language="javascript">
var flag = true;
function pageLoad(sender, args){
$find("myCDECity").add_populated(onpopulated);
}
function onpopulated(sender,args){
if(flag){
flag = false;
$get("<%=dlState.ClientID%>").selectedIndex = 0;
$find("myCDECity")._onParentChange(false);
$get("<%=dlCity.ClientID%>").disabled = true;
}
}
</script>
Hope this help.
Best Regards,
Jonathan

i'll give this a go today and let you know how it goes. Thanks Jonathan

Probarly to late, but here is an answer anyway.

CS: protected void Reset_Click(object sender, EventArgs e) { CascadingDropDown1.SelectedValue = null; }

Wednesday, March 21, 2012

How can I reset the AJAX Timer component if the mouse is moved!

I have a few pages that use UpdatePanels and Timer components to refresh the content periodically. However I need to have it refresh only when the mouse hasn't been moved for a minute so it doesn't interrupt the user.

I have been using a javascript timer to refresh a custom component that uses callbacks but it is interfering with the AJAX UpdatePanel and causing State Corruption so I would like an all AJAX solution if possible.

Question 1: Can mouse movement reset an Ajax Timer, if so how?

Question 2: Is there a way to trigger the UpdatePanel from Javascript?

1. Use the method show here to get a refrence to the behavior for the timer, thenhttp://ajax.asp.net/docs/ClientReference/Sys.UI/BehaviorClass/BehaviorGetBehaviorsByName.aspx, call

Sys$UI$_Timer$_stopTimer & then this

Sys$UI$_Timer$_startTimer

Not sure if that will work exactly, but, through that or somthing similar you should be able to manipulate the timer on the client side.

2. Take a look at this post, it has a few differnt examples of how to do an update from javascript:http://forums.asp.net/thread/1541012.aspx

Thanks for the help there. I now need to figure out which behaviour name to look for in the timer, i guess?

Easily referencing behavior instances

It used to be tricky to get a reference to a behavior from client script, but now you can simply add a "BehaviorID" attribute to your control's property specification and it will be easily accessible on the client via ASP.NET AJAX's Sys.Application.findComponent(id) method or its $find(id) shortcut. (Note: If BehaviorID isn't specified, the behavior's ID on the client will be the same as the extender control's ClientID.) See DynamicPopulate or ResizableControl for examples.

I guess I should have added... that its used for the AJAX toolkit, so you might not be able to specify the BehaviorID, but you still should be able to get it with the find method.

I have tried the following code but it doesn't change the timer, it still goes off after a minute:

code = "function MainMenuPage_onmousemove(){"
code += " var b = $find('" & MT.ClientID & "');"
code += " if(b){"
code += " mouse_moved=1;"
code += " b.Sys$UI$_Timer$_stopTimer;"
code += " b.Sys$UI$_Timer$_startTimer;"
code += " }"
code += "}"

Please excuse the code formatting above (I create strings of the code snippets I need for the page and then useRegisterClientScriptBlock)

I'm not receiving any Javascript errors when I move the mouse. I know it's finding MT.ClientID as I use another javascript timer to display the mouse_moved variable. Perhaps I'm not changing the actual instance of the timer? Wild guess here. I really need to have more time to study the nitty gritty bits of AJAX but as it is I hardly have time to do this much.

I appreciate your time on this. I hope you have more bright ideas because I'm fresh out.

I tested the below code & it seems to work ... notice how i removed the Sys$UI$_Timer$ from the method call and added a () at the end

 code ="function MainMenuPage_onmousemove(){"; code +=" var b = $find('" + Timer1.ClientID +"');"; code +=" if(b){"; code +=" mouse_moved=1;"; code +=" b._stopTimer();"; code +=" b._startTimer();"; code +=" }"; code +="}";

Awesome. That worked.

Thank you very much.