Adding a character to a string from HTMLInput using javascript

Question

I have a htmlInput in ASP:Repeater that I want to format in a time format (ex: 13:39 ) on keypress . So far I have this code linked to a repeater:

 Protected Sub rpt_ItemDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.RepeaterItemEventArgs) Handles rpt.ItemDataBound If e.Item.ItemType = ListItemType.Item OrElse e.Item.ItemType = ListItemType.AlternatingItem Then Dim txt As HtmlInputText = DirectCast(e.Item.FindControl("txtKmRun"), HtmlInputText) If txt IsNot Nothing Then txt.Attributes.Add("onkeypress", "return kmRun('" & txt.Value & "');") End If End If End Sub 

.. and this is in JavaScript:

 <script> function kmRun(myValue) { String x = myValue; x = x.substring(0, 2) + ":" + x.substring(2, x.length()); alert(x); //alert to test display but is not working //HOW TO PASS x VALUE TO BACK TO THE TEXTBOX? } </script> 

The onkeypress attribute was onkeypress using simple javascript , and it worked, but there is no return value when changing with passing the value. So, I think the error starts there.

Additional question: when javascript part works, how to return the "converted" string value back to htmlInput ? Is there any other solution for this problem that PostBack will not use?

Thanks.

=====================

This is the working code:

 Protected Sub rpt_ItemDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.RepeaterItemEventArgs) Handles rpt.ItemDataBound If e.Item.ItemType = ListItemType.Item OrElse e.Item.ItemType = ListItemType.AlternatingItem Then Dim txt As HtmlInputText = DirectCast(e.Item.FindControl("txtKmRun"), HtmlInputText) If txt IsNot Nothing Then txt.Attributes.Add("onkeypress", "return kmRun(this);") End If End If End Sub <script> function kmRun(x) { if (x.value.length > 2) { x.value = x.value.substring(0, 2) + ":" + x.value.substring(2, x.value.length); } } </script> 

Answer 1

You do not need to declare another variable, you can use the myValue parameter.

I would recommend using onchange="kmRun(this)" instead of onkeypress="kmRun(this)" , because you had to change the content to finally format the code.

Using this , you can get all the attributes of the textBox control.

You can try something like this in your javascript code:

 function kmRun(control) { control.value = control.value.substring(0, 2) + ":" + control.value.substring(2, control.value.length); } 

 <input id="txt" type="text" onchange="kmRun(this)" value="" /> 

Answer 2

There are some problems in your logic.

• You send txt.Value inside the ItemDataBound , but this will be a fixed value when rendering in HTML , as it will not be updated when the user enters it. You should change this:

   txt.Attributes.Add("onkeypress", "return kmRun(this.value);") 

  This keyword above refers to your input , and whenever the user enters it, it will be updated.

• Javascript is not a typed language, there is no String x = declaration. You should use:

   var x = myValue; 

• You cannot use .substring(0, 2) directly without checking if the field has more than two characters, because if it is not, the browser throws an error.

• You use .length as it was a method, but it is a property. Do not use parentheses () .

---

Finally, to pass the value back to the TextBox , you can do:

 this.value = x;