1

我有一个使用文本框收集一些信息的表单。一些文本框有一个严格的模式，例如很少有输入框只接受数字。

我能够使用输入字段的模式属性添加验证。http://www.w3schools.com/tags/att_input_pattern.asp

但是，当用户提交表单时，我需要向不同的端点发出 ajax 发布请求。所以，我想我必须调用 preventDefault() 方法来防止默认表单提交。

但是当我调用 preventDefault() 时，它也会禁用验证输入字段。

仅当输入字段通过验证时，如何实现验证字段并发出 ajax 请求。

4

2 回答 2

0

您可以使用以下任何一种方式：

首先将其更改input[type="submit"]为：

<button onclick="submitThis()">Save</button>

function submitThis() { 
  var firstInput = $("#idoffirstinput).val(); // basic validation
  if(firstInput == "correctinput") {
     $.ajax({
       // send the ajax form
     })
  }
}

您可以使用那里提供的技术或我提供的技术单独验证每个输入。jQuery 错误将是相同的；我的意思是验证。

用这个：

if(firstInput == "correctinput") {
  // ajax form
} else {
  // show the error popup!
}

这个的优点是您也可以设置错误对话框弹出窗口的样式。喜欢

$("#errordiv").css("border", "1px solid #hexcode");

其他一切都一样！

于 2013-09-14T06:10:43.843 回答
0 
HTML and jQuery:
<form id="details">
    Phone no: <input type="text" id="phone_no" pattern="[A-Za-z]{3}">
    <input type="submit" id="submit">
</form>

var input   = $('#phone_no').val();
if(input != '')
{
    var YOUR_URL = 'www.example.com';
    var formData = $('#details').serialize();// If you want to pass that data to that   URL
    $.post(YOUR_URL,formData,function(result){

    });
}
else
{
    return false;
}
于 2013-09-14T10:24:40.597 回答