手风琴表格：在启用下一步之前检查必填字段

Question

我有一个手风琴式表格。每一步都在自己的手风琴中。

https://mci.bitpix.co.uk/builder

我想在下一个按钮可用之前检查所有字段是否已填写。

任何人都可以为我指明第一步的正确方向，然后再重复其余步骤。

提前致谢

Answer 1

你的link给我一个错误，所以我能给你的代码有限，但你可以用几种不同的方式处理这个问题。

根据你的问题，我假设该按钮被禁用，因此你可以使用 jquery 来验证字段 onchange() 并在填写完所有内容后从按钮中删除禁用的标签。

我会考虑使用 AJAX API 添加处理程序来验证字段并在成功开始下一步时推送部分更新。可以用作组件或页面 php 部分

起点的粗略代码

function onSubmitFirstAccordion()
{
    $validator = Validator::make(
    [
        'name' => 'Joe',
        'password' => 'lamepassword',
        'email' => 'email@example.com'
    ],
    [
        'name' => 'required',
        'password' => 'required|min:8',
        'email' => 'required|email|unique:users'
    ]
    );
   if ($validator->fails()) {
       throw new AjaxException([
         $validator->messages()
       ]);
   } else {
      return [
        '#myDiv' => $this->renderPartial('mypartial')
      ];
   }
}

按钮代码包括：

<!-- Attributes API -->
<button data-request="onSubmitFirstAccordion" data-request-validate>Next Step</button>

手风琴表格：在启用下一步之前检查必填字段

Accordion Form: Check required fields before enabling next step

javascript

forms

jquery

octobercms