Solved

How do I create a characters remaining code for a php form?

Posted on 2014-11-01
26
237 Views
Last Modified: 2014-11-05
I would like to add a character count down to my text area in a php form. My database has a limit of 300 characters for this column.
0
Comment
Question by:wchirnside
  • 11
  • 10
  • 5
26 Comments
 
LVL 7

Expert Comment

by:Thomas Wheeler
ID: 40417792
In html the text area has a maxlength parameter you can set this to 300 so it will never allow more characters. If you want an actual count down to be displayed you can you Javascript to count the character length and display it.
0
 
LVL 83

Expert Comment

by:Dave Baldwin
ID: 40417794
Here's a demo from one of my pages.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
 "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title>Characters Left</title>
</head>
<body>
<h1>Characters Left Demo</h1>
<textarea name="ccomments" id="ccom" cols="60" rows="5" wrap="virtual" onkeypress="return chlimit(this)"></textarea><br>
<span id="div1">Characters Left = 300</span>
<script type="text/javascript">
<!--
var limit=300;
var left=limit;
function chlimit(what){
var count=what.value.length;
left=limit-count;
if (left<0) {
	what.value=what.value.substring(0,limit)
	placeholderobj.innerHTML=lengthleft
	}
document.getElementById("div1").innerHTML="Characters Left = " + left;
}

function clearit() {
var h=document.getElementById("cfirst");
h.value="";
var h=document.getElementById("clast");
h.value="";
var h=document.getElementById("cemail");
h.value="";
var h=document.getElementById("ccity");
h.value="";
document.getElementById("ccom").innerHTML="";
document.getElementById("div1").innerHTML="Characters Left = " + limit;
}
// -->
</script>

</body>
</html>

Open in new window

0
 

Author Comment

by:wchirnside
ID: 40417821
Thanks for your replies. Have been fooling around with this for quite some time and seen several examples of excellent code. However, my BIGGEST problem seems to be integrating it into a php form.

<form action="PostANotice.php" method="POST" accept-charset="utf-8">

        <p><label for="description" class="SmallHeading"><strong>Description of item</strong></label> 

        <p>Please enter a brief description. You have up to 300 characters<br />
which includes spaces and special characters.</p>
		<p>
        <?php create_form_input('description', 'textarea', $PostANotice_errors); ?><br />
<p><input type="submit" name="submit_button" value="Submit Your Post &rarr;" id="submit_button" class="formbutton"  /></p>
</form>

Open in new window

0
 
LVL 83

Expert Comment

by:Dave Baldwin
ID: 40417822
I have no idea what 'create_form_input' does so I can't help with that.  Wasn't part of your original question either.
0
 
LVL 7

Expert Comment

by:Thomas Wheeler
ID: 40417823
what framework are you using?
0
 

Author Comment

by:wchirnside
ID: 40417830
This was my original question -
How do I create a characters remaining code for a php form?
So I have asked how to integrate it into a PHP form. I don't think you have to know what 'create_form_input' does in order to answer how to add javascript to a php page.

Framework - I know what you mean but I don't know what frame work I am using - PHP5 is my best answer.

Thank
0
 
LVL 7

Expert Comment

by:Thomas Wheeler
ID: 40417836
Well the function will accept parameters that will add the maxlength  and Javascript on keypress. So if I know what you are using I can give you an example. But I need to know what is providing the create_form_input function
0
 
LVL 7

Expert Comment

by:Thomas Wheeler
ID: 40417838
These functions are usually in apps like WordPress codeigniter etc
0
 

Author Comment

by:wchirnside
ID: 40417841
I am working in Dreamweaver CC and coding everything myself - not using any widgets.

Okay, I guess you do need to know what create_form_input does. Probably illustrates why I haven't been able to figure this out.

 The form functions are coming from an external file.

<?php 

// Need the form functions script, which defines create_form_input():
require ('./includes/form_functions.inc.php');	
?>

Open in new window

0
 
LVL 7

Expert Comment

