提交输入“31”的maxlength“30”的文本输入

Question

I currently have a form set up via Laravel with a text form input set up with a maxlength of 30:

{{ Form::text('employer' , Input::old('employer'), array('class'=>'form-control', 'maxlength'=>'30')) }}

I also have the column in MySQL set with a length of 30.

I just recently received an error that a submission had an input of that field that was 31 characters long, and I'm not sure how that would happen.

SQLSTATE[22001]: String data, right truncated: 1406 Data too long for column 'employer' at row 1 (SQL:update...)

I assume that something is counting in array numbering with 0 being the 1st, and 29 being 30th, but I've checked in several different browsers and a maxlength of 30 has always come out as 30.

Is it possible that the maxlength tag is viewed differently between browsers?

I suppose I could go in and set the maxlength in my inputs to 1 below the length that it is in MySQL, but that seems to be a little messy in having different values through the application.

Answer 1

The reason this could have happened, is because the input field maxlength attribute counts the number of characters in Unicode points. I can't directly detect any in your string, though, but it is still a way people could get around it unintentionally. As mentioned in the comments by @MartinBean, it could of course also be bypassed intentionally.

From MDN:

maxlength If the value of the type attribute is text, email, search, password, tel, or url, this attribute specifies the maximum number of characters (in Unicode code points) that the user can enter; for other control types, it is ignored. It can exceed the value of the size attribute. If it is not specified, the user can enter an unlimited number of characters. Specifying a negative number results in the default behavior; that is, the user can enter an unlimited number of characters. The constraint is evaluated only when the value of the attribute has been changed.

source: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input

And see the comments and answers on this post: Are there browsers that don't support maxlength?

I would advise to always add serverside validation too. In Laravel this can be implemented quite easily.

For Laravel 5.1: http://laravel.com/docs/5.1/validation

For Laravel 4.2: http://laravel.com/docs/4.2/validation

Something pseudo-like (4.2 example, since I think you use 4.* because of the Input::old()):

$rules  = array(
    'employer'      => 'size:30',
);

// or \Input::all() depending on your namespacing, 
// instead of ::only(..) you can use ::all(), ::except(..)
// too, of course.
$input  = Input::only('employer'); 

$validator = Validator::make(
    $input,
    $rules
);

if ($validator->fails())
{
   // Throw whatever (preferably a custom validator exception)
   // exception you like, or return Redirect::to('form')->withInput();
   // I think if you want to use Redirect::back
   // input you have to Input::flash() first, not sure.
   throw new Exception('Validation failed.');
}

... go on then

I see you are using Input::old() already in your form, so perhaps you already use some kind of validation. Takes only a few minutes to implement and there really isn't a reason not to have server-side validation.