モーダル選択に基づいて入力を更新する方法

現在、私はLaravel Frameworkを使用しています。私はすべてのレコードを一人のユーザーからイベントについて送信しますが、ユーザーが複数のイベントレコードを持っていれば、編集したいイベントを選択する必要があります。私はすでにすべてのイベントを表示するモーダルを作成しましたが選択したイベントを取得し、その特定のイベントですべての入力を入力できますか？ここモーダル選択に基づいて入力を更新する方法

コントローラ

public function dashboardEvents(){           
//Brings all the info from the user events        
$data['events'] = UserEvent::where('user_id', Auth::user()->id)->get(); 
//This is to know if there's more than one record 
if(UserEvent::where('user_id', Auth::user()->id)->get()->count()>1) { 
    $data['multiple'] = true;           
} else {                
    $data['multiple'] = false;           
}                  
return view('user-pages/my-events', $data);

}

見る私のコードです

<title>User Dashboard</title> 
<body class="html not-front not-logged-in no-sidebars page-node page- 

<!-- Al the Inputs --> 
<select class="form-control" style="margin-bottom: 15px;" id="user_roles"> 
    <option value="bride">I am a bride</option> 
    <option value="groom">Im a groom</option> 
    <option value="groomsman">Im a guest</option> 
    <option value="wedding_planner">Im a wedding planner</option> 
</select> 

<input type="text" class="form-control" style="margin-bottom: 15px;"> 
    <div class="input-group date" data-provide="datepicker" style="margin-bottom: 15px;"> 
    <input type="text" class="form-control"> 
     <div class="input-group-addon"> 
     <span class="glyphicon glyphicon-th"></span> 
     </div> 
</div> 

<select class="form-control" style="margin-bottom: 15px;" id="party-type"> 
    <option id="wedding">Wedding</option> 
    <option id="party">Party</option> 
    <option id="prom">Prom</option> 
</select> 

<select class="form-control" style="margin-bottom: 15px;" id="user-task"> 
    <option>I am shopping for just Groomsmen</option> 
    <option>I am shopping for me</option> 
</select> 

<input type="text" class="form-control" id="phone_number_user" style="margin-bottom: 15px;"> 

<input type="text" class="form-control" id="usr" style="margin-bottom: 15px;" placeholder="New Password">

モーダル

<div class="modal fade" id="UserDashboardModal" role="dialog"> 
    <div class="modal-dialog"> 
    <!-- Modal content--> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal">&times;</button> 
      <h4 class="modal-title">Choose an Event to Edit</h4> 
     </div> 
     <div class="modal-body"> 
      <select class="form-control"> 
       @foreach($event as $key=>$cat) 
       <option value="{{ $cat->user_event_id }}">{{ $cat->name }}</option> 
       @endforeach 
      </select> 
     </div> 
     <div class="modal-footer"> 
      <button type="button" class="btn btn-default" data-dismiss="modal" id="modalFromEventButton">Select</button> 
     </div> 
    </div> 
</div>

モーダル

私が選択したイベントを取得するにはどうすればよい

<script> 
    $(document).ready(function() { 
     $('#UserDashboardModal').modal('show'); 
    }); 
</script>

を開くためのスクリプト？そして、正しいデータで自動的に入力をアップロードしますか？

出典

2016-09-10 Elva P.

http://stackoverflow.com/questions/11179406/jquery-get-value-of-select-onchangeこれは役に立ちます。 1つはあなたが値を持って、あなたはあなたが欲しいものを更新する –

userEventsを2回クエリしているように少し質問を変更します。

コントローラー：あなたはあなたの最初の結果セットからのカウントを取得することができ

public function dashboardEvents() 
{           
    // Get all the event ids for the user. 
    $data['events'] = UserEvent::where('user_id', Auth::user()->id)->get(); 
    // Check count. 
    $data['multiple'] = $data['events']->count() > 1 ? true : false; 
    // Return view. 
    return view('user-pages/my-events', $data); 
}

あなたのselect以下このUserEvent IDと対応するIDで包まれた編集フォームのフォーム要素を持つあなたのブレードを更新モーダル。

ブレード：

<form action="/your/update/route" method="POST"> 
    <input type="hidden" name="_token" value="{{ csrf_token() }}"> 
    @foreach($event as $key => $cat) 
     <div id="cat-{{ $cat->user_event_id }}" style="display:none"> 
      <!-- build your form elements for update --> 
     </div> 
    @endforeach 
</form>

フォームがユーザーに表示されますかを決定する選択ボックスイベントにスクリプトを更新します。

スクリプト：

$(document).ready(function() { 

    $('#UserDashboardModal').modal('show'); 

    $('.modal-body select').change(function() { 
     // Get selected userEventId. 
     var userEventId = $('.modal-body select option:selected').val(); 
     // Change your form with $('#cat-' + userEventId) 
     // code... 
    }); 

});

最後の注意：ダッシュボード上のあなたの選択の事前移入のみのID &名前を照会する方がよいかもしれません（ユーザーがuserEventsの多くを持っている可能性があるとして、）。そして、ajaxを使ってユーザーがイベントを選択したときに、別の呼び出しで完全なデータを取得します。がんばろう！

出典

2016-09-10 19:24:40

ありがとう！うん、それはベターオプションのように思える、私はそれも好きかもしれない –

モーダル選択に基づいて入力を更新する方法

答えて

関連する問題