by:Thomas Wheeler
ID: 40417844
Can you post the content of the include and I will look at it
0
 

Author Comment

by:wchirnside
ID: 40417845
	} elseif ($type == 'textarea') { // Create a TEXTAREA.
		
		// Display the error first: 
		if (array_key_exists($name, $errors)) echo ' <span class="error">' . $errors[$name] . '</span>';

		// Start creating the textarea:
		echo '<textarea name="' . $name . '" id="' . $name . '" rows="5" cols="43"';
		
		// Add the error class, if applicable:
		if (array_key_exists($name, $errors)) {
			echo ' class="error">';
		} else {
			echo '>';		
		}
		
		// Add the value to the textarea:
		if ($value) echo $value;

		// Complete the textarea:
		echo '</textarea>';

Open in new window

0
 
LVL 7

Expert Comment

by:Thomas Wheeler
ID: 40417865
This method does not allow you to specify extra attributes so you will need to extend it. Post the function declaration part and I can help you alter it to accept the extra attributes you need to make this work.
0
 
LVL 7

Expert Comment

by:Thomas Wheeler
ID: 40417869
here on the function decoration line add a var named $extra like so
function create_form_input( Description="", $type="", $errors="", $extra=""){

}

Open in new window

Then change this line
 // Start creating the textarea:
                echo '<textarea name="' . $name . '" id="' . $name . '" rows="5" cols="43"';

Open in new window

To read like this with the $extra concatenated
 // Start creating the textarea:
                echo '<textarea name="' . $name . '" id="' . $name . '" rows="5" cols="43"' . $extra;

Open in new window


now you can call the function as follows
create_form_input($type="textarea","maxlength='300' onkeypress='return chlimit(this)' ");

Open in new window


I hope this makes sense. It's hard to help without seeing the full function.
0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 

Author Comment

by:wchirnside
ID: 40418292
It made sense but didn't work when I attempted to fit it into the current form function. Here is more of the code.


<?php

function create_form_input($name, $type, $errors) {
	
	// Assume no value already exists:
	$value = false;

	// Check for a value in POST:
	if (isset($_POST[$name])) $value = $_POST[$name];
	
	// Strip slashes if Magic Quotes is enabled:
	if ($value && get_magic_quotes_gpc()) $value = stripslashes($value);

// Conditional to determine what kind of element to create
	
	if (($type == 'text') || ($type == 'password') || ($type == 'checkbox')) { // Create text or password inputs.
		
		// Start creating the input:
		echo '<input type="' . $type . '" name="' . $name . '" id="' . $name . '" size=50"';
		
		// Add the value to the input:
		if ($value) echo ' value="' . htmlspecialchars($value) . '"';

		// Check for an error:
		if (array_key_exists($name, $errors)) {
			echo 'class="error" /> <span class="error">' . $errors[$name] . '</span>';
		} else {
			echo ' />';		
		}
		
	} elseif ($type == 'textarea') { // Create a TEXTAREA.
		
		// Display the error first: 
		if (array_key_exists($name, $errors)) echo ' <span class="error">' . $errors[$name] . '</span>';

		// Start creating the textarea:
		echo '<textarea name="' . $name . '" id="' . $name . '" rows="5" cols="43"';
		
		// Add the error class, if applicable:
		if (array_key_exists($name, $errors)) {
			echo ' class="error">';
		} else {
			echo '>';		
		}
		
		// Add the value to the textarea:
		if ($value) echo $value;

		// Complete the textarea:
		echo '</textarea>';
		
} elseif ($type == 'checkbox') { // Create a CHECKBOX.

		// Start creating the input:
		echo '<input type="' . $type . '" name="' . $name . '" value="';

       
	   // Add the value to the input:
		if ($value) echo ' value="' . htmlspecialchars($value) . '"';
		
		
		// Display the error:
		if (array_key_exists($name, $errors)) {
			
			echo ' />';		
		}
		
	} // End of primary IF-ELSE.

}

Open in new window

0
 
LVL 7

Expert Comment

by:Thomas Wheeler
ID: 40418305
here you go

<?php

function create_form_input($name, $type, $errors, $extra="") {

        // Assume no value already exists:
        $value = false;

        // Check for a value in POST:
        if (isset($_POST[$name])) $value = $_POST[$name];

        // Strip slashes if Magic Quotes is enabled:
        if ($value && get_magic_quotes_gpc()) $value = stripslashes($value);

// Conditional to determine what kind of element to create

        if (($type == 'text') || ($type == 'password') || ($type == 'checkbox')) { // Create text or password inputs.

                // Start creating the input:
                echo '<input type="' . $type . '" name="' . $name . '" id="' . $name . '" size=50"';

                // Add the value to the input:
                if ($value) echo ' value="' . htmlspecialchars($value) . '"';

                // Check for an error:
                if (array_key_exists($name, $errors)) {
                        echo 'class="error" /> <span class="error">' . $errors[$name] . '</span>';
                } else {
                        echo ' />';
                }

        } elseif ($type == 'textarea') { // Create a TEXTAREA.

                // Display the error first:
                if (array_key_exists($name, $errors)) echo ' <span class="error">' . $errors[$name] . '</span>';

                // Start creating the textarea:
                echo '<textarea name="' . $name . '" id="' . $name . '" rows="5" cols="43"'. $extra;

                // Add the error class, if applicable:
                if (array_key_exists($name, $errors)) {
                        echo ' class="error">';
                } else {
                        echo '>';
                }

                // Add the value to the textarea:
                if ($value) echo $value;

                // Complete the textarea:
                echo '</textarea>';

} elseif ($type == 'checkbox') { // Create a CHECKBOX.

                // Start creating the input:
                echo '<input type="' . $type . '" name="' . $name . '" value="';


           // Add the value to the input:
                if ($value) echo ' value="' . htmlspecialchars($value) . '"';


                // Display the error:
                if (array_key_exists($name, $errors)) {

                        echo ' />';
                }

        } // End of primary IF-ELSE.

}

?>

Open in new window


and you call it like this

$errors = array();
create_form_input("text1","textarea",$errors,"maxlength='300' onkeypress='return chlimit(this)' ");

Open in new window


the fourth param is the extra attributes you want added
0
 

Author Comment

by:wchirnside
ID: 40418644
Thanks for your reply.

This code allows me to enter in as much code as I want to so it does not work. Also, what I need most is the code for the text that tells the user what about of key strokes they have left.
0
 
LVL 7

Accepted Solution

by:
Thomas Wheeler earned 500 total points
ID: 40418660
here try this:
<?php

function create_form_input($name, $type, $errors, $extra="") {

        // Assume no value already exists:
        $value = false;

        // Check for a value in POST:
        if (isset($_POST[$name])) $value = $_POST[$name];

        // Strip slashes if Magic Quotes is enabled:
        if ($value && get_magic_quotes_gpc()) $value = stripslashes($value);

// Conditional to determine what kind of element to create

        if (($type == 'text') || ($type == 'password') || ($type == 'checkbox')) { // Create text or password inputs.

                // Start creating the input:
                echo '<input type="' . $type . '" name="' . $name . '" id="' . $name . '" size=50"';

                // Add the value to the input:
                if ($value) echo ' value="' . htmlspecialchars($value) . '"';

                // Check for an error:
                if (array_key_exists($name, $errors)) {
                        echo 'class="error" /> <span class="error">' . $errors[$name] . '</span>';
                } else {
                        echo ' />';
                }

        } elseif ($type == 'textarea') { // Create a TEXTAREA.

                // Display the error first:
                if (array_key_exists($name, $errors)) echo ' <span class="error">' . $errors[$name] . '</span>';

                // Start creating the textarea:
                echo '<textarea name="' . $name . '" id="' . $name . '" rows="5" cols="43"'. $extra;

                // Add the error class, if applicable:
                if (array_key_exists($name, $errors)) {
                        echo ' class="error">';
                } else {
                        echo '>';
                }

                // Add the value to the textarea:
                if ($value) echo $value;

                // Complete the textarea:
                echo '</textarea>';

} elseif ($type == 'checkbox') { // Create a CHECKBOX.

                // Start creating the input:
                echo '<input type="' . $type . '" name="' . $name . '" value="';


           // Add the value to the input:
                if ($value) echo ' value="' . htmlspecialchars($value) . '"';


                // Display the error:
                if (array_key_exists($name, $errors)) {

                        echo ' />';
                }

        } // End of primary IF-ELSE.

}



?>
<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8">

  <title>Character Count</title>
  <meta name="description" content="Character count example">
  <meta name="author" content="thomas@wheelerwire.com">

<script>
<!--
var limit = 300;
var left = limit;

function chlimit(what){
        var count = what.value.length;
        left = limit - count;

        if (left < 0) {
                what.value = what.value.substring(0,limit)
                placeholderobj.innerHTML = lengthleft
        }
        document.getElementById("div1").innerHTML="Characters Left = " + left;
}

// -->
</script>

</head>

<body>

<?
$errors = array();

create_form_input("text1","textarea",$errors,"maxlength='300' onkeyup='return chlimit(this)' ");
?>
<div id="div1">Characters Left = 300</div>
</body>
</html>

Open in new window

0
 
LVL 83

Expert Comment

by:Dave Baldwin
ID: 40418683
In the end, your code has to generate something like I posted above.  http://www.experts-exchange.com/Programming/Misc/Q_28549075.html#a40417794
0
 
LVL 7

Expert Comment

by:Thomas Wheeler
ID: 40418799
I belive the example I posted is a working example of what was asked for.
0
 

Author Comment

by:wchirnside
ID: 40418802
Okay. I appreciate the above comments. I will not be able to test further until tomorrow.
0
 

Author Comment

by:wchirnside
ID: 40420842
Dave Baldwin - You mean it has to have this part of the code? -
function clearit() {  ---- etc.

The code posted by Thomas Wheeler seems to work.
0
 
LVL 7

Expert Comment

by:Thomas Wheeler
ID: 40420850
No it does not that is why I removed it
0
 
LVL 83

Expert Comment

by:Dave Baldwin
ID: 40421062
No, the "function clearit() " was just part of the page I copied it from.  It was there to clear the text area because under some circumstances, a Reset button does not clear a form.
0
 

Author Comment

by:wchirnside
ID: 40421652
Yes, I have seen a form where the reset button does not clear the data.

The reason why I asked about this is because I was comparing the two codes and wondering why you stated the following: -

In the end, your code has to generate something like I posted above.  http://www.experts-exchange.com/Programming/Misc/Q_28549075.html#a40417794
0
 
LVL 83

Expert Comment

by:Dave Baldwin
ID: 40422135
Because (except for that one item), all the functions have to be there when you view the source in a browser.  You have to detect key presses and display a count.

A 'Reset' button restores a form to the condition it was in when it was loaded.  If you preload values into a form when you load it into a browser, 'Reset' will restore those values.  It will 'Reset' it to the original values that were loaded with the page.
0
 

Author Comment

by:wchirnside
ID: 40425262
There didn't see to be a way to split the points for a solution. I meant to alot points to both.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
ClickOnce Install - Shortcut Question 3 72
Using YubiKey with REST API application 2 106
split53 challenge 7 77
What language/protocol is the Angular Chat? 2 55
This article will show, step by step, how to integrate R code into a R Sweave document
In this post we will learn how to connect and configure Android Device (Smartphone etc.) with Android Studio. After that we will run a simple Hello World Program.
This tutorial will introduce the viewer to VisualVM for the Java platform application. This video explains an example program and covers the Overview, Monitor, and Heap Dump tabs.
The viewer will be introduced to the technique of using vectors in C++. The video will cover how to define a vector, store values in the vector and retrieve data from the values stored in the vector.

914 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

21 Experts available now in Live!

Get 1:1 Help Now