Solved

How do I Get ClientID using Javascript in .NET User Control?

Posted on 2009-04-01
6
7,133 Views
Last Modified: 2012-05-06
For my web application I have an image control within a user control.  When the user clicks this image I want to change some of the properties, such as the width and height.  How do I get the correct rendered Clientid for this image?  I want to use it with getElementById().  FYI, There could be multiple instances of the user control on the main page.  

I was trying to use the user function GetClientId(strid) (see my code).  GetClientId() returns  "Button1" instead of "imgSignatureCapture".  "Button1" is a button on the main page, not on the user control.  

Any help is greatly appreciated!
<img id="imgSignatureCapture" src="pencil-icon.jpg" 

        style="width: 40px; height: 40px" onclick="test();" />
 

function GetClientId(strid)

{

     var count=document.forms [ 0 ] . length ;

     var i = 0 ;

     var eleName;

     for (i = 0 ;  i < count ;  i++ )

     {

       eleName = document.forms [ 0 ] . elements [ i ] .id;

       pos=eleName.indexOf ( strid ) ;

       if(pos >= 0)  break;           

     }

    return eleName;

 }

 

function test()

{

    alert("GetClientId('imgSignatureCapture') = " + GetClientId('imgSignatureCapture'));  
 

    document.getElementById(GetClientId('imgSignatureCapture')).style.height = "75px" 

    document.getElementById(GetClientId('imgSignatureCapture')).style.width = "75px"

}

Open in new window

0
Comment
Question by:thespiceman
6 Comments
 
LVL 4

Expert Comment

by:y0usuf
ID: 24045705
I think you don't need to look for the clientid of the image. Because the image is html control(you don't have runat="server") you should be able to do document.getelementbyid in your usercontrol and get the image control in javascript.

 If it is a server side control you can use some thing like.
try using document.getElementById("<%=imgSignatureCapture.ClientID %>") in your usercontrol.


Or  aslo you can do is do the page 'View Source' and get the html id of the control and use it in javascript. (This is a bad way but it works)

0
 
LVL 12

Accepted Solution

by:
funwithdotnet earned 500 total points
ID: 24045856
Your function only loops through the main layer of for elements, not elements contained within. It will return the last element in the form if no match is found.

I would probably do something like this:
<img id="imgSignatureCapture" src="pencil-icon.jpg" 

        style="width: 40px; height: 40px" onclick="test(this);" />
 

function test(obj)

{

    alert("obj id= " + obj.id);  

    obj.style.height = "75px" 

    obj.style.width = "75px"

}

Open in new window

0
 

Author Comment

by:thespiceman
ID: 24045943
document.getElementById("<%=imgSignatureCapture.ClientID %>").style.height = "75px"  
causes an object not found error.
0
 

Author Comment

by:thespiceman
ID: 24046059
funwithdotnet,

Your solution does allow me to access the image file...great!  But I'm not sure if this is the total solution I need.  Here's why...

I simplified my problem with just an image control.  What I really need is to change properties on both the image and an ActiveX control.  Here's the HTML for the ActiveX:
<OBJECT classid="clsid:69A40DA3-4D42-11D0-86B0-0000C025864A"  

            id="SigPlus" name="SigPlus" CODEBASE="http://www.topazsystems.com/Software/sigplus.cab"   

            style="HEIGHT: 1px; LEFT: 0px; TOP: 0px; WIDTH: 1px; visibility:hidden; vertical-align:middle" 

            VIEWASTEXT>

            <PARAM NAME="_Version" VALUE="131095">

            <PARAM NAME="_ExtentX" VALUE="4842">

            <PARAM NAME="_ExtentY" VALUE="1323">

            <PARAM NAME="_StockProps" VALUE="0">

            

        </OBJECT>

Open in new window

0
 
LVL 6

Expert Comment

by:havj123
ID: 24046838
use this to find client id

<script type="text/javascript">
  var txtUsernameID = '<%= txtUsername.ClientID %>';
  var txtPasswordID = '<%= txtPassword.ClientID %>';
</script>
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Today I had a very interesting conundrum that had to get solved quickly. Needless to say, it wasn't resolved quickly because when we needed it we were very rushed, but as soon as the conference call was over and I took a step back I saw the correct …
This article will give core knowledge of JavaScript and will head in to your first JavaScript program. I am Durvesh Naik and I am here to deal with this series of JavaScript. I will teach you JavaScript in part wise , as its quite boring to read big…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

867 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

21 Experts available now in Live!

Get 1:1 Help Now