0

jquery と CI 検証ライブラリを使用する登録フォームを作成したいと考えています。これどうやってするの？フォームを送信したら、jquery を使用してコントロールを検証ライブラリに移動し、応答を返すようにします。そして、問題がなければ、そのページ自体に「フォームが送信されました」というメッセージが表示されるようにします。

編集：

ここに私のコードがあります。

見る

<?php $this->load->view('template/header'); ?>
<div id="add_form">
    <h2>Add New Category</h2>

    <?php echo form_open('abc/abc_category_controller/add_new_category'); ?>

    <?php

    $category_data = array(
        'name' => 'category_name',
        'id' => 'category_name',
        'value' => set_value('category_name'),
        'maxlength'   => '15'
    );

    $unit_data = array(
        'name' => 'unit',
        'id' => 'unit',
        'value' => set_value('unit'),
        'maxlength'   => '10'
    );

    ?>

    <p><label for="name">Name: </label><?php echo form_input($category_data); ?></p>

    <p><label for="unit">Unit: </label><?php echo form_input($unit_data); ?></p>

    <p><?php echo form_submit('submit', 'Submit','id="submit"'); ?></p>

    <?php echo form_close(); ?>

    <?php echo validation_errors('<p class="error">'); ?>

</div><!--end add new category-form-->

<div id="success_msg">


</div>



<?php $this->load->view('template/footer') ?>

コントローラ - add_new_category

<?php

    class Stocks_category_controller extends CI_Controller{

    function add_new_category()
    {
        //$this->load->helper('form');
        $this->load->library('form_validation');

        $data['title'] = 'Add a new category';

        $this->form_validation->set_rules('category_name', 'Category Name', 'required');
        $this->form_validation->set_rules('unit', 'Unit', 'required');

        if ($this->form_validation->run() === FALSE)
        {
              $this->load->view('abc/add_new_category');


        }

        else
        {
            $category_name = $this->input->post('category_name');

            $unit = $this->input->post('unit');

            $this->load->model('abc/abc_category_model');

            $insert_id=$this->abc_category_model->add_new_category($category_name
                                ,$unit);


            if($insert_id!=NULL)
            {
              $this->load->view('template/success',$data);
            }

            else{
                $data['error_msg']='Error Occurred';
                $this->load->view('template/template',$data);
            }

        }

    }

    function success(){
        $data['success_msg']='New Category Successfully Created';
        $this->load->view('template/success',$data);
    }
  }

そして最後にモデル。

   function add_new_category($category_name,$unit){

      $data = array(
           'abc_category_name' => $category_name ,
           'unit' => $unit
        );

        $this->db->insert('abc_category', $data); 
        $insert_id=$this->db->insert_id();

        return $insert_id;
   }

}

私が欲しいのは、フォームを送信するときにjqueryの検証が行われることです。そして、すべてが順調であれば、ajaxのみを使用してSUccessfulメッセージが表示され、ページはリロードされません。また、jquery 検証と CI 検証ライブラリの両方を使用し、同時に ajax を維持することは可能ですか?

4

2 に答える 2

5

クライアント側とサーバー側の両方の検証を実装するには、jquery 検証プラグインを使用する必要があります。

したがって、以下を含める必要があります。

  1. jQuery JavaScript ライブラリ

  2. jQuery検証プラグイン

でJavaScriptをロードします

<script type="text/javascript" src="<?php echo base_url();?>js/jquery-1.6.1.min.js"></script>
<script type="text/javascript" src="<?php echo base_url();?>js/jquery.validate.js"></script>
<script type="text/javascript" src="<?php echo base_url();?>js/jquery.validate-rules.js"></script>

次に、フォームをセットアップします。

$attr = array('id' => 'demo_form');
echo form_open('demo/validation_example', $attributes);

次のようにフォームを検証します。

$(document).ready(function() {
  $("#demo_form").validate({
    rules: {
            name: {
                required: true
            },
            ...
    },
    messages: {
             name: {
                required: "Name required",
            },
    },
    errorElement: "span",
        errorPlacement: function(error, element) {
                error.appendTo(element.parent());
        }

  });
});

また、クライアント側の検証のみを使用することはお勧めできないため、サーバー側の検証も使用してください。

詳細については、次のチュートリアルを参照してください。

codeigniter を使用して jquery 検証を実装する方法

動作デモ

jquery の検証を確認できる場所で、ブラウザーの JavaScript を無効にすることで、php で行われた codeigniter サーバー側の検証を確認できます。

于 2012-06-16T07:00:23.633 に答える
1

これにはjqueryajaxを使用する必要があると思います。

まず、データを投稿する必要があります。このようにjqueryajaxを起動するように送信ボタンを設定します。

 $.ajax({
        type: "GET",
        url: "/controller/validate",  //your controller action handler
        dataType: "json",
        data: {name:value, name: value}, //set your post data here
        cache:false,
        success: function(data){
             //handle the callback response 
             if(data.success)
                alert("Success");
             else
                alert(data.errors);
       }
 });

次にコントローラーアクションで、codeigniterバリデーターを使用して投稿データを検証します。検証に失敗した場合は、ビューでjson_encodeを使用して、エラーをjsコールバック関数に送り返す必要があります。このようにデータエラーを設定します。ビュー（/ controller / validateに設定するビュー）で、次のようにします。

$data['errors'] = validation_errors();
echo json_encode($data);

ページを更新しなくても、エラーが返されます。検証が成功した場合は、aを設定し、 using ifステートメント$data['success']を使用echo json_encodeして、成功データのみが取得されるようにします。ajaxスクリプトコールバックを設定しました。

于 2012-06-16T15:15:34.287 に答える