CODEWITHSUNDEEP
phpjqueryhtmlformsjquery-validation-engine
i'llbdevsomeday
i'llbdevsomeday

Reputation: 151

Jquery Validation Engine not working in Chrome and Safari

I downloaded the Jquery Validation Engine from https://github.com/posabsolute/jQuery-Validation-Engine, it is working perfectly in IE and Firefox but it is not working on Chrome and Safari, the problem is that it does not matter if the fields are empty or invalid characters are entered, the form will always be submitted and since I'm using php to enter the data to a database obvioulsy the fields are entered as empty.

I am sure I included all needed scripts; have you read about any other member having issues with chrome and Safari using the plug in? I will really appreciate your help Pals.

Adding the code in edit (sorry friends):

  <!doctype html>
  <html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<link rel="stylesheet" href="css/validationEngine.jquery.css" type="text/css"/>
<link rel="stylesheet" href="css/template.css" type="text/css"/>
<link rel="stylesheet" href="css/styles.css" type="text/css"/>
<script src="js/jquery-1.8.2.min.js" type="text/javascript">
</script>
<script src="js/languages/jquery.validationEngine-en.js" type="text/javascript" charset="utf-8">
</script>
<script src="js/jquery.validationEngine.js" type="text/javascript" charset="utf-8">
</script>
<script>
    jQuery(document).ready(function(){
        // binds form submission and fields to the validation engine
        jQuery("#collect").validationEngine('attach');
    });
</script>
</head>

<body  onLoad="formReset()" onUnload="formReset()">
<script>
function formReset()
 {
 document.getElementById("collect").reset();
 }
</script>
<div class="formholder">
  <form id="collect" class="formular" method="post" action="insert.php">
<fieldset>
      <label>
    <input value="" data-prompt-position="topRight:0,20"  class="validate[required,custom[onlyLetterSp]] text-input" type="text" name="nombre"  />
  </label>
      <br/>
      <label>
    <input value=""  class="validate[required,custom[email]] text-input" data-prompt-position="topRight:0,20"  type="text" name="email"  />
  </label>
      <br/>
      <label>
    <input value="" data-prompt-position="topRight:0,20"   class="validate[required,custom[phone]] text-input" type="text" name="telefono"  />
  </label>
      <br/>
      <label>
    <select style="height:35px; width:200px;" name="informacion" class="select"  form="contact-form" type= "select">
          <option value="option1">option1</option>
          <option value="option2">option2</option>
          <option value="option3">option3</option>
          <option value="option4">option4</option>
          <option value="option5">option5</option>
        </select>
   </label>
      <input  class="submit" type="submit" value= ""/>
    </fieldset>
    <hr/>
 </form>
   </div>
   </body>
   </html>

Upvotes: 1

Views: 3593

Answers (1)

Haseeb
Haseeb

Reputation: 2234

see this code

It is working now ... 

 <!doctype html>
  <html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
    <link rel="stylesheet" href="css/validationEngine.jquery.css" type="text/css" />
    <script src="js/jquery-1.8.2.min.js" type="text/javascript"></script>
    <script src="js/jquery.validationEngine-en.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/jquery.validationEngine.js" type="text/javascript" charset="utf-8"></script>
<script>
        jQuery(document).ready(function(){
            // binds form submission and fields to the validation engine
            jQuery("#collect").validationEngine('attach');
    });
</script>
</head>

<body  onLoad="formReset()" onUnload="formReset()">
<script>
function formReset()
 {
 document.getElementById("collect").reset();
 }
</script>
<div class="formholder">
  <form id="collect" class="formular" method="post" action="insert.php">
<fieldset>
      <label>
    <input value="" data-prompt-position="topRight:0,20"  class="validate[required] text-input" type="text" name="nombre"  />
  </label>
      <br/>
      <label>
    <input value=""  class="validate[required] text-input" data-prompt-position="topRight:0,20"  type="text" name="email"  />
  </label>
      <br/>
      <label>
    <input value="" data-prompt-position="topRight:0,20"   class="validate[required] text-input" type="text" name="telefono"  />
  </label>
      <br/>
      <label>
    <select style="height:35px; width:200px;" name="informacion" class="select"  form="contact-form" type= "select">
          <option value="option1">option1</option>
          <option value="option2">option2</option>
          <option value="option3">option3</option>
          <option value="option4">option4</option>
          <option value="option5">option5</option>
        </select>
   </label>
      <input  class="submit" type="submit" value= "test"/>
    </fieldset>
    <hr/>
 </form>
   </div>
   </body>
   </html>

Upvotes: 1

Related Questions