Disable Chrome HTML5 client-side form validation in CakePHP

Since CakePHP 2.0, HTML5 input types in forms are supported in the Form Helper. Since CakePHP 2.3.1, the required attribute is set to true so that all forms have client-side validation by default. This may cause problems for people using Google Chrome, since that browser has some eccentric HTML5 form validation behavior. Fortunately we can easily disable this validation for the entire application. Firstly, you have to add the “className” with value “CustomForm” to the options of your “Form” helper in your “AppController”, like this:

<?php
App::uses('Controller', 'Controller');

class AppController extends Controller {

  public $helpers = array('Html','Form'=>array('className'=>'CustomForm'),'Session');

  // ...
}

Now add the “CustomForm” helper which extends the FormHelper in “app/View/Helper/CustomFormHelper.php” with the following contents:

<?php
App::uses('FormHelper', 'View/Helper');

class CustomFormHelper extends FormHelper {

  public function create($model = null, $options = array()) {
    if (is_array($model) && empty($options)) {
      $options = $model;
      $model = null;
    }

    if (!isset($options['novalidate'])) {
      $options['novalidate'] = true;
    }
    return parent::create($model, $options);
  }

}

Great, now your customers can continue to use your application without any problems. To further analyze the conversion and validation problems in Google Chrome for HTML5 form fields, use the HTML5 number field test.

Share