How to pass value to javascript function on aspx onClientClick page

Question

I want to check the value of a text field before feedback occurs. I set the onClientClick value for my function, but I do not know how to pass the data for verification, in this case I want to check the entered text txt1.

 <asp:textbox id="txt1" runat="server /> <asp:LinkButton ID="LinkButton1" runat="server" Text="Save" onclick="Save" OnClientClick="javascript:check(WANT TO PUT TEXTBOX VALUE HERE);" /> 

My javascript:

 function check(txt) { var pattern = /^[0-9]{1,11}(,[0-9]{0,2})?$/; if (!pattern.test(txt)) { return false; } else { return true; } } 

The problem is that this check function is used during the txt1 key press event, so I cannot use:

 function check(){ var txt=$('#txt1').val(); } 

All JS code:

 $('#txt1').keypress(function (e) { var key = String.fromCharCode(e.which); var txt = $(this).val() + key; if (check(txt)) { // do sth } else { e.preventDefault(); // do sth } }); 

How can I tell the OnclientCLick functions to get the txt1 value?

Thanks.

Answer 1

Something like that:

 <asp:textbox id="txt1" runat="server /> <asp:LinkButton ID="LinkButton1" runat="server" Text="Save" onclick="Save" OnClientClick="check(document.getElementById('<%=txt1.ClientID%>').value;)" /> 

---

Edit:
Other methods:

• You can add it on the server side: LinkButton1.OnClientClick="check(document.getElementById('" + txt1.ClientID + "').value;)" ;

• If you want to stay on the aspx page, you must put the javascript function name in OnClientClick and implement the javascript function in the script tag:

   <asp:LinkButton ID="LinkButton1" runat="server" Text="Save" OnClientClick="validate();" /> <script type="text/javascript"> function validate() { alert(document.getElementById('<%=txt1.ClientID%>').value); return false; } </script> 

Answer 2

You have several approaches.

First approach:

 function sayHello(obj){ alert(obj.id + " says 'Hello!'"); }; <asp:Button runat="server" ID="btnApproach1" OnClientClick="sayHello(this)" Text="Say Hello" /> 

This will pass the Button control (in fact, only the <input element), and you can work with it as you like.

Second approach:

 function checkValue(e) { //If it has a target, use it. Otherwise, use srcElement (for IE) var ctrl = e.target || e.srcElement; //Do whatever you need to with the text, no button necessary. }; function bindEvent(ctrl, event, handler, propagates) { if (ctrl.addEventListener) { ctrl.addEventListener(event, handler, propagates); } else { ctrl.attachEvent("on" + event, handler); } }; window.onload = function () { var myCtrl = document.getElementById('<%=txtToValidate.ClientID%>'); bindEvent(myCtrl, "keydown", checkValue, false); }; <asp:Button runat="server" ID="btnApproach2" Text="Say Hello" /> 

Here, you bind events to controls behind the scenes (preferred) and remove that logic from your presentation level (your .aspx).

Both approaches will work, but I would suggest moving on to option 2 to separate the issues.

Answer 3

You just need to add a single quotation mark at both ends of the line to test the function as shown below.

 javascript:check('WANT TO PUT TEXTBOX VALUE HERE');