Solved

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

Posted on 2014-11-01
26
229 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 6

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 82

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 82

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 6

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 6

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 6

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 6

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 6

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 6

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
Enabling OSINT in Activity Based Intelligence

Activity based intelligence (ABI) requires access to all available sources of data. Recorded Future allows analysts to observe structured data on the open, deep, and dark web.

 

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 6

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 6

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 82

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 6

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 6

Expert Comment

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

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 82

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

Better Security Awareness With Threat Intelligence

See how one of the leading financial services organizations uses Recorded Future as part of a holistic threat intelligence program to promote security awareness and proactively and efficiently identify threats.

Join & Write a Comment

This article is meant to give a basic understanding of how to use R Sweave as a way to merge LaTeX and R code seamlessly into one presentable 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 covers a step-by-step guide to install VisualVM launcher in eclipse.
In this seventh video of the Xpdf series, we discuss and demonstrate the PDFfonts utility, which lists all the fonts used in a PDF file. It does this via a command line interface, making it suitable for use in programs, scripts, batch files — any pl…

760 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

19 Experts available now in Live!

Get 1:1 Help Now