Guest Deleted Posted December 7, 2014 Share Posted December 7, 2014 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. Link to comment Share on other sites More sharing options...
Larry Posted December 8, 2014 Share Posted December 8, 2014 I think that's an excellent change. I obviously missed that this would cut strings shorter than 100 characters, too. Kudos! Link to comment Share on other sites More sharing options...
Guest Deleted Posted December 8, 2014 Share Posted December 8, 2014 Oh really? I thought you intentionally made it like that. 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! Link to comment Share on other sites More sharing options...
Recommended Posts