Score:0

Form API States required don't seem to work on a custom form with ajax

ธง us

I can't get form states required to work on an ajax submitted form.

Here is some example code. It is taken from the examples module and slightly modified to illustrate the problem.

  /**
   * {@inheritdoc}
   */
  public function buildForm(array $form, FormStateInterface $form_state) {
    // This container wil be replaced by AJAX.
    $form['container'] = [
      '#type' => 'container',
      '#attributes' => ['id' => 'box-container'],
    ];
    // The box contains some markup that we can change on a submit request.
    $form['container']['box'] = [
      '#type' => 'markup',
      '#markup' => '<h1>Initial markup for box</h1>',
    ];

    $form['changethis'] = [
      '#title' => $this->t("Choose something and explain why"),
      '#type' => 'select',
      '#options' => [
        'one' => 'one',
        'two' => 'two',
        'three' => 'three',
      ],
    ];

    $form['title'] = [
      '#type' => 'textfield',
      '#title' => $this->t('Title'),
      '#states' => [
        'required' => [
          ':input[name="changethis"]' => ['value' => 'two'],
        ],
        'visible' => [
          ':input[name="changethis"]' => ['value' => 'two'],
        ],
      ],
    ];

    $form['submit'] = [
      '#type' => 'submit',
      // The AJAX handler will call our callback, and will replace whatever page
      // element has id box-container.
      '#ajax' => [
        'callback' => '::promptCallback',
        'wrapper' => 'box-container',
      ],
      '#value' => $this->t('Submit'),
    ];

    return $form;
  }

The title field shows up, when "two" is selected and is marked required. But when the form is submitted with the title field empty, neither HTML5 validation or form validation is complaining about the field being empty. When the "#ajax" part from the submit button is removed, the required state works fine.

4uk4 avatar
cn flag
ดู https://drupal.stackexchange.com/questions/14173/how-to-make-a-form-required-with-states
us flag
ขอบคุณสำหรับลิงค์! ตกลง ฉันเข้าใจว่าต้องมาจากสถานะไม่ได้รับการตรวจสอบฝั่งเซิร์ฟเวอร์ แต่เหตุใดฝั่งไคลเอนต์จึงไม่ได้รับการตรวจสอบโดยปุ่มถูก ajaxified
4uk4 avatar
cn flag
Ajax เป็นฝั่งเซิร์ฟเวอร์และแทนที่การตรวจสอบความถูกต้องของจาวาสคริปต์ฝั่งไคลเอนต์ซึ่งอาจแนบมากับปุ่มส่งมาก่อน

โพสต์คำตอบ

คนส่วนใหญ่ไม่เข้าใจว่าการถามคำถามมากมายจะปลดล็อกการเรียนรู้และปรับปรุงความสัมพันธ์ระหว่างบุคคล ตัวอย่างเช่น ในการศึกษาของ Alison แม้ว่าผู้คนจะจำได้อย่างแม่นยำว่ามีคำถามกี่ข้อที่ถูกถามในการสนทนา แต่พวกเขาไม่เข้าใจความเชื่อมโยงระหว่างคำถามและความชอบ จากการศึกษาทั้ง 4 เรื่องที่ผู้เข้าร่วมมีส่วนร่วมในการสนทนาด้วยตนเองหรืออ่านบันทึกการสนทนาของผู้อื่น ผู้คนมักไม่ตระหนักว่าการถามคำถามจะมีอิทธิพลหรือมีอิทธิพลต่อระดับมิตรภาพระหว่างผู้สนทนา