Question

我有一个带有一个字段的表单和一个带有ajax提交选项的提交按钮，如下所示 -

public function buildForm(array $form, FormStateInterface $form_state, $id = 0)
{       
    $form['fieldset']['message'] = array(
        '#type' => 'textfield',
        '#default_value' => "",
        '#required' => true,
        '#attributes' => array(
            'placeholder' => t('write here'),
        ),
    );

    $form['actions']['submit'] = array(
        '#type' => 'submit',
        '#value' => $this->t('Send'),
        '#attributes' => array(
            'class' => array(
            ),
        ),
        '#ajax' => [
            'callback' => [$this, 'Ajaxsubmit'],
            'event' => 'click']
    );
    return $form;
}

ajax功能如下 -

public function Ajaxsubmit(array $form, FormStateInterface $form_state)
    {
        $user = \Drupal\user\Entity\User::load(\Drupal::currentUser()->id());
        $db_values = [
            "message" => $form_state->getValue("message"),
            "date_create" => date("Y-m-d H:i:s"),
        ];
        $save = DbStorage::Insert($db_values);
        //$form_state['rebuild'] = TRUE;

        $response = new AjaxResponse();

        $message = DbStorage::Get(["id" => $save]);
        $send_id = $message->send_id;
        $build = [
                '#theme' => "chat_view",
                '#message' => $message,
                '#sender' => $send_id,
                '#current_user' => true
            ];
        $ans_text = render($build);
        $response->addCommand(new AppendCommand('#mychat', $ans_text));
        }
        return $response;

    }

此处表单数据提交工作正常。但提交后输入数据不会被清除。我尝试使用 -

从我的javascript中清除它

$('#my_form input').val("");

但问题是我的javascript文件每3秒调用一次，表单输入也会每3秒清除一次。这对用户来说是个问题。在ajax提交后有没有其他方法可以清除表单输入？我可以在Ajaxsubmit函数中做任何事情吗？

此外，获取新数据后，消息框不会自动向下滚动。我需要使用鼠标来查看新消息。我尝试使用以下内容在我的javascript文件中解决它 -

               $("#mychat").each( function()
               {
                   var scrollHeight = Math.max(this.scrollHeight, this.clientHeight);
                  this.scrollTop = scrollHeight - this.clientHeight;
                });

同样，问题是它每隔3秒向下滚动到消息框。如果用户想要向上滚动以查看先前的消息，则向下滚动。所以它不是用户友好的。有没有其他方法可以向下滚动到新消息的消息框，同时，如果用户的鼠标向上滚动，它将不会向下滚动？

Answer 1

是的，还有另一种方法可以清除表单输入。您可以从Ajax函数返回实际的$form数组，而不是创建Ajax响应。

如何利用这一点的一个很好的例子可以在这里找到： https://drupal.stackexchange.com/a/211582/82623

就回车键而言，您需要在'event' => 'click'阵列中移动$form['actions']['submit']['#ajax']并取消注释。这对我来说过去很有用。在这里找到了一个有类似观察的人：https://drupal.stackexchange.com/a/29784/82623

在ajax提交后，表单输入未被清除，并且在drupal 8中滚动没有下降

1 个答案: