Question

我正在尝试使用jQuery验证电子邮件的可用性，然后显示电子邮件的可用性消息。

消息显示成功，但表单也在提交。我只想如果我收到电子邮件可用性消息，那么该表格不应该提交。我该怎么办？

public function check_emailp()
{
  $email = $_POST['emailid'];
  $record['data']=$this->Home->check_emailsd($email);
  if ($record['data']=="taken")
  {
    echo "<span style='color:red'> Email already exit .</span>";
  }
  else
  {
    echo "<span style='color:green'> Email Availiable.</span>";
  }
}

function checkemailAvailability() {
  $("#loaderIcon").show();
  var url = '<?php echo base_url(); ?>';
  jQuery.ajax({
    url: url + 'index.php/register/check_emailp',
    data: 'emailid=' + $("#email").val(),
    type: "POST",
    success: function(data) {
      alert(data);
      $("#email-availability-status").html(data);
      $("#loaderIcon").hide();
    },
    error: function (){}
  });
}

  <form name="myForm"  id ="myForm" action="<?php echo site_url('register/update_info'); ?>" method="POST" enctype="multipart/form-data">
        <input type="text" name="email" id="email"  placeholder="Enter a Location" class="form-control" onBlur="checkemailAvailability()">
      </div>
      <?php //echo form_error('userName'); ?>
      <span id="email-availability-status"></span>
    </div>
    <button type="submit" name="submit" class=" form-control btn btn-info btn-lg hoj-blue-light login-reg-btn bold post-a-job-btn">Sign Up</button>
  </form>
</div>

Answer 1

您可以通过两种方式实现此目标，

提交时检查电子邮件可用性

通过在form submit而非input onBlur时检查电子邮件。

<form onSubmit='return checkemailAvailability()'>

您的JS应该像

function checkemailAvailability() {

 // your implementiations
 // let's say the variable exist is the status

  if (exist) {
     return false;
  } else {
     return true;
  }

}

设置变量，然后在提交时检查

您的表格

<form onSubmit='return checkForm()'>

您的js

var emailExist = false;


    function checkemailAvailability() {

     // your implementiations
     // let's say the variable exist is the status

      if (exist) {
         emailExist = true;
      }

    }

   function checkForm() {

     return emailExist;

   }

Answer 2

1。使用onClick="checkemailAvailability()"代替onBlur="checkemailAvailability()"

2。用php检查ajax错误的最佳方法：

$temp_array = array(); //Create temp array to store messages
//if error code will be here
$temp_array['error'] = "You error comment";

//if success code will be here
$temp_array['success'] = "You success comment";

echo json_encode($temp_array);

3.in jquery成功：

success: function(data) {
      //Parse json data
      var obj = JSON.parse(data);
      if(obj.error)
      {
        //Show error message code will be here
        e.preventdefault();
        return false;
      }
      else
      {
        //show success message code will be here
      }
},

Answer 3

尝试此代码

public function check_emailp() { $email = $_POST['emailid']; $record['data']=$this->Home->check_emailsd($email);

if ($record['data']=="taken") { echo 0; } else { echo 1; } }

function checkemailAvailability() { $("#loaderIcon").show(); var url = '<?php echo base_url(); ?>'; jQuery.ajax({ url: url + 'index.php/register/check_emailp', data: 'emailid=' + $("#email").val(), type: "POST", success: function(data) {

//alert(data); if(data==0) { var msg='<span style='color:red'> Email already exit .</span>'; } else { var msg='<span style='color:green'> Email Availiable.</span>'; } $("#email-availability-status").html(msg); $("#loaderIcon").hide(); }, error: function (){}

}); }

表单已提交甚至电子邮件已显示Jquery的消息

3 个答案:

尝试此代码