$this->Form->create でhtmlにFormを作成し、各inputに画面から値を入力後、Enterキーを押すと、なぜかSubmitされてしまいます。。。
例えばinputでの入力部分が3つあり、その中の1つの値を入力後に、Enterを押すと値がSubmitされてしまいます。
他の部分をいれ、登録ボタンを押したときに、SubmitしてほしいのでEnterキーでSubmitしてほしくないのに・・・
今回はなぜEnterキーでSubmitされてしまう件を解決していきましょう!
問題のコード
【index.ctp】
1 2 3 4 5 |
<?= $this->Form->create($post); ?> <?= $this->Form->input('hoge',['label' => false,'type'=>'number']); ?> <?= $this->Form->input('fuga',['label' => false,'type'=>'number']); ?> <?= $this->Form->button('送信'); ?> <?= $this->Form->end(); ?> |
このコードで画面からhogeを入力後に、Enterをおすと、値がSubmitされてしまう。
値のSubmitはButtonを押した時だけにしたい。
解決コード
1 2 3 4 5 |
<?= $this->Form->create($post); ?> <?= $this->Form->input('hoge',['label' => false,'type'=>'number']); ?> <?= $this->Form->input('fuga',['label' => false,'type'=>'number']); ?> <?= $this->Form->button('送信', ['type' => 'button', 'onclick'=>'submit()']); ?> <?= $this->Form->end(); ?> |
ButtonのTypeをしっかりとButtonとし、onclickイベントを使用することで解決。
これで誤ってEnterキーを押した場合の誤送信を防ぐことができるようになりました。