2017-03-21 15 views
0

私は、CodeIgniterプロジェクトの観点から、インターネットの例のように、jQuery Validate pluginを使用しようとしていますが、まったく動作しません。 StackOverflowや他のサイトで見つけたたくさんのsugerencesを使用しましたが、うまくいきません。このjQuery ValidatorプラグインがCodeIgniterで動作しない

<form id="https://cdn.jsdelivr.net/jquery.validation/1.15.1/jquery.validate.min.js"> 

<form id="formIngEmpresa"> 

を置けば

<script src="<?php echo base_url(); ?>js/jquery-validation-1.16.0/dist/jquery.validate.js"></script> 
<body> 
<section class="content"> 
     <div class="row"> 
     <!-- left column --> 
     <div class="col-md-6"> 

      <!-- general form elements --> 
      <div class="box box-primary"> 
      <div class="box-header with-border"> 
       <h3 class="box-title">Ingresar nueva empresa</h3> 
      </div> 
      <!-- /.box-header --> 
      <!-- form start --> 
      <form id="formIngEmpresa"> 

       <!-- RESPUESTA DE FORMULARIO --> 

       <!-- FIN RESPUESTA DE FORMULARIO --> 

       <div class="box-body"> 
       <div class="form-group"> 
        <label for="usuario_login">Nombre o Razón Social de la empresa</label> 
        <input type="input" class="form-control" id="nm_rs_empresa" placeholder="Ingrese login"> 
       </div> 
       <div class="form-group"> 
        <label for="usuario_password">Rut empresa</label> 
        <input type="input" class="form-control" id="nr_rut_empresa" placeholder="rut"> 
       </div> 
       <div class="form-group"> 
        <label for="usuario_password2">Descripcion empresa</label> 
        <input type="text" class="form-control" id="nm_desc_empresa" placeholder="Password"> 
       </div> 
       <div class="form-group"> 
        <label for="usuario_nm_usuario">Rubro de la empresa</label> 
        <input type="input" class="form-control" id="nm_rubro" placeholder="Ingrese nombres"> 
       </div> 

       </div> 
       </div> 
       <!-- /.box-body --> 

       <div class="box-footer"> 
       <button type="submit" class="btn btn-primary">Ingresar</button> 
       <button type="reset" class="btn btn-default">Cancelar</button> 

       </div> 
      </form> 
      </div> 
      <!-- /.box --> 

     </div> 
     <!-- /.row --> 
    </section> 
    </body> 
<script> 



$(function() { 
    // Initialize form validation on the registration form. 
    // It has the name attribute "registration" 
    alert($("#formIngEmpresa").validate().form()); 
    $("#formIngEmpresa").validate({ 
    // Specify validation rules 
    rules: { 
     // The key name on the left side is the name attribute 
     // of an input field. Validation rules are defined 
     // on the right side 
     nm_rs_empresa: "required", 
     nr_rut_empres: "required", 
     nm_desc_empresa: "required", 
     nm_rubro: "required" 

    }, 
    // Specify validation error messages 
    messages: { 
     nm_rs_empresa: "Porfavor introducir nombre empresa", 
     nr_rut_empres: "Por favor introducir rut", 
     nm_desc_empresa: "Por favor introducir una Descripcion", 
     nm_rubro: "Elija el rubro de la empreesa", 

    }, 
    // Make sure the form is submitted to the destination defined 
    // in the "action" attribute of the form when valid 
    submitHandler: function(form) { 
     form.submit(); 
    } 
    }); 
    $("#submit").click(function(){ 
      $("#formIngEmpresa").submit(); 
      return false; 
    }); 
}); 
    </script> 
+0

エラーメッセージしてください – pinoyCoder

+0

があれば、あなたのコンソールとポストエラーメッセージを確認してください。 – webDev

+0

コンソールにメッセージが表示されない –

答えて

0

jQueryの検証プラグインはCodeIgniterの

右では動作しません、それはしていません。 jQueryはJavaScriptであり、ブラウザでのみ動作しますが、CodeIgniterはサーバ上でのみ動作します。言い換えれば、適切なHTMLマークアップをブラウザに送信する限り、JavaScriptはフレームワークとは関係ありません。あなたは困難を抱えている理由はここに

だ...

  1. あなた必見検証のためにと考え、すべての入力にname属性を持っており、これらの名前は正確にあなたがあなたのルールを宣言したときに使用した名前と一致する必要があります。あなたのコードのコメントでも同じことが言えます!

    rules: { 
        // The key name on the left side is the name attribute <-- READ HERE!! 
        // of an input field. Validation rules are defined 
        // on the right side 
        nm_rs_empresa: "required", // <- 'nm_rs_empresa' must match the 'name' attribute 
        .... 
    
  2. clickハンドラは、プラグインをバイパスすることができます。 jQuery Validateはsubmitボタンのclickイベントを自動的にキャプチャし、完全に処理を行いますので、追加のイベントハンドラは絶対に必要ありません。この全体のclickハンドラを削除してください...必要ありません。

    $("#submit").click(function() {  // REMOVE THIS 
        $("#formIngEmpresa").submit(); // REMOVE THIS 
        return false;     // REMOVE THIS 
    });         // REMOVE THIS 
    

ワーキングDEMO:jsfiddle.net/wtdhvtc7/

+0

これは私の問題を解決しました。ありがとうございました! –

0

まずこれはあなたの最初の間違い、フォームの必須のIDで
代わりに、フォームのIDを更新:ここに私のコードです$("#formIngEmpres").validate()と一致します。ここで、formIngEmpresはフォームのIDです。

+0

私はIDを変更しますが、同じ問題が発生します –

+0

その他の問題が発生している可能性があります。ブラウザのコンソールからエラーメッセージを投稿してください。 – webDev

関連する問題