CODEWITHSUNDEEP
javascriptasp.net
mum
mum

Reputation: 1645

How change width/Height of an asp control?

<script language="javascript" type="text/javascript">
function resize()
{ 
//alert("ok");
       var e = document.GetElementById("ImageEdit");
      e.style.width = "500px";

}
</script>


 <asp:Image ID="ImageEdit" runat="server"  BorderWidth="4"  Width="120px" Height="120px"  name="Image1"  /></td></tr>

 <input id="Button1" type="button" value="button"  onclick="resize();" />

Why doesn't ImageEdit change width ?

Upvotes: 0

Views: 4410

Answers (2)

Denys Wessels
Denys Wessels

Reputation: 17049

Seany84's answer is correct, however if you're planning to be using a lot of java script in your project I would suggest using jQuery.It makes working with java script a walk in the park!

<head runat="server">
    <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script language="javascript" type="text/javascript">
        $(document).ready(function () {
            $("#Button1").click(function () {
                $("#ImageEdit").width("500px");
            });
        });
    </script>
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <asp:Image ID="ImageEdit" runat="server" BorderWidth="4" Width="120px" Height="120px" name="Image1" />
    <input id="Button1" type="button" value="button" />
    </form>
</body>

Upvotes: 1

Seany84
Seany84

Reputation: 5596

It is:

getElementById()

and not:

GetElementById()

Can't believe I didn't spot that earlier.

Full code sample:

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script language="javascript" type="text/javascript">
        function resize() {
            var x = '<%= ImageEdit.ClientID %>';
            alert(x);
            var e = document.getElementById('<%= ImageEdit.ClientID %>');
            e.style.width = "500px";
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <asp:Image ID="ImageEdit" runat="server" BorderWidth="4" Width="120px" Height="120px" name="Image1" />

        <input id="Button1" type="button" value="button" onclick="resize();" />
    </form>
</body>
</html>

Upvotes: 2

Related Questions