Develop Reference

Can we use HttpHandler and HttpModule to change the content page div from the Master page?

In my application i create a navigation menu dynamically. When I click on the anchor tags that refer to various content page I want to capture the anchor tags' text and display it in a div in the content page.
How can i possibly achieve this?
Can it be done through HttpHandlers? or do I need to look into something else??? Please help.

Assuming that you want your div to look different or be positioned in different places for each content page and all you want to display in that div is the page URL you can solve this using a simple script that you can add in your master page:
document.onload = function()
{
var titleDiv = document.getElementById("titleDiv");
titleDiv.innerText = window.url;
}
The only constraint is that your div must have the same id in all the content pages.

How to slide Update Panel content after updating

I have an Update Panel that contains an image and a button. Image control displays one image at a time when clicked on "Next Image" Button and previous image on clicking "Previous Image" button. Code sample is something like this
protected void btnNext_Click(..)
{
Image1.ImageUrl=getNextImageFromDatabase();
UpdatePanel1.Update();
}
protected void btnPrevious_Click(..)
{
Image1.ImageUrl=getPreviousImageFromDatabase();
UpdatePanel1.Update();
}
Now what I want to know is that is there any way I can slide image or whatever content in update panel to left when clicked on "Next Image" and similarly to right when clicked on "Previous Image"? Is there any way using AjaxToolKit or JQuery?

You can you use the jquery fadeIn fadeOut methods which will look like a slide effect
See example here http://api.jquery.com/promise/#example-1

With Jquery you can simply animate margin-left to negative values, so Image would disapear. I personaly use this solution:
User clicks on next/prev button
Show loading image (a gif)
Create image (var img = new Image()) in javascript
set onload action for that image to move old one to left/right and append new image etc.
get next/prev image url
assign src of the created image, so when it's loaded the onload action is executed.
AjaxToolkit might not be the cleanest solution in this case. You will probably need to make some simple service that returns nex/prev image url, but that's only few lines of code...

How to add css to a asp.net web application

I am starting a new asp.net web app class (using c#). For my first lab I need to create a simple web page with a couple button. I have already made the page with the buttons and text. When you press the button it needs to change the text color using in-line css. How would I go about adding the in-line css to the button. Would I add some sort of C# code in the button to enable css? I am quite confused how to add the css to the web app. Any ideas?

From your question it sounds like you want to add inline css to some sort of element containing text when you click a Button?
protected void btn_Click(object sender, EventArgs e)
{
string inlineCss = "your css goes here";
//I'm assuming the text you want to apply css to is a Label with ID=label
label.Attributes.Add("style", inlineCss);
}

Try this on click event
HtmlLink css = new HtmlLink();
css.Href = "css/fancyforms.css";
css.Attributes["rel"] = "stylesheet";
css.Attributes["type"] = "text/css";
css.Attributes["media"] = "all";
Page.Header.Controls.Add(css);
If needs inline
txtmyCtrl.Style.Add(HtmlTextWriterStyle.Color,"#33cc45");

Fix for Anchors while using faux full height Columns in CSS

When the Page_Load event gets called to load the page, how would I have the page load already scrolled to a particular id. I cannot use a named anchor # because it breaks my css.
I can use javascript's scrollto function but i don't know how to call javascript from the asp.net page_load event.
I have several headers, and a menu that sorts the contents within each header. So each header has a sort menu. When I sort say Header 2 by "Oldest" I reload the page and change the orderby stuff in my sql and repopulate the repeater under each header. On load I would like the page to load already scrolled to Header 2. I would normally just use #Header2 on the redirect, but I can't use the this anchor method because it breaks my code.
Is there any neat method to accomplish this?
The css issue has to do with full length columns and having a border in the gutter. I know I can use images, but the nature of my pages would require the css to be dynamic to account for the different widths and apply the appropriate background image.

I ended up setting the <body> tag to runat="server" and assigning an id="body". I then added this code in the Page_Load event:
if (Request.QueryString["view"] != null && Request.QueryString["view"] != "")
{
body.Attributes["onload"] = "scroll('" + Request.QueryString["view"] + "');";
}
else //Probably redundant, but I have partial postbacks
{
body.Attributes.Remove("onload");
}
It calls this JS function:
function scroll(id)
{
var a = document.getElementById(id);
if (a != null) {
window.scrollTo(0, a.offsetTop);
}
}
So instead of using #header2, I use a querystring of view=header2 because I have to do a postback anyway. If I just want to go to a named anchor I use onclick="scroll('header2')" in the link.

how to print the content of a label or panel in asp.net?

I have a label control in a page in asp.net 2.0 and a button Print.
Clicking on print button I need to print the content of the label and I need same for a panel also.
Is it possible to implement this?
If yes then how to implement that?
Please help.

What about Window.Print() method? Because execcommand method will not work other browsers that IE. Use CSS media option to control the print area.

You would need to add some client side javascript to your Print button to execute the brower's print command. The javascript below could be used to print the whole document page and would be a good place to start. Note: It isn't possible to do this without displaying the print dialog unless you use a third party component.
// Print Page
window.print();
If you wanted just to print certain sections of your page you can achieve this two ways. Firstly, you could render the content to be printed into a hidden iframe and then print just that frame. You would do this using the same code as above only from within the frame itself.
Secondly, you could use a media style print style sheet, a CSS that applies only when printing. Inside this sheet you would set the styles you wanted to print as normal and the styles you didn't want to print to "display:none". The link below contains more information on print stylesheets.
http://www.webcredible.co.uk/user-friendly-resources/css/print-stylesheet.shtml

One more approach could be to open new window and populate the contents of div you wanted to print and have print link/button on that page.
Ex:
var win = window.open(...)
win.document.body.appendChild(document.getElementById('divToPrintId'))
This is how the code will look like this approach is used to print the content/part of the page.

Use below code in button onclick event
ClientScript.RegisterStartupScript(this.GetType(), "PrintOperation", "PrintGridData()", true);
Above link will call function named PrintGridData() which is written in head section as below
<script type="text/javascript">
function PrintGridData()
{
var prtGrid = document.getElementById('<%=GridView.ClientID %>');
prtGrid.border = 0;
var prtwin = window.open('', 'PrintGridViewData', 'left=100,top=100,width=1000,height=1000,tollbar=0,scrollbars=1, status=0,resizable=1');
prtwin.document.write(prtGrid.outerHTML);
prtwin.document.close();
prtwin.focus();
prtwin.print();
prtwin.close();
}
</script>
in this script it will only print div name GridView and other part will not be printed