Question

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

我想验证条件，如果值Value 1大于Value 2中的值，则应显示错误提示，并且表单应 NOT 提交。

这是代码

$(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 是小提琴

代码工作并显示错误提示，但表单提交。

有没有办法告诉验证引擎不仅显示错误提示而是验证条件，并且在条件满足之前不要让表单提交？

Answer 1

是。它可以完成..您不必为此功能使用类似的验证引擎..

我在您的下拉列表中使用了onSubmit事件形式和required属性。

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

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验证引擎中指定自定义无效条件？

1 个答案: