Question

我有一个像这样的表格：

<form action="{{route('articles.create')}}" method="POST">
    @csrf
    <input type="hidden" name="typeId" :value="articleTypeSelected"/>
    @foreach($types as $type)
      <button  type="submit" v-model="articleTypeSelected" :value="{{ $type->id }}"
      class="dropdown-item text-left">{{ $type->name }}
      </button>
   @endforeach
</form>


  <script>
       window.app = new Vue({
           el: '#app',
           data: {
               articleTypeSelected: []
           }
       });
    </script>

我正在尝试获取单击的按钮的输入值，以便使用Vuejs2提交表单，但总是得到空的结果，例如数据。

Answer 1

@foreach($types as $type)

  <a href="{{ route('articles.create') }}" class="dropdown-item"
      onclick="event.preventDefault(); document.getElementById('type{{$type->id}}').submit();">

  {{ $type->name }}

    <form id="type{{$type->id}}" action="{{ route('articles.create') }}" method="post">
       @csrf
       <input type="hidden" name="typeId" value="{{$type->id}}"/>

    </form> 

  </a>

@endforeach

通过Vue中的按钮获取输入值

1 个答案: