2017-11-02 7 views
0

皆さん、私は電子メールを送信するための簡単な連絡フォームを作っています。電子メールが送信された送信ボタンを押したときに、私はどのようにしてモーダルまたは通知を表示できますか?電子メール送信機能を実行してからモーダルを表示するだけです。laravelで関数を実行した後、どのようにポップアップモーダルを表示できますか?

ブレード:

<form role="form" enctype="multipart/form-data" action="{{action('AltHr\Portal\[email protected]')}}" method="post" class="m-t-15"> 
 
{{csrf_field()}} 
 
    <div class="form-group form-group-default"> 
 
    <label>Full Name<span style="color:red">*</span></label> 
 
    <input type="text" name="name" placeholder="As per IC" class="form-control" required> 
 
    </div> 
 
    <div class="form-group form-group-default"> 
 
    <label>Company<span style="color:red">*</span></label> 
 
    <input type="text" name="company" placeholder="Company name" class="form-control" required> 
 
    </div> 
 
    <div class="form-group form-group-default"> 
 
    <label>Email<span style="color:red">*</span></label> 
 
    <input type="email" name="email" placeholder="Company email preferred" class="form-control" required> 
 
    </div> 
 
    <div class="form-group form-group-default"> 
 
    <label>Phone Number</label> 
 
    <input type="number" name="number" placeholder="Phone number optional" class="form-control"> 
 
    </div> 
 
     <div class="form-group form-group-default"> 
 
        <label>Category</label> 
 
        <select name="category" class="full-width form-control"> 
 
        <option value="General">General</option> 
 
     <option value="Sign Up">Sign Up</option> 
 
     <option value="Onboarding">Onboarding</option> 
 
     <option value="Expenses">Expenses</option> 
 
     <option value="Travels">Travels</option> 
 
     <option value="Leaves">Leaves</option> 
 
     <option value="Suggestions">Suggestions</option> 
 
        </select> 
 
       </div> 
 
    <div class="form-group form-group-default"> 
 
    <label>Message<span style="color:red">*</span></label> 
 
    <textarea name="text" placeholder="Please type your message here" style="height:100px" class="form-control" required></textarea> 
 
    </div> 
 
    <div class="form-group form-group-default"> 
 
    <label>Attachment</label> 
 
    <input type="file" name="files[]" accept="file_extension|image/*|media_type" multiple> 
 
    </div> 
 

 
    <div class="sm-p-t-10 clearfix"> 
 
    <i class="pull-left small hint-text m-t-5 font-arial"><span style="color:red">*</span>indicates required field</i> 
 
    <button class="btn btn-primary font-montserrat all-caps fs-12 pull-right xs-pull-left">Submit</button> 
 
    </div> 
 
    <div class="clearfix"></div> 
 
</form>

ルート:

\t Route::post('send-email','[email protected]');

コントローラー:

public function sendemail(Request $request) 
 
\t { 
 
\t \t $data = array(
 
\t \t \t 'name'=> $request->name, 
 
\t   'email'=> $request->email, 
 
\t   'text'=> $request->text, 
 
\t   'category'=> $request->category, 
 
\t   'company'=> $request->company, 
 
\t   'number'=> $request->number 
 
    \t); 
 

 
    \t $files = $request->file('files'); 
 

 
\t  \Mail::send('AltHr/Portal/supportemail', $data, function ($message) use($data, $files){ 
 

 
\t   $message->from($data['email'], $data['name']); 
 
\t   $message->to('[email protected]')->subject($data['company'] . ' - ' .$data['category']); 
 

 
\t   if(count($files > 0)) { 
 
\t    foreach($files as $file) { 
 
\t     $message->attach($file->getRealPath(), array(
 
\t      'as' => $file->getClientOriginalName(), // If you want you can chnage original name to custom name  
 
\t      'mime' => $file->getMimeType()) 
 
\t    ); 
 
\t    } 
 
\t   } 
 

 

 
\t  }); 
 

 
\t  \Mail::send('AltHr/Portal/supportresponse', $data, function ($message) use($data){ 
 

 
\t   $message->from('[email protected]', 'alt.hr Support'); 
 
\t   $message->to($data['email'])->subject('Greetings from alt.hr'); 
 

 
\t  }); 
 
\t  
 
\t \t return view('AltHr.Portal.support'); 
 
\t }

コードが正常に動作しているが、今私は、モーダルは、電子メールが送信されてきたと言う方には必要です。どうやってやるの?

モーダル:

<div id="emailSentModal" class="modal fade" 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">Modal Header</h4> 
 
     </div> 
 
     <div class="modal-body"> 
 
      <p>Some text in the modal.</p> 
 
     </div> 
 
     <div class="modal-footer"> 
 
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
 
     </div> 
 
     </div> 
 

 
    </div> 
 
    </div>

答えて

0

あなたは、アヤックスを使用してPOSTリクエストを送信し、応答を取得した後、JavaScriptでのモーダルを示すことによってそれを行うことができます。

に似た何か:あなたはセッション変数を使用することができます

$.ajax({ 
     type: "POST", 
     url: {{action('AltHr\Portal\[email protected]')}}, 
     data: { 
      // Your data here 
     }, 
     success: function(msg) 
     { 
      $("#emailSentModal").modal("toggle"); 
     } 
    }); 
+0

申し訳ありませんか? – anon

0

。このセッション変数に値がある場合、モーダルが表示されます。このようなもの。

コントローラ私は本当に理解していけない

public function sendemail(Request $request) 
     ..... 
     ... 
     return view('AltHr.Portal.support')->with('modal','true'); 

ブレード

<script> 
      @if(session()->has('modal')) 
      $("#emailSentModal").modal("toggle"); 

      @endif 
     </script> 
+0

こんにちは@kenneth私はこれを試しましたが、モーダルを表示していません – anon

+0

それは働いています。私は私の答えを更新して見て、もう一度試すことができます – Kenneth

+0

私はそれを試して、それは私の上で動作していません。 – anon

関連する問題