2016-12-13 12 views
0

私は、ユーザーがコース名を追加するポップアップモデルを持っています。私は、私のcodeigniterコントローラでフォームの検証を追加して、検証が偽の場合は、モデルの上のフォーム入力を表示するフォームエラーで再度ビューをロードしていますが、ページのリロードによりモデルが閉じます。私がしたいのは、フォームの検証が偽である場合です。モーダルを開いたままページをリロードしたいです。私はajaxに精通していません。どんな助けでも本当に感謝します。ページリロード後にブートストラップモーダルをエラーでロードする方法(コードシニターを使用)

CodeIgniterのコントローラ

$this->form_validation->set_rules('course_name', 'Course Name', 'required|max_length[30]'); 
$this->form_validation->set_error_delimiters('<div class="text-danger">', '</div>'); 
if ($this->form_validation->run()) { 
    echo "inserted"; 
}else { 
    $this->load->view('admin/coursename'); 
} 

CodeIgniterのビュー(モーダルコード)

<center><button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">Add Course</button><center> 
    <!-- Modal --> 

    <div class="modal fade" data-backdrop="static" data-keyboard="false" id="myModal" 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">Add Course</h4> 
      </div> 
      <div class="modal-body"> 
       <form action="" method="post"> 
        <div class="form-group"> 
         <label for="name">Course Name:</label> 
         <?php echo form_error('course_name'); ?> 
         <input type="text" class="form-control" id="name" name="course_name" placeholder="Enter course name..."> 
        </div> 
        <div class="form-group"> 
         <button type="submit" class="btn btn-success">Save</button> 
         <button type="reset" class="btn btn-warning">Cancel</button> 
        </div> 
       </form> 
      </div> 
      <div class="modal-footer"> 
      <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button> 
      </div> 
     </div> 
     </div> 
    </div> 
+0

jquryに精通していますか?それから私は解決策を持っています。 –

+0

ajaxタグを追加したので、ajaxを使用してフォームを送信しますか? –

答えて

0

あなたは更新せず、検証コントローラを呼び出すためのjQueryの "アヤックス()" メソッドを使用することができ、その後、コントローラは、そのエコーその結果、あなたのj-クエリーコードは今補間しなければなりません。以下のサンプルコード。そして、あなたがそのようなようなあなたのコントローラを設定することができます

<div class="modal fade" data-backdrop="static" data-keyboard="false" id="myModal" 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">Add Course</h4> 
     </div> 
     <div class="modal-body"> 
      <div class="err"> 

      </div> 
      <form action="" method="post" id ="yourform"> 
       <div class="form-group"> 
        <label for="name">Course Name:</label> 
        <?php echo form_error('course_name'); ?> 
        <input type="text" class="form-control" id="name" name="course_name" placeholder="Enter course name..."> 
       </div> 
       <div class="form-group"> 
        <button type="submit" class="btn btn-success">Save</button> 
        <button type="reset" class="btn btn-warning">Cancel</button> 
       </div> 
      </form> 
     </div> 
     <div class="modal-footer"> 
      <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button> 
     </div> 
    </div> 
</div> 

<script> 
$("#yourform").submit(function (event) { 
    var form = $(this).closest('form'); 
    field1 = $(form).find('.field1').val(); 
    field2 = $(form).find('.field2').val(); 

    $.ajax({ 
     url: '<?php echo site_url('your/controller/url') ?>', 
     type: 'POST', 
     data: {field2: field2, field2: field2}, 

     success: function (result) { 
      //alert(result);return false; 
      if (result == 1) 
      { 
       location.reload(); 
      } else 
      { 
       $('#err').html(result); 
      } 

     } 
    }); 

    event.preventDefault(); 
}); 

<?php 

$this->form_validation->set_rules('course_name', 'Course Name', 'required|max_length[30]'); 
$this->form_validation->set_error_delimiters('<div class="text-danger">', '</div>'); 
if ($this->form_validation->run()) { 
echo "1"; 
} else { 
echo "<b>" . validation_errors() . "</b>"; 
} 
?> 

iは

0
を助けたホープあなたはこのようなあなたのビューのコードを変更することができます

それはあなた

あなたは、AJAX成功機能にlocation.reload(「ページ名」)機能を使用することができます

retain value in modal after reloading page

0

のために役立つだろう、このリンクをご確認ください。

関連する問題