Word Counter help

Mercyy · April 10, 2020, 4:23pm

So we are working in a Programming class and the teacher is as lost as I am, I’m thinking maybe fresh eyes will spot the issue faster than we can. The idea is to create a word counter application and embed it into our page. I’ve got the general code down, but for some reason after counting the words it also displays the word “Count” under the results. So instead of just saying “Your text has __ words” it adds a "Count * " underneath that. Any help would be awesome cause like I said, even the teacher has told me she’s lost why it’s doing that, but I think it’s just tired eyes at this point.

here’s the full code:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Word Counter</title>
<link href="styles.css" rel="stylesheet" type="text/css">
</head>
<body>
	<?php
		$text ="";
		$texterror = "";
	
	if ($_SERVER["REQUEST_METHOD"] == "POST") {
		if (empty($_POST["words"])) {
			$texterror = "More words are required.";
		}
		else{
			$text = test_input($_POST["calc"]);
		}	
	}
	?>
	
	<form method= "post" action= "<?php echo ($_SERVER["PHP_SELF"]);?>">
	<textarea name ="words" cols = "60" row = "20" maxlength="50000" id = "words">
		</textarea>
	<br>
	<input type ="submit" name= "calc" value ="Count"><span class ="error"> * <?php echo $texterror;?>
		</span>
	</form>
	
<?php
function test_input($data) {
	$data = trim($data);
	$data = stripslashes($data);
	$data = htmlspecialchars($data);
	return $data;
}
	
	if($text) {
		$counted = str_word_count($_POST["words"]);
		echo "<h2> Your text has ". $counted . " words. </h2>";
		echo $text;
	}
	?>
</body>
</html>

phdr · April 10, 2020, 5:30pm

The reason for the extra ‘Count’ text being displayed is mainly due to too much code (a cannot see the forest for the trees problem) and changing the name of things throughout the code. Simplicity and consistency counts (no pun intended) in programming.

Whatever names you decide use for the form fields, should be the names you use throughout the rest of the code dealing with those form fields. By changing what you are calling one of the fields, you have mixed up the meaning of the value and because it is buried inside of too much copy/pasted code, you and your instructor cannot even see the problem.

Next, forget about the crappy test_input() function that was copied from the w3schools site. The only alteration of input values should be to trim them. Stripslashes should have been conditionally applied and the reason for doing so was removed from php a very long time ago. The only time you use htmlspecialchars on a value is when you output it in a html context. Also, forget about unconditionally echoing $_SERVER[‘PHP_SELF’], it allows cross site scripting.

Your textarea form field is named ‘words’. If that’s the name you want to use for it, use ‘words’ throughout the rest of the code.

Your form processing code should -

Be placed before the start of the html document (this is assuming that you will eventually do something with the submitted post method form data on the server, rather than just displaying a result on the page.)
Detect that a post method form was submitted. This is the only current thing worth keeping.
Trim all the input data at once, placing the trimmed data into an array variable, that you use throughout the rest of the code. You would test/use the trimmed data in the rest of the code. The current logic, also copied from w3schools, is testing the un-trimmed value, then using the trimmed value in the rest of the code. This will allow a value consisting of all white-space characters to be treated as ‘valid’ data, but then the rest of the code will not have any data to operate on. It is inside this un-necessary and incorrect logic where you have mixed up what form input you are using.
Validate the inputs, storing any validation errors in an array, using the form field name as the array index. This array is also an error flag. If the array is empty, there are no validation errors. You would display the contents of this error array at the appropriate location in the html document.
After the end of the validation logic, if there are no errors (the array holding the error messages is empty), use the submitted form data to produce the data value you need, which would be the word count value.