This is a migrated thread and some comments may be shown as answers.

RadTextBox incorrectly firing ClientEvents-OnValueChanged

2 Answers 103 Views
Input
This is a migrated thread and some comments may be shown as answers.
J
Top achievements
Rank 1
J asked on 09 Apr 2015, 11:09 AM

I have a several RadTextBox controls on the same form.  All are using ClientEvents-OnValueChanged,  but the larger multi-line RadTextBox controls are firing ClientEvents-OnValueChanged when you just click into the control then out again.  Smaller multi-line RadTextBox controls behave correctly.   So far it seems to be related more to the length of text in the RadTextBox rather than the number of rows.  I'm using IE 11.

I've reproduced the behaviour in this smaller page (snippet) .  All three RadTextBox inputs have the same MaxLength and Width and all use the ClientEvents-OnValueChanged event.

The first multi-line RadTextbox incorrectly fires ClientEvents-OnValueChanged the first time you click inside it then click away.  The second multi-line RadTextbox correctly only fires ClientEvents-OnValueChanged when something has actually changed.  The only difference between the two is the length of the actual text - both are showing vertical scroll bars on my screen .

<head runat="server">
    <title></title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <script src="//code.jquery.com/jquery-2.1.3.min.js"  id="JQueryScript"></script>
    <script type="text/javascript">
        function ItemChanged() {
            $("#divInfo").text($("#divInfo").text() + "First Changed;");
        }
        function SecondChanged() {
            $("#divInfo2").text($("#divInfo2").text() + "Second Changed;");
        }
        function OtherChanged() {
            $("#divInfo2").text($("#divInfo2").text() + "Other Changed;");
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
        <telerik:RadToolTipManager ID="RadToolTipManager2" runat="server" RelativeTo="Element" Position="TopCenter" AutoTooltipify="true" ContentScrolling="Default" />
        <telerik:RadWindowManager ID="RadWindowManager1" runat="server" AutoSizeBehaviors="WidthProportional" AutoSize="true" MinWidth="500" />
        <telerik:RadAjaxManager runat="server" ID="radAjaxManager1" />
    <div>
    <div style="margin-bottom: 2em;"><div id="divInfo" > </div><div id="divInfo2" > </div></div>
        This large input incorrectly fires ClientEvents-OnValueChanged when you click inside then outside
    <telerik:RadTextBox ID="RadTextBox1" Width="90%" TextMode="MultiLine" Rows="3" MaxLength="2000" ClientEvents-OnValueChanged="ItemChanged"  runat="server" Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur luctus convallis sapien vestibulum tempus. Mauris vehicula feugiat felis vel sagittis. Ut fermentum posuere ligula vel ultrices. Aenean in libero placerat, mollis nulla in, suscipit dolor. Cras iaculis diam eros, sed ullamcorper magna adipiscing in. Vivamus vel diam ac nisl venenatis lacinia. Nulla volutpat, dolor id convallis fermentum, nunc odio convallis sapien, sed pharetra nunc lacus vel tortor. Quisque varius tincidunt ligula, pretium egestas felis convallis sed. Donec fringilla nisl in sagittis varius. Sed fringilla felis quis mauris adipiscing, in rutrum libero feugiat. Cras condimentum, elit non lobortis molestie, nunc purus condimentum purus, sed sagittis mauris tellus at purus.
 
Morbi vitae lacus ornare, rhoncus ipsum sed, dictum enim. Aliquam consequat nisi massa, eu ullamcorper felis aliquet ut. Mauris ornare fermentum enim, non accumsan purus tempus sit amet. Ut neque metus, molestie ut consequat sit amet, dignissim ac felis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Morbi gravida augue sed felis convallis, in vestibulum erat pharetra. Aliquam vel adipiscing nunc. Fusce pretium nunc sed odio imperdiet, eu faucibus enim laoreet. Praesent in ante mattis, blandit elit vitae, convallis arcu." />
        <br /><br />
        these two only fire ClientEvents-OnValueChanged when you actually change the value
    <telerik:RadTextBox ID="RadTextBox2" Width="90%" TextMode="MultiLine" Rows="3" MaxLength="2000" ClientEvents-OnValueChanged="SecondChanged" runat="server" Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur luctus convallis sapien vestibulum tempus. Mauris vehicula feugiat felis vel sagittis. Ut fermentum posuere ligula vel ultrices. Aenean in libero placerat, mollis nulla in, suscipit dolor. Cras iaculis diam eros, sed ullamcorper magna adipiscing in. Vivamus vel diam ac nisl venenatis lacinia. Nulla volutpat, dolor id convallis fermentum, nunc odio convallis sapien, sed pharetra nunc lacus vel tortor. Quisque varius tincidunt ligula, pretium egestas felis convallis sed. Donec fringilla nisl in sagittis varius. Sed fringilla felis quis mauris adipiscing, in rutrum libero feugiat. Cras condimentum, elit non lobortis molestie, nunc purus condimentum purus, sed sagittis mauris tellus at purus" />
    <br /><br />
    <telerik:RadTextBox ID="RadTextBox3" Width="90%" TextMode="SingleLine" Rows="1" MaxLength="2000" ClientEvents-OnValueChanged="OtherChanged" runat="server" Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit." />
    <br /><br />
    <asp:TextBox ID="txtTest" runat="server" Text="Somewhere else to click  no client events" />
    </div>
    </form>
</body>
</html>

2 Answers, 1 is accepted

Sort by
0
J
Top achievements
Rank 1
answered on 09 Apr 2015, 11:10 AM
Forgot to specify - this is using the 2015 Q1  release.
0
Vasil
Telerik team
answered on 13 Apr 2015, 12:03 PM
Hi Joanne,

The event is fired because in fact the value is changed. If you look at the old value, it is 1334 in length, and the new is 1336.
This happens because the browser change the '\n' with "\r\n" new line characters.

Regards,
Vasil
Telerik
 

See What's Next in App Development. Register for TelerikNEXT.

 
Tags
Input
Asked by
J
Top achievements
Rank 1
Answers by
J
Top achievements
Rank 1
Vasil
Telerik team
Share this question
or