Laravel - 检查数据是否存在于javascript中的数据库中

Question

我正在用 Laravel 7 构建一个表单。首先，用户需要在 datalist 输入框中选择一项，一旦选择就会显示相应的详细信息（“模糊”输入框）。用户还可以将自定义项目添加到列表中。数据库用于存储所有项目，如果用户添加自定义项目，它将存储在数据库中以便显示。因此，由于它是一个输入框，因此用户可以输入。如果数据库中不存在输入，我希望它不显示任何信息，直到用户点击添加按钮将自定义项目添加到数据库以及输入下拉列表中，然后将显示默认信息。但是如何判断输入是否存在于数据库中呢？表单是这样的，我使用 Jquery 来隐藏/显示div选择了哪个项目。<form action"/send" method="post">  <div id="info1">    <!-- info about first item -->      </div>  <div id="info2">    <!-- info about second item -->  </div>  <div id="info_default">    <!-- if customised item is chosen, show this one -->    </div>  <div id="info_does_not_exist">    <!-- if cannot find the input item in database, show this one -->    </div>  <button type="submit">submit</button></form>

Answer 1

对于简单的方法，我推荐你使用 jQuery 的 Ajax，这样你不需要做太多的改变，为 API 添加一个路由，检查数据库中的数据和几行 JavaScript 代码。您可以尝试以下方法：

控制器：

use Your\Namespace\Path\Of\Model Model

Class ABC {

    ...

    public function checkExist(){

        $data = request()->get('data'); // get data to check

        $model = new Model();

        $where = ['id' => $data]; // passing your where condition to check

        return $model->where($where)->get()->count() > 0;

    }

}

路由文件（web.php/api.php）：

路线::get('checkExist', 'ABC@checkExist');

看法

<form action"/send" method="post">

  <div id="info1">

    <!-- info about first item -->    

  </div>

  <div id="info2">

    <!-- info about second item -->

  </div>

  <div id="info_default">

    <!-- if customised item is chosen, show this one -->  

  </div>

  <div id="info_does_not_exist">

    <!-- if cannot find the input item in database, show this one -->  

  </div>

  <button type="submit">submit</button>

</form>

...

<script>

  $(function(){

    // every time input change, check value existence in database

    $('.info2 input').change(function(){

      let input_value = $(this).val();

      $.ajax({

        url: "{{ route('checkExist') }}",

        method: "GET",

        data: {"id": input_value},

        success: function(response){

          // process if/else to show div '.info_default' / '.info_does_not_exist'

          if (response) {

            // show '.info_default' and hide '.info_does_not_exist'

          } else {

            // show '.info_does_not_exist' and hide '.info_default'

          }

        }

      });

    })

  })

</script>

这不是实际的可运行代码，只是一个想法，根据这个，您可以根据您的进一步需求对其进行调整。希望这会有所帮助

Answer 2

您必须使用 AJAX 之类的东西来检查数据库中的用户输入值，然后做出正确的决定，在添加或显示数据库中的内容之前不显示任何内容。

因此工作流程如下：用户输入 => ajax 接受用户输入并提交给控制器函数以检查数据库是否存在值 => 取决于从该控制器函数返回的值 => 向用户显示正确的值