How to use same javascript function in multiple controls

Question

0.00/5 (No votes)

See more:

I have tried this sample code but this is not correct...

ASP.NET

<div>
        <asp:TextBox ID="TextBox1" runat="server" />
        <asp:Button ID="Button1" OnClientClick="getControlID('<%=TextBox1.ID %>');" runat="server" Text="Click Here" />
        <asp:TextBox ID="TextBox2" runat="server" />
        <asp:Button ID="Button2" OnClientClick="getControlID('<%=TextBox2.ID %>');" runat="server" Text="Click Here" />
</div>

JavaScript

<script type="text/javascript">
        function getControlID(obj) {
            var txtControl = document.getElementById(obj);
            txtControl.value = "It's working!";
            return false;
        }
    </script>

When I click Button1 then I want to display "It's working!" message in TextBox1 or when I click Button2 then I want to display that message in TextBox2 with using single function.

Posted 2-Nov-12 3:04am

Dinesh Ambaliya

Add a Solution

Comments

Thomas Daniels 2-Nov-12 9:19am

What do you mean with 'is not correct'?
Do you get an error, or there happens nothing?

2 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

jim lahey · Answer 1 · 2012-11-02T03:15:00

Solution 1

Your code is almost there. Make the following slight alteration:

HTML

<%=TextBox1.ClientID %>

<%=TextBox2.ClientID %>

instead of:

HTML

<%=TextBox1.ID %>

<%=TextBox2.ID %>

More info about ClientID:

http://msdn.microsoft.com/en-us/library/system.web.ui.control.clientid%28v=vs.100%29.aspx[^]

Posted 2-Nov-12 3:15am

jim lahey

Updated 2-Nov-12 3:16am

v2

Comments

Dinesh Ambaliya 2-Nov-12 9:46am

Thanks, but problem is that getControlID('<%=TextBox1.ClientID %>') javascript consider it to string!

jim lahey 2-Nov-12 9:49am

of course, but you pass that value to getElementById, which expects a string.

Dinesh Ambaliya 2-Nov-12 9:47am

I have not used master page. It's just example for testing.

jim lahey 2-Nov-12 9:49am

I never mentioned a master page.

Dinesh Ambaliya 2-Nov-12 9:56am

I mean getControlID('<%=TextBox1.ClientID %>') will pass '<%=TextBox1.ClientID %>' string in function not control id.

fjdiewornncalwe 2-Nov-12 10:31am

ClientID IS the control id on the client side.

Keith Barrow · Answer 2 · 2012-11-02T03:24:00

The problem is TextBox2.ID returns the sever-side ID of the control, not the one rendered to the browser. If you open you page in Chrome , right click the button and select "Inspect Element" or view the source code, you'll see what I mean.

You could do this:

ASP.NET

<asp:Button ID="Button1" OnClientClick="getControlID('<%=TextBox1.ClientID %>');" runat="server" Text="Click Here" />
<asp:TextBox ID="TextBox2" runat="server" />
<asp:Button ID="Button2" OnClientClick="getControlID('<%=TextBox2.ClientID %>');" runat="server" Text="Click Here" />

To get the client ID.

Personally, I think the following is simpler ignoring any errors I have in the code:

ASP.NET

<div>
        <asp:TextBox ID="TextBox1" runat="server" />
        <asp:Button ID="Button1" OnClientClick="getControlID(this);" runat="server" Text="Click Here" />
        <asp:TextBox ID="TextBox2" runat="server" />
        <asp:Button ID="Button2" OnClientClick="getControlID(this);" runat="server" Text="Click Here" />
</div>
<script type="text/javascript">
        function getControlID(control) {
            control.value = "It's working!";
            return false;
        }
    </script>

Assuming I've got it right (I haven't tested the code) the button itself will be passed, removing the need for the GetById.

On o further point, you sould take a look at jquery: it really simplifies client work.

How to use same javascript function in multiple controls

2 solutions

Solution 1

Solution 2

Add your solution here

Preview 0

Existing Members

...or Join us