微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

根据下拉选择更改文本框上的 RegEx 验证

如何解决根据下拉选择更改文本框上的 RegEx 验证

我有一个根据下拉列表的选择替换验证方法的工作示例。

我遇到的问题是在 JQueryValidation 中使用正则表达式,输入有效的 Twitter 地址总是返回无效地址错误

以下函数页面加载时运行,我设置了认验证,然后在下拉列表更改时添加新验证。

jsfiddle - here

ValidationDefaults();

//Setup all .Select2
$(".select2").select2({
  theme: 'bootstrap4',placeholder: '- Search -',});

$('#SocialMediaNetworkId').on('select2:select',function(e) {
  var data = e.params.data;
  AccountNameLabel(data.id);
});

$('#btnSubmit').on('click',function(e) {

  if ($("form").valid()) {
    /* $('#Edit').submit();*/
  }
});

function AccountNameLabel(SocialMediaNetworkId) {
  $("#Edit").data('validator').resetForm();
  switch (parseInt(SocialMediaNetworkId)) {
    case 1:
      $("label[for='SocialMediaAccountName']").text("FaceBook Url");
      $("#SocialMediaAccountName").attr("placeholder","FaceBook Url - Ex. https://www.FaceBook.com/joeblow");
      FaceBookValidation();
      break;
    case 2:
      $("label[for='SocialMediaAccountName']").text("YouTube Url");
      $("#SocialMediaAccountName").attr("placeholder","YouTube Url - Ex. https://www.YouTube.com/joeblow");
      YouTubeValidation();
      break;
    case 3:
      $("label[for='SocialMediaAccountName']").html("Twitter Url");
      $("#SocialMediaAccountName").attr("placeholder","Twitter Url - Ex. https://www.twitter.com/joeblow");
      TwitterValidation();
      break;
    case 4:
      $("label[for='SocialMediaAccountName']").text("Instagram Url");
      $("#SocialMediaAccountName").attr("placeholder","Instagram Url - Ex. https://www.Instagram.com/joeblow");
      InstagramValidation();
      break;
  }
}

function ValidationDefaults() {

  $('#Edit').validate({
    rules: {
      SocialMediaNetworkId: {
        required: true
      }
    },messages: {
      SocialMediaNetworkId: "* required Field"
    },errorElement: 'span',errorPlacement: function(error,element) {
      error.addClass('invalid-Feedback');
      element.closest('.form-group').append(error);
    },highlight: function(element,errorClass,validClass) {
      $(element).addClass('is-invalid');
    },unhighlight: function(element,validClass) {
      $(element).removeClass('is-invalid');
    }
  });

}

function TwitterValidation() {

var settings = $('#Edit').validate().settings;

$("#SocialMediaAccountName").rules("remove");
$("#SocialMediaAccountName").rules("add",{
        required: true,pattern: "/http(?:s)?:\/\/(?:www\.)?twitter\.com\/([a-zA-Z0-9_]+)/",messages: {
            required: "required input",pattern: "* Must be a valid Twitter URL - Ex. https://www.twitter.com/joeblow"
        }
    }
);
//$("#SocialMediaAccountName").rules("add",{
//    required: true,//    pattern: {
//        required: "/http(?:s)?:\/\/(?:www\.)?twitter\.com\/([a-zA-Z0-9_]+)/"
//    },//    messages: {
//        required: "required input",//        pattern: "* Must be a valid Twitter URL - Ex. https://www.twitter.com/joeblow"
//    }
//});

//// Modify validation settings
//$.extend(true,settings,{
//    rules: {
//        // Add validation
//        "SocialMediaAccountName": {
//            required: true,//            pattern: "/http(?:s)?:\/\/(?:www\.)?twitter\.com\/([a-zA-Z0-9_]+)/"
//        }
//    }
//});
//$.extend(jQuery.validator.messages,{
//    required: "* required Field.",//    pattern: "* Must be a valid Twitter URL - Ex. https://www.twitter.com/joeblow"
//});

}

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。