如何在jQuery验证引擎中指定自定义无效条件? [英] How to specify custom invalid condition in jquery validation engine?

问题描述

我有两个选择框，每个选择框都有一些值

I have two select boxes each with some values

我想验证以下条件:如果值1大于值2中的值，则应显示错误提示，并且表单应不提交.

I want to validate for condition that, if value Value 1 is greater than value in Value 2 then the error prompt should show and the form should NOT submit.

这是代码

$(document).ready(function(){
    $("#formid1").validationEngine('attach');
});

function testfunc(value1id, value2id)
{
    var val1 = $('#'+value1id+'').val();
  var val2 = $('#'+value2id+'').val();
    if(val1 !== '' && val2 !== '')
  {
    if(parseFloat(val1) > parseFloat(val2))
    {
        $('#'+value2id+'').validationEngine('showPrompt', 'Value 1 should be smaller than Value 2', 'error', true);
    }
  }
}

这里 是小提琴

Here is the fiddle

代码可以正常工作并显示错误提示，但表单已提交.

The code works and displays the error prompt but the form submits.

有什么方法可以告诉验证引擎不仅显示错误提示，还可以验证条件，并且在满足条件之前不让表单提交?

Is there any way to tell validation engine to not just display the error prompt but to validate the condition and don't let the form submit until the condition is satisfied?

推荐答案

是.可以完成..您不必为此功能使用验证引擎.

Yes. It can be done.. You don't have to use validation engine like that for this functionality..

我只是在下拉菜单中使用了表单的onSubmit事件和required属性.

I have simply used onSubmit event of form and required attribute in your dropdown.

检查此代码段.我在这里修改了小提琴的代码.

Check this snippet. I have modified the code of your fiddle in here..

function testfunc() {
  var val1 = $('#value1select').val();
  var val2 = $('#value2select').val();
  if (val1 !== '' && val2 !== '') {
    if (parseFloat(val1) > parseFloat(val2)) {
      return true;
    } else {
      alert("ERROR PROMPT!")
      return false;
    }
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action='' name="formid1" id="formid1" onSubmit="return testfunc()">
  <br />
  <br />
  <div>
    <table>
      <tr>
        <td>Value 1</td>
        <td>
          <select id="value1select" required >
            <option value="">---Select---</option>
            <option value="-1">-1</option>
            <option value="-2">-2</option>
            <option value="-3">-3</option>
            <option value="-4">-4</option>
            <option value="-5">-5</option>
            <option value="-190">-190</option>
          </select>
        </td>
      </tr>
      <tr>
        <td>Value 2</td>
        <td>
          <select id="value2select" required>
            <option value="">---Select---</option>
            <option value="0">0</option>
            <option value="-1">-1</option>
            <option value="-2">-2</option>
            <option value="-3">-3</option>
            <option value="-4">-4</option>
            <option value="-5">-5</option>
          </select>
        </td>
      </tr>
      <tr>
        <td>
          <input type="submit" value="Submit" />
        </td>
      </tr>
    </table>

  </div>

</form>

这篇关于如何在jQuery验证引擎中指定自定义无效条件?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！