0

I faced cakephp time format problem. I am tired, this problem. When i try 'type' => 'time' then it change like my first screen short. But i want to need like second screen short.

echo $this->Form->input('callback_time', array('label' => false, 'class' => 'callentry_time_formate readonly','data-live-search' => 'true','type' => 'time', 'value' => (!empty($this->request->data['CallEntry']['callback_time'])) ? $this->request->data['CallEntry']['callback_time'] : $callback_time));

Screen Short: 1 enter image description here

I want to need like under this picture. How can i solved it? Screen Short: 2 enter image description here

Screen Short: 3 when i go inspect element in browser and change type='time' then it work well like my Screen Short: 3 if i change cakephp helper input 'type' => 'time' then it look like screen short: 1. My required Screen Short:3. But it's working only inspect element enter image description here

7
  • Your question is not clear , if you put type ="time" , then If it's working fine then what's your problem ? Commented Apr 3, 2016 at 6:33
  • when i am try type = 'time' then it look my first image but i want to need like second image Commented Apr 3, 2016 at 6:44
  • if i use type = 'time' in cakephp input then it broken like my first screen but my required like second screen. second screen make in inspect element Commented Apr 3, 2016 at 6:46
  • Do u want to see it like as text field ? or like as time picker ? Commented Apr 3, 2016 at 7:34
  • like a time picker Commented Apr 3, 2016 at 7:34

2 Answers 2

4

The type option of FormHelper::input() doesn't necessarily translate directly to the HTML type attribute, but rather to the according FormHelper widget/element, and in case of time, this is multiple inputs for the individual time value components.

Use FormHelper::text()

If you need a single <input> element with the type attribute set, then you'll have to create the element directly via FormHelper::text(), where type will map to the HTML attribute, ie

$this->Form->text('callback_time', array(
    'type' => 'time',
    // ...
));

Of course you'll loose the magic that FormHelper::input() provides, ie error messages, wrappers, etc, you'll have to handle that on your own then.

See also

Use your own (extended) form helper

Another option would be to create your own, extend FormHelper, and either implement your own type, or override FormHelper::_getInput() or FormHelper::dateTime(), to make the built-in time type use the elements that you need. Here's an example doing the former:

app/View/Helper/MyFormHelper.php

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

class MyFormHelper extends FormHelper
{
    public function customTime($fieldName, $options = array())
    {
        $options =
            $this->_initInputField($fieldName, $options) + array('type' => 'time');

        return $this->Html->useTag(
            'input',
            $options['name'],
            array_diff_key($options, array('name' => null))
        );
    }
}

That's basically the same as above (see FormHelper::__call(), which is being invoked for FormHelper::text()), ie it creates a simple <input> element with the type attribute set, but keeps the magic that FormHelper::input() provides.

controller

public $helpers = array(
    'MyForm',
    // ...
);

.ctp view template

$this->MyForm->input('callback_time', array(
    'type' => 'customTime',
    // ...
));

See also

Sign up to request clarification or add additional context in comments.

Comments

0

Try to use jquery-timepicker to create a time picker.

http://jonthornton.github.io/jquery-timepicker/

2 Comments

i used already but i want to need html input type format when i used 'type' => 'time' then it broken like my first screen short but my required like this w3schools.com/html/tryit.asp?filename=tryhtml_input_time
i used that but it work like my first screen short but need like second screen short

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.