Link to home
Start Free TrialLog in
Avatar of SueJStevens
SueJStevensFlag for United States of America

asked on

How can I validate length of text after form and data is loaded?

I have developed simple form that users will input data.  I've written validation scripts to show the user how many characters remain available.  The script works great so long as the form that is loaded is expecting new data entry.  Now I'd like to use that same form for users to edit previously entered data.  What do I need to change in this script so the length of data loaded is taken into account when the window is loaded?

My form has an input
<input type="text" name="fieldname" id="fieldname"       maxlength="20" placeholder="Field Name"
value="<?php echo $row['FieldName']; ?>">

and my form has a feedback message
<p style="text-align: right" id="feedback_fieldname"></p>

Here is my validation script:
<!--Inform User Remaining Length of input fields-->
window.onload = function() {

    var text_max_fieldname = 20;
    $('#feedback_fieldname').html(text_max_fieldname + ' characters remain ');

    $('#fieldname').keyup(function() {
        var text_length_fieldname = $('#fieldname').val().length;
        var text_remaining_fieldname = text_max_fieldname - text_length_fieldname;

        $('#feedback_fieldname').html(text_remaining_fieldname + ' characters remain ');

Avatar of Brian Tao
Brian Tao
Flag of Taiwan, Province of China image

Link to home
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of SueJStevens


Thank you!  I really appreciate the feedback.  Because I am a newbie, I especially appreciate that you created a model via jsfiddle for me.  Closing this question and awarding points.
I appreciate the quick response and thorough answer.
Glad that helps.  Thanks for the points.