Trying to call a javascript function with variable from ASP.NET

Question

I have a simple text field that looks like this.

<asp:TextBox ID="txtMyTextBox" runat="server" onblur="checkMyText()"  ></asp:TextBox>

At the top of my page, I have this little bit of JS

<script type="text/javascript">
    function checkMyText() {
        var args = document.getElementById('<% =txtMyTextBox.ClientId %>').value;
        alert(args);
        }
</script>

This works fine. When I try to do this.

 <asp:TextBox ID="txtMyTextBox" runat="server" onblur="checkMyText("txtMyTextBox")"  ></asp:TextBox>

. . .

 function checkMyText(ElementID) {
                var args =  document.getElementById('<% =ElementID.ClientId %>').value;
                alert(args)
                }

It fails.

I am entirely new to javascript, so I am not sure how it handles passing variables or treating them inside strings. The idea is if I add an: ID="txtMyOtherTextBox" I only need to call onblur="checkMyText("txtMyOtherTextBox")" for that button. How do I javascript strings?

BenMorel · Accepted Answer · 2014-01-09 16:44:37Z

3

in this line

<asp:TextBox ID="txtMyTextBox" runat="server" 
      onblur="checkMyText("txtMyTextBox")"  ></asp:TextBox>

you have two main errors.

wrong quotas -> "checkMyText("txtMyTextBox")"
you pass the ID as you see it on code behind, not as its rendered on page.

Usually we pass the current element to a JavaScript function using the this keyword. Eg:

<asp:TextBox ID="txtMyTextBox" runat="server" onblur="checkMyText(this)"/>

function checkMyText(me) {
                var args =  me.value;
                alert(args)
                }

edited Jan 9, 2014 at 16:44

BenMorel

37k52 gold badges208 silver badges339 bronze badges

answered Feb 27, 2013 at 16:55

Aristos

66.7k16 gold badges117 silver badges154 bronze badges

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

Comments

magnattic · Accepted Answer · 2013-02-27 16:51:23Z

2

You have to pass the ClientId of the Textbox to the javacscript function. You cannot use server side code while you are executing Javascript (which you are trying to do by calling ElementID.ClientId in your js function.

Determine the ClientId while still on the server and put it as a string in the function call: onblur="checkMyText('<%=txtMyTextBox.ClientId %>')" Then you can work with the id in the javascript function.

Try this:

<asp:TextBox ID="txtMyTextBox" runat="server" onblur="checkMyText('<%=txtMyTextBox.ClientId %>')"></asp:TextBox>

and

<script type="text/javascript">
    function checkMyText(id) {
        var args = document.getElementById(id).value;
        alert(args);
        }
</script>

answered Feb 27, 2013 at 16:51

magnattic

13.1k15 gold badges65 silver badges118 bronze badges

Comments

Community · Accepted Answer · 2017-05-23 11:57:40Z

0

If you look at your page source, you'll see that ASP.NET mangles your nice readable ID's in the interest of keeping things truly unique in the case of using the same "control" multiple times per page (e.g. a News Widget or something)

I do not like that aspect of ASP.NET and prefer to manually manage my ID's (and use classes where useful), so I use ClientIDMode="Static" in my Page Directive. This directs ASP.NET to use your ID's as you specified them in your source code, enabling you to do exactly as you depict in your second example that (currently) doesn't work.

That said Aristos' answer is the preferred solution

edited May 23, 2017 at 11:57

CommunityBot

11 silver badge

answered Feb 27, 2013 at 16:55

BLSully

5,9291 gold badge29 silver badges46 bronze badges

Collectives™ on Stack Overflow

Trying to call a javascript function with variable from ASP.NET

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related