Jump to content
Larry Ullman's Book Forums
Guest Deleted

Is This Code Supposed To Act Upon Strings Shorter Than 100 Chars?

Recommended Posts

Guest Deleted

In Chapter 4 Larry has us put together some code where you type a comment in a box and JavaScript slices it down to under 100 characters. To do it, it finds the last space between words and cuts off the last word.

 

I thought that if a string is less than 100 characters, this code would leave it alone but it's acting upon any string no matter how short. For instance "This is a comment." gets cut down to "This is a".

 

I went in and added an if statement to the code so that it only slices the string if it's over 100 characters. It solved the problem but is this the proper way to handle the situation?I or is lastIndexOf() supposed to somehow be able to handle the situation itself?

 

If not, and an if statement was indeed required, then was this intentionally left out because control structures haven't been taught yet in chapter 4, so maybe Larry didn't want to confuse anybody?

 

 

Larry's HTML:

    <form action="" method="post" id="theForm">
        <fieldset>
            <p>Enter your comments below (100 characters max).</p>
            <div><label for="comments">Comments</label><textarea name="comments" id="comments" maxlength="100" required></textarea></div>
            <div><label for="count">Character Count</label><input type="number" name="count" id="count"></div>
            <div><label for="result">Result</label><textarea name="result" id="result"></textarea></div>
            <div><input type="submit" value="Submit" id="submit"></div>
        </fieldset>
    </form>

Larry's JS:

function limitText() {
    'use strict';
    
    // For storing the limited text:
    var limitedText;
    
    // Get a reference to the form value:
    var originalText = document.getElementById('comments').value;

    // Find the last space before 100 characters:
    var lastSpace = originalText.lastIndexOf(' ', 100);
    
    // Trim the text to that spot:
    limitedText = originalText.slice(0, lastSpace);
    
    // Display the number of characters submitted:
    document.getElementById('count').value = originalText.length;

    // Display the limitedText:
    document.getElementById('result').value = limitedText;
    
    // Return false to prevent submission:
    return false;
    
} // End of limitText() function.

// Function called when the window has been loaded.
// Function needs to add an event listener to the form.
function init() {
    'use strict';
    document.getElementById('theForm').onsubmit = limitText;
} // End of init() function.
window.onload = init;

What I changed with an if statement:

    if (originalText.length > 100) {
        // Find the last space before 100 characters:
        var lastSpace = originalText.lastIndexOf(' ', 100);
        
        // Trim the text to that spot:
        limitedText = originalText.slice(0, lastSpace);        
        
    } else   {
        limitedText = originalText;
    }

Note: I have to take maxlength="100" out of Larry's code to test strings longer than 100 characters.

Share this post


Link to post
Share on other sites

I think that's an excellent change. I obviously missed that this would cut strings shorter than 100 characters, too. Kudos!

Share this post


Link to post
Share on other sites
Guest Deleted

Oh really? I thought you intentionally made it like that. :D

 

Then is this sometihng that should go in the errata?

 

And anyways, good to know I'm not crazy! I thought maybe there was a way to control the situation with lastIndexOf() and that I just wasn't seeing it!

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...