Home All Groups Group Topic Archive Search About

Built-In JavaScript-Rendering Functions

Author
29 Apr 2006 9:15 PM
Alex Maghen
Hi. What's the most elegant way, in ASP.NET 2.0, to cause certain client-side
things to happen without writing my own JavaScript? Here are some of the
things I'd like to be able to do...

* When I'm finished doing stuff in Page_Load(), I'd like the cause the page
to scroll to a specific anchor or to the top or bottom of the page.

* When the page is finished loading, I want to be able to programmatically
designate a text-box to have the focus for user entry.

Is there any built-in server-side code I can call that will cause the
appropriate client-side JavaScript to be rendered to the client to do these
things?

Author
1 May 2006 4:03 AM
Steven Cheng[MSFT]
Hi Alex,

Thank you for posting.

As for the script rendering and manipulating functions in ASP.NET 2.0 you
asked, here are some of my understanding and suggestoin:

1.* When I'm finished doing stuff in Page_Load(), I'd like the cause the
page
to scroll to a specific anchor or to the top or bottom of the page.
==========================================
So far for scrolling, ASP.NET 2.0's page class hasn't provided built-in
methods to do this work. We may still have to use some custom client-side
script to scroll page to a certain position. For example, the following
script just help to scroll to a client-side html element:

================
function ScrollToElement(theElement)
{


  var selectedPosX = 0;
  var selectedPosY = 0;

  while(theElement != null){
    selectedPosX += theElement.offsetLeft;
    selectedPosY += theElement.offsetTop;
    theElement = theElement.offsetParent;
  }


window.scrollTo(selectedPosX,selectedPosY);

}
================


2. * When the page is finished loading, I want to be able to
programmatically
designate a text-box to have the focus for user entry.
==========================================
For set a focus a a certain input field(textbox), ASP.NET 2.0 page class
rpovide the "SetFocus" method, which take a control instance as input
parameter, this can help set the focus on the certain control after the
page get loaded on client.

#Page.SetFocus Method (Control)  
http://msdn2.microsoft.com/en-us/library/e04ah0f4(VS.80).aspx

e.g:

protected void Button1_Click(object sender, EventArgs e)
    {
        Page.SetFocus(this.Label7);
    }



3. Is there any built-in server-side code I can call that will cause the
appropriate client-side JavaScript to be rendered to the client to do these
things?
==========================================
for registering script code that will be executed after the page get loaded
at client browser, we're recommended to use the
Page.ClientScript.RegisterStartupScript function.


#ClientScriptManager.RegisterStartupScript Method (Type, String, String)
http://msdn2.microsoft.com/en-us/library/asz8zsxy.aspx


And for the case that we want to dynamically register the script code that
scroll the page to a certain control/element, we can use the below code in
codebehind together with the scrpit function mentioned in #1:

===============
string script = "ScrollToElement(document.getElementById('{0}'));";

        Page.ClientScript.RegisterStartupScript(this.GetType(), "scroll",
            string.Format(script, this.a1.ClientID),
            true);
================

Hope this helps.

Regards,

Steven Cheng
Microsoft Online Community Support


==================================================

When responding to posts, please "Reply to Group" via your newsreader so
that others may learn and benefit from your issue.

==================================================


This posting is provided "AS IS" with no warranties, and confers no rights.



Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)
Author
1 May 2006 2:31 PM
Alex Maghen
Thanks so much!

Show quote
"Steven Cheng[MSFT]" wrote:

> Hi Alex,
>
> Thank you for posting.
>
> As for the script rendering and manipulating functions in ASP.NET 2.0 you
> asked, here are some of my understanding and suggestoin:
>
> 1.* When I'm finished doing stuff in Page_Load(), I'd like the cause the
> page
> to scroll to a specific anchor or to the top or bottom of the page.
> ==========================================
> So far for scrolling, ASP.NET 2.0's page class hasn't provided built-in
> methods to do this work. We may still have to use some custom client-side
> script to scroll page to a certain position. For example, the following
> script just help to scroll to a client-side html element:
>
> ================
> function ScrollToElement(theElement)
> {
>
>
>   var selectedPosX = 0;
>   var selectedPosY = 0;
>              
>   while(theElement != null){
>     selectedPosX += theElement.offsetLeft;
>     selectedPosY += theElement.offsetTop;
>     theElement = theElement.offsetParent;
>   }
>        
>                                   
>  window.scrollTo(selectedPosX,selectedPosY);
>
> }
> ================
>
>
> 2. * When the page is finished loading, I want to be able to
> programmatically
> designate a text-box to have the focus for user entry.
> ==========================================
> For set a focus a a certain input field(textbox), ASP.NET 2.0 page class
> rpovide the "SetFocus" method, which take a control instance as input
> parameter, this can help set the focus on the certain control after the
> page get loaded on client.
>
> #Page.SetFocus Method (Control)  
> http://msdn2.microsoft.com/en-us/library/e04ah0f4(VS.80).aspx
>
> e.g:
>
>  protected void Button1_Click(object sender, EventArgs e)
>     {
>         Page.SetFocus(this.Label7);
>     }
>
>
>
> 3. Is there any built-in server-side code I can call that will cause the
> appropriate client-side JavaScript to be rendered to the client to do these
> things?
> ==========================================
> for registering script code that will be executed after the page get loaded
> at client browser, we're recommended to use the
> Page.ClientScript.RegisterStartupScript function.
>
>
> #ClientScriptManager.RegisterStartupScript Method (Type, String, String)
> http://msdn2.microsoft.com/en-us/library/asz8zsxy.aspx
>
>
> And for the case that we want to dynamically register the script code that
> scroll the page to a certain control/element, we can use the below code in
> codebehind together with the scrpit function mentioned in #1:
>
> ===============
> string script = "ScrollToElement(document.getElementById('{0}'));";
>
>         Page.ClientScript.RegisterStartupScript(this.GetType(), "scroll",
>             string.Format(script, this.a1.ClientID),
>             true);
> ================
>
> Hope this helps.
>
> Regards,
>
> Steven Cheng
> Microsoft Online Community Support
>
>
> ==================================================
>
> When responding to posts, please "Reply to Group" via your newsreader so
> that others may learn and benefit from your issue.
>
> ==================================================
>
>
> This posting is provided "AS IS" with no warranties, and confers no rights.
>
>
>
> Get Secure! www.microsoft.com/security
> (This posting is provided "AS IS", with no warranties, and confers no
> rights.)
>
>
>
>
Author
2 May 2006 1:25 AM
Steven Cheng[MSFT]
You're welcome Alex,

Glad to be of assistance.

Regards,

Steven Cheng
Microsoft Online Community Support


==================================================

When responding to posts, please "Reply to Group" via your newsreader so
that others may learn and benefit from your issue.

==================================================


This posting is provided "AS IS" with no warranties, and confers no rights.



Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)

AddThis Social Bookmark Button