Php Laravel-如何在下拉列表中提交后动态加载同一视图中的内容

从下拉列表中选择一个选项后，我将其提交给控制器函数，该函数将在不同的视图中返回所需的数据。我希望它将视图加载到与提交它的下拉列表相同的页面（可能在div中）。（我不熟悉Laravel和PHP）

下面是我的clinic.blade.php文件，它在下拉列表中列出了诊所

    {!! Form::open(['route' => 'clinicIndex', 'method' => 
       'POST'])!!}

    <label> Select Clinics </label>
    <select name = "clinic">
        @foreach($clinics as $clinic)
            <option value="{{$clinic->clinicID}}"> {{$clinic->clinicName}}</option>
        @endforeach
    </select>

        {{Form::submit('DisplayDoctors', ['class' => 'btn btn-outline- 
     primary'])}}
   {{Form::close()}}

这是控制器中的函数

public function clinicIndex(Request $request)
    {
        $selectedClinic = $request->clinic;

        $clinicInfo = Clinic::where('id', '=', $selectedClinic)->get();

        $dbArray = DB::connection('mysql2')->select("SELECT * FROM bp_admin.tdbsrv WHERE iClinicId = $selectedClinic");

        $dbInfo = $dbArray[0];

        $remoteConnection = DatabaseConnection::setConnection($dbInfo);

        $doctors = $remoteConnection->select("SELECT tUsers.sSalutation, tLocationPhysician.iPhysicianId, tUsers.sFirstName,
                    tUsers.sLastName,tUsers.iPhysNum,tUsers.sDateHired,
                tPhysician.bLocum,tPhysician.bResident,
                tPhysician.dStartDay,tPhysician.dEndDay
                from tUsers
                inner join tLocationPhysician
                inner join tPhysician
                where
                tLocationPhysician.iLocationId = $selectedClinic
                and tPhysician.iId = tLocationPhysician.iPhysicianId
                and tPhysician.iPhysNum = tUsers.iPhysNum
                and tUsers.bArchived =0
                and tLocationPhysician.bArchived =0
                and tPhysician.bArchived =0
                order by tUsers.sFirstName asc");

        return view('pages.show')->with('doctors', $doctors);
    } 

您可以看到它正在以不同的视图返回表（打开一个新页面）。相反，我希望它在从下拉列表中提交我的选择后在同一视图中加载表

    {!! Form::open(['route' => 'clinicIndex', 'method' => 
       'POST'])!!}

    <label> Select Clinics </label>
    <select name = "clinic">
        @foreach($clinics as $clinic)
            <option value="{{$clinic->clinicID}}"> {{$clinic->clinicName}}</option>
        @endforeach
    </select>

        {{Form::submit('DisplayDoctors', ['class' => 'btn btn-outline- 
     primary'])}}
   {{Form::close()}}

我在clinic.blade.php中尝试过这样做

<div class="container" id="dispDoctors"> </div>

并在同一视图中添加了一个ajax脚本

<script>
function loadDocContent(){
    $('#dispDoctors').load('/loadDocs');
}
</script>

函数loadDocContent（）{
$（'#dispDocs'）.load（'/loadDocs'）；
}

---

为了测试动态负载，我在web.php中为“/loadDocs”定义了与控制器函数clinicIndex（）相同的函数。我被困在如何从这里开始。因为我不知道如何将下拉选择传递给jquery函数。

使用axios调用提交表单并从控制器接收响应。

---

这里的示例代码

您应该使用ajax或Pjax动态加载网页中的内容，

---

当使用Ajax或Pjax时，必须从控制器返回json格式的响应

我终于发现，使用ajax可以实现这一点。我以html格式返回视图，并将其加载到原始视图中

这是我的刀锉

@extends('layouts.apptest')


@section('content')

@include('inc.messages')

<br>


<div class="container">
    <div class="col-lg-4">
        {{Form::open(array('url'=>'', 'files'=>true))}}

            <div class="form-group">
                <label for="">Select clinics</label>
                <select class="form-control input-sm" name="clinic" id="clinic">
                    @foreach($clinics as $clinic)
                        <option value="{{$clinic->clinicID}}"> {{$clinic->clinicName}}</option>
                    @endforeach
                </select>
            </div>

        {{Form::close()}}
    </div>
</div>



<div class="container" id="dispDoctors">

</div>

@endsection

@section('script')

<script>

    $('#clinic').on('change', function(e){
        console.log(e);

        var clinic_sel = e.target.value;

        //ajax

        $.get('/ajax-clinic?clinic_sel=' +clinic_sel, function(data){
            //success data
            $('#dispDoctors').html(data.html);
        });
    });

</script>

@endsection 

您可以在我的blade文件中看到，我正在加载ajax调用返回的html

---

也感谢其他答案

鉴于OP已经安装了jQuery，他们最好使用

$.ajax

，而不是安装第二个包来完成同样的工作。ajax也很好。但我喜欢axios的名字。AXIOSIt是通用的，但不需要返回JSON。例如，您可以从刀片模板返回HTML并将其插入元素的位置。

Route::get('/ajax-clinic', function(){

    $clinic_sel = Input::get('clinic_sel');

    $clinicInfo = Clinic::where('id', '=', $clinic_sel)->get();

        $dbArray = DB::connection('mysql2')->select("SELECT * FROM bp_admin.tdbsrv WHERE iClinicId = $clinic_sel");

        $dbInfo = $dbArray[0];

        $remoteConnection = DatabaseConnection::setConnection($dbInfo);

        $doctors = $remoteConnection->select("SELECT tUsers.sSalutation, tLocationPhysician.iPhysicianId, tUsers.sFirstName,
                    tUsers.sLastName,tUsers.iPhysNum,tUsers.sDateHired,
                tPhysician.bLocum,tPhysician.bResident,
                tPhysician.dStartDay,tPhysician.dEndDay
                from tUsers
                inner join tLocationPhysician
                inner join tPhysician
                where
                tLocationPhysician.iLocationId = $clinic_sel
                and tPhysician.iId = tLocationPhysician.iPhysicianId
                and tPhysician.iPhysNum = tUsers.iPhysNum
                and tUsers.bArchived =0
                and tLocationPhysician.bArchived =0
                and tPhysician.bArchived =0
                order by tUsers.sFirstName asc");




        $returnView = view('pages.test')->with('doctors', $doctors)->render();

        return response()->json(array('success' =>true, 'html' =>$returnView));


});