views:

50

answers:

3

Hello

I'm calculating the screen size of the browser and storing it in a hidden field and i'm dynamically creating controls on the page OnInit() based on the sizes. But OnInit() is getting fired before javascript function fires to calculate the screen size.

Any ideas?

A: 

try using

Request.Browser.ScreenPixelsHeight
Request.Browser.ScreenPixelsWidth

instead of javascript to find out screen resolution

Vinay B R
But i think it wont give the viewport width and height. I want to exclude the height of the status bar and the top bars of the browser from the height. Will it work?
NLV
the only other thing to do would be to register a script to do the size correction for controls.
Vinay B R
+3  A: 

The OnInit method you refer to seems to me the OnInit method in ASP.NET's page loading cycle. Since JavaScript is client-side (i.e., it runs on the browser) and C# / ASP.NET is server-side (i.e., it runs on the server, inside IIS), it will always be triggered prior to any javascript function runs.

The approach you have chosen requires two cycles: first the page is requested and you can set the hidden fields with your JavaScript method. This page is then auto-posted-back to the server and you calculate the heights and widths of your items.

However, this approach will give you a lot of headaches, now and in the future. It is often better to solve layout problems that depend on the browser's viewport (the size you talk of) solely on the client side. An excellent start is CSS. If CSS can't solve it, use jQuery (or alternatives).

Abel
Since the controls are dynamically created i can't assert which controls' size has to be adjusted based on the screen size after the page is delivered to the browser. I want the dynamic controls to fit to the browser width and height.
NLV
@NLV: That's why I suggest that you need to do an empty page redirect to assess the client's screen height etc. But even then, what happens when someone resizes the browser window? Use CSS in your case, to fit to the browser's width and height (i.e.: `width: 100%` or other percentages). Or maybe I misunderstand something about your question that prevents you from using CSS?
Abel
Okie, i got your point. Thanks for the response.
NLV
A: 

An easier implementation probably is to redirect the user to an intermediate page (a dummy page which displays "please wait, loading..." kind of message). On this page, you could calculate all your screen size and then pass it over to the actual page you want to resize.

So, you'd redirect to the intermediate page first, calculate the screen size and then load the actual page (that you want to resize) with the screen size info you calculated in the intermediate page.

Josh
Sounds similar to my answer ;-). While this is a solution, it's an awkward design, esp. for something that ideally should be treated with proper use of CSS.
Abel