2016-09-17 19 views
0

私は2つのテーブル:国と都市を持っています。ユーザーが国を選択して選択した国に対応する都市を入力すると、2番目のドロップダウンが表示されます。Vue.jsリクエストからLaravel 5.3フォームへのデータの受け渡し

残念ながら、検索された値をフォームに渡す方法がわかりません。検索

値は、ID 21と国の下にあるノルウェー:)

選択した{ "国" であり、 "21"、 "CountrySelected":真、 "都市":{ "6": "オスロ"、 "11": "リレハンメル"}}

// My app.js 
 

 
const app = new Vue({ 
 

 

 
el: '#events', 
 

 
    data: { 
 
\t \t country:'', 
 
\t \t CountrySelected: false, \t 
 
\t \t cities:[], \t 
 
    }, 
 

 
    methods: { 
 

 
\t \t WhenCountryHasBeenSelected: function(event) { 
 
\t \t \t this.getCities(); 
 
\t \t \t this.CountrySelected= true; 
 
\t \t }, 
 

 
\t \t getCities: function(){ 
 
\t \t \t this.$http.get('api/cities/'+this.country).then(function (response) { 
 
     this.cities = response.data; 
 
     }); 
 
    } 
 
    }, 
 

 
})
//My api.php routes 
 

 
Route::get('/cities/{country_id}', function (Request $request, $country_id) { 
 
\t \t 
 
$cities=App\City::where('country_id', $country_id)->get()->pluck('name','id'); 
 

 
return $cities; 
 
}); 
 

 

 
//My blade file 
 

 
@extends('layouts.app') 
 

 
@section('content') 
 
<div class="container"> 
 
    <div class="row"> 
 
     <div class="col-md-8 col-md-offset-2"> 
 
     <div id="events"> 
 
      <div class="panel panel-default"> 
 
       <div class="panel-heading">Select cities by country</div> 
 

 
       <div class="panel-body"> 
 

 

 
        {!! Form::open() !!} 
 

 

 
        {!! Form::select('country', $countries, null, ['v-model'=>'country', '@change'=>'WhenCountryHasBeenSelected' ,'class'=>'form-control']) !!} 
 
        
 
        <div v-show="CountrySelected"> 
 
        {!! Form::select('city',$cities, null, ['class'=>'form-control']) !!} 
 
        {!! Form::close() !!} 
 

 
        
 
        Selected @{{ $data | json }} 
 
       
 
       </div> 
 
      </div> 
 
     </div> 
 
     </div> 
 
    </div> 
 
</div> 
 
@endsection

答えて

0

はLaravelコレクションのマップ機能を使用することになりました。ムールートは、この

Route::get('/cities/{country_id}', function (Request $request, $country_id) { 
     $collection=App\City::where('country_id', $country_id)->get(); 
     $cities=$collection->map(function($city){ 
      return ['id' => $city->id, 'name' => $city->name]; 
      })->toArray(); 

ロングライブLaracastフォーラムやバッシー:)

のように今見えます
関連する問題