submit laravelで選択したオプションをリダイレクト

Question

私が選択したオプションをリダイレクトするにはどうすればいいですか？ 私はさまざまなユーザーのヘッダーにあるモーダルサインアップをしようとしています。ユーザーが1つを選択すると、特定のサインアップページにリダイレクトされます。

これは私のheader.blade.php

<div id="modal1" class="modal"> 
    <div class="modal-content"> 
     <h4>Choose Roles/Plan</h4>  
     <div class="input-field col s12"> 
      <select id="select-action" name = "action"> 
      <option value="" disabled selected>Choose your option</option> 
      <option value="basicsignup">Basic</option> 
      <option value="advancedsignup">Advanced</option> 
      <option value="teamsignup">Team</option> 
      </select> 
     </div> 
    </div> 

     <div class="modal-footer"> 
      <button type="submit">Submit</button> 
     </div> 
    </div> 

のroutes.phpからである

Route::get('/basicsignup', function(){ 
    return view('actions.basicsignup'); 
})->name('basicsignup'); 

Route::get('/advancedsignup', function(){ 
    return view('actions.advancedsignup'); 
})->name('advancedsignup'); 

Route::get('/teamsignup', function(){ 
    return view('actions.teamsignup'); 
})->name('teamsignup'); 

編集：オリジナルの例には、動物、花、車が...少なくとも明確にするためにそれを編集しました。

Answer 1

JavaScriptのonsubmit機能を使用して、選択した値を取得するよりもJS関数を呼び出すことができます。その後、カスタマイズしたURLでフォームを送信できます。

例

<form method="post" id="myForm" onsubmit="return submitForm()"> 
    <select id="select-action" name="action"> 
     <option value="" disabled selected>Choose your option</option> 
     <option value ="animals">Animals</option> 
     <option value ="flowers">Flowers</option> 
     <option value ="cars">Cars</option> 
    </select> 
    <button type="submit">Submit</button> 
</form> 

<script type="text/javascript"> 

    function submitForm() { 
     var selectedOption = $('#select-action').val(); 
     var url = ""; 
     if(selectedOption == 'animals') { 
      url = '{{ route('your/route')}}'; 
     } else if (selectedOption == 'flowers') { 
      url = '{{ route('your/route')}}'; 
     } 
     . 
     . 
     . 

     $('#myForm').attr('action', url); 
     $('form#myForm').submit(); 
     return false; 
    } 
</script>