我一直在尝试创建两个下拉选择来创建订单 (pedido),其中第一个选择用于客户 (clientes),第二个选择用于客户的联系人 (contatos)。 (客户有很多联系方式)
这是我当前的设置:
路线:
Route::post('/pedidos/create/{id}',[ClienteController::class, 'getContato']);
Route::get('/pedidos/create',[ClienteController::class, 'getCliente']);
控制器:
在 PedidoController.php 中:
public function create() {
$query = DB::select("SELECT * FROM `clientes` WHERE deleted_at IS null");
$clientes = collect($query)->toArray();
$query = DB::select("SELECT contatos.nome, contatos.id FROM `contatos` INNER JOIN `clientes` ON clientes.id = contatos.clientes_id AND contatos.deleted_at IS null;");
$contatos = collect($query)->toArray();
return view('pedidos.create', ['clientes'=>$clientes], ['contatos'=>$contatos]);
}
在客户端控制器中:
public function getCliente() {
$data['clientes'] = Cliente::get(["nome", "id"]);
return view('pedidos.create', compact($data));
}
public function getContato($id) {
$contatos = DB::table("contatos")
->where("cliente_id",$id)
->pluck("nome","id");
return response()->json($contatos);
}
public function store(Request $request) {
$pedido = new Pedido();
$pedido->cliente_id = $request->cliente_id;
$pedido->contato_id = $request->contato_id;
$pedido->save();
return redirect('/pedido')->with('success','Pedido criado');
}
最后,我的pedido/create.blade.php:
@extends('layouts.app')
@section('content')
<section>
<div class="container">
<form action="{{ route('pedido.store')}}" method="post">
@csrf
<h1>Cadastrar pedidos</h1>
@if($errors->any)
<div>
<ul>
@foreach($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
@endif
<div class="column" style="display: flex;flex-direction:row">
<div class="subcolumn" style="width: 20%;">
<label for="form-label">Cliente:</label>
<select id="cliente_id" class="form-control" name="cliente_id">
<option value="" disabled selected>Select cliente</option>
@foreach ($clientes as $data)
<option value="{{$data->id}}">{{$data->nome}}</option>
@endforeach
</select>
</div>
<div class="subcolumn" style="width: 20%;">
<label for="form-label">Contato:</label>
<select id="contato_id" class="form-control" name="contato_id">
</select>
</div>
<div class="subcolumn" style="width:20%;display:flex"></div>
</div>
<div class="buttons">
<button class="btn-submit" type="submit" action="{{ route('pedido.store')}}">Cadastrar</button>
<a href="{{ route('pedido.index')}}">Voltar</a>
</div>
</form>
</div>
</body>
</html>
@endsection
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js">
$(document).ready(function(){
$('#cliente_id').on('change', function () {
var idCliente = this.value;
$("#contato_id").html('');
$.ajax({
url: '{{url("cliente/fetchContato")}}'+idCliente,
type: "POST",
data: { cliente_id: idCliente},
success: function (result) {
alert()
$('#contato_id').html('<option value="">Select contato</option>');
$.each(result.contatos, function (key, value) {
$("#contato_id").append('<option value="' + value
.id + '">' + value.name + '</option>');
});
}
});
});
});
</script>
我刚刚看到我在控制器中犯了一些错误,所以这就是缺少的内容(我认为):
PedidoController.php:
public function create()
{
$query = DB::select("SELECT * FROM `clientes` WHERE deleted_at IS null");
$clientes = collect($query)->toArray();
$query = DB::select("SELECT contatos.nome, contatos.id FROM `contatos` INNER JOIN `clientes` ON clientes.id = contatos.clientes_id AND contatos.deleted_at IS null;");
$contatos = collect($query)->toArray();
return view('pedidos.create', ['clientes'=>$clientes], ['contatos'=>$contatos]);
}
而函数存储实际上来自PedidoController.php
public function store(Request $request)
{
$pedido = new Pedido();
$pedido->cliente_id = $request->cliente_id;
$pedido->contato_id = $request->contato_id;
$pedido->save();
return redirect('/pedido')->with('sucess','Pedido criado');
}