輸入類型下的表單驗證中的錯誤消息

Question

我在學校有一個項目，我是codeigniter框架的初學者。現在我在codeigniter中使用表單驗證庫。我怎麼能這樣做:(輸入類型在我的形式）輸入類型和以下是它來自codeigniter表單驗證的錯誤消息。現在這裏是我的代碼，它重複所有的錯誤信息，並將發佈每個輸入類型。

例如，如果我將Middle Name和First Name輸入類型留爲空白，我的代碼將在輸入類型下面輸入每個輸入類型的錯誤消息。

這裏是我的代碼： VIEW：

<div class="modal fade large" id="admin_create_acct" role="dialog"> 
    <div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header btn-success"> 
       <button type="button" class="close" data-dismiss="modal">&times;</button> 
       <h3 class="modal-title">Create Account</h3> 
      </div> 
      <div class="modal-body"> 
       <form class="form-horizontal" id="frm_create_user"> 
       <div class="form-group"> 
        <label for="userFName" class="control-label col-sm-4">First Name:</label> 
        <div class="col-sm-6"> 
        <input type="text" class="form-control" name="userFName" id="userFName" placeholder="First name"> 
        <div class="msg"></div><!-- form-group --> 
        </div><!-- col-sm-6 --> 
       </div><!-- form-group --> 
       <div class="form-group"> 
        <label for="userMName" class="control-label col-sm-4">Middle Name:</label> 
        <div class="col-sm-6"> 
        <input type="text" class="form-control" name="userMName" id="userMName" placeholder="Middle name"> 
        <div class="msg"></div><!-- form-group --> 
        </div><!-- col-sm-6 --> 
       </div><!-- form-group --> 
      </form><!-- form-horizontal --> 
      </div><!-- modal-body --> 
      <div class="modal-footer"> 
       <button type="button" id="btn_reg" onclick="create_User()" class="btn btn-primary">Create Account</button> 

這裏是我的控制器，其中i設置每個輸入類型的規則：

public function reg_user(){ 

     $this->form_validation->set_rules('userFName', 'userFName', 'trim|required', 
     array('required' => 'Error Message on First name ') 
     ); 

     $this->form_validation->set_rules('userMName', 'userMName', 'trim|required', 
     array('required' => 'Error Message on Middle Name') 
     ); 

     if ($this->form_validation->run() == FALSE) { 
      $result['type'] = 'error'; 
      $result['message'] = validation_errors(); 
     }else { 
      $result['type'] = 'success'; 
      $result['message'] = 'Whooos..! Your Succes Message'; 
     } 

     echo json_encode($result); 
} 

我的Ajax代碼：

function create_User() { 
    $.ajax({ 
     url: siteurl+"admin_controls/reg_user", 
     type: "POST", 
     data: $("#frm_create_user").serialize(), 
     dataType: "JSON", 
     success: function(data) { 
      if (data.type == "error") { 
         $('.msg').html(data.message); 
        }else{ 
         // You can Sow this or Alert this 
         $('.msg').html(data.message); 

         alert('succcess fullyInserted') 
        } 

        $("#frm_create_user")[0].reset(); 
     } 
    }); 
} 

這裏會發生什麼：

Answer 1

以下CI手冊我建議如下。

您需要單獨顯示每個錯誤信息，這就是爲什麼在$result['message']你需要像一些結構：

$result['message'] = [ 
    // fieldName => error text 
    'userFName' => 'error text', 
    'userMName' => 'another error text', 
]; 

我想用form_error功能。所以，你需要檢查每一個領域，如果有錯誤：

if ($this->form_validation->run() == FALSE) { 
    $result['type'] = 'error'; 

    // init message with empty array 
    $result['message'] = []; 

    if (!empty(form_error('userFName'))) { 
     $result['message']['userFName'] = form_error('userFName'); 
    } 

    if (!empty(form_error('userMName'))) { 
     $result['message']['userMName'] = form_error('userMName'); 
    } 
    // sure you can simplify this somehow 
} else { 
    $result['type'] = 'success'; 
    $result['message'] = 'Whooos..! Your Succes Message'; 
} 

接下來我們檢查客戶端上響應：

if (data.type == "error") { 
    // here we iterate over `data.message` 
    $.each(data.message, function(key, value) { 
     // just for test 
     console.log(key, value); 

     // now we need to find element where to put error text 
     // according to your current markup - 
     // error field is next to input with a certain id: 
     $("#" + key).next().text(value); 
     // As we have `key` as `userFName` then 
     // input with id `userFName` will be found 
     // and error text will be put into a div next to it 
    }); 
} else { /* do other stuff */ } 

當然，可以有其他的方式，我發現這一個。