如果页面大小小于700px，asp.net重定向到另一个URL

Question

I have a page eg desktop.aspx?customerID=345 & mobile.aspx?customerID=345 . Both pages have same functionality. So supposer user goes here desktop.aspx?customerID=345 and screen size is less then 700px then it should redirect to mobile.aspx?customerID=345 . Now with Jquery I can do this redirect but here I have dynamic query string as well.

Is it possible to detect screen size in code behind of .aspx file?

Answer 1

To check the screen and browser width you can use javascript match media:

For browser:

var isBrowserLessThan700 = (window).matchMedia('screen and (max-width: 700px)').matches;

For the screen:

var isDeviceLessThan700 = (window).matchMedia('screen and (max-device-width: 700px)').matches;

And if result is true:

   window.loacation.href= "What-You-Want";

Answer 2

Solution 1:- Create a hidden field variable in the client side.

.ASPX File:-

<asp:HiddenField ID="hdncustomerID" runat="server" />

Script:-

<script type="text/javascript">
 var hdncustomerID = $('hdncustomerID').Val(); //if u use Jquery

        $(document).ready(function () {
            if ($(window).width() < 700) {
                window.location = mobile.aspx?customerID=123;
            }
        });
</script>

Solution 2:-

protected void Page_Load(object sender, EventArgs e)
    {
        var CustomerID = 1;

        StringBuilder strScript = new StringBuilder();
        strScript.Append("<script type=\"text/javascript\">");
        strScript.Append("$(document).ready(function () {");
        strScript.Append("if ($(window).width() < 700) {");
        strScript.Append("window.location = mobile.aspx?customerID='");
        strScript.Append(CustomerID);
        strScript.Append("';");
        strScript.Append("}");
        strScript.Append(" });");
        strScript.Append("</script>");

        ClientScriptManager script = Page.ClientScript;
        script.RegisterClientScriptBlock(this.GetType(), "redirect", strScript.ToString());

    }

Hope Its Work !!!