JavaScript in ASP.Net

Question

I have this code that wants to change the background color of the webpage after clicking a button. I have no CSS for this webpage is just an empty asp.net page

<asp:Button ID="btn_Change" runat="server" Text="Change"  OnClientClick="changeBackground()" />
        <script language="JavaScript">
            function changeBackground()
            {

                document.body.style.backgroundColor = "#eeeeee";
                document.getElementById('<%=txtBox3.ClientID %>').style.backgroundColor = "#00FF00";

            }
        </script>

now the problem is the change only occurs on the click and not staying after the click. How do I make the change stay permanently?

Do you mean that after you refresh the page the change does not stay? — Stan
– Stan, Commented Apr 21, 2014 at 19:44
Assign the color you want to a variable, and have it change whenever the page is painted out, rather than just a button click. — durbnpoisn
– durbnpoisn, Commented Apr 21, 2014 at 19:45

Quentin · Accepted Answer · 2014-04-21 19:45:03Z

1

Store the fact that the change has been made somewhere persistent (such as a cookie, local storage or (having made an Ajaxy HTTP request) the server).

On page load, test the place you are storing the data to see if the fact has been stored there. If it has, call the function that makes the change.

answered Apr 21, 2014 at 19:45

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

Sign up to request clarification or add additional context in comments.

Comments

AdamRoof · Accepted Answer · 2014-04-21 19:45:26Z

1

The easy way would be to return false, I think its posting back after the click, causing refresh...

OnClientClick="changeBackground();return false;"

or

OnClientClick="return changeBackground()"

and modify JS adding return false; after last line

document.body.style.backgroundColor = "#eeeeee";
document.getElementById('<%=txtBox3.ClientID %>').style.backgroundColor = "#00FF00";
return false;

answered Apr 21, 2014 at 19:45

AdamRoof

2743 silver badges11 bronze badges

2 Comments

user3557815 Over a year ago

yes it worked thanks. but does return false stops the postback? because I want to minimize the server workload

AdamRoof Over a year ago

In this situation, yes, it stops further action from the server control.In jQuery it be like function(e) { e.preventDefault(); }

Bura Chuhadar · Accepted Answer · 2014-04-21 19:48:44Z

In this scenario you don't really have to use asp:Button if you are not doing anything on the server side. You should use a normal html button so that you can submit your form later:

<input type="button" ID="btn_Change" value="Change"  onclick="changeBackground()" />
            <script language="JavaScript">
                function changeBackground()
                {

                    document.body.style.backgroundColor = "#eeeeee";
                    document.getElementById('btn_Change').style.backgroundColor = "#00FF00";

                }
            </script>

Or you can try returning false, this will avoid the post_back. But that is unnecessary:

 <asp:Button ID="btn_Change" runat="server" Text="Change"  OnClientClick="changeBackground()" />
            <script language="JavaScript">
                function changeBackground()
                {

                    document.body.style.backgroundColor = "#eeeeee";
                    document.getElementById('<%=txtBox3.ClientID %>').style.backgroundColor = "#00FF00";
return false;

                }
            </script>

Collectives™ on Stack Overflow

JavaScript in ASP.Net

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related