Question

到目前为止，我遇到了最奇怪的情况。我有一个有两个文本框的表单。我还有属于三个不同类的按钮，如.addTopTenFav，.addCurrentFav，.addOther。我已经将验证逻辑和属性添加到我的实体模型中，并且它按照我的两个按钮的预期工作。那就是当我点击一个特定的按钮时，我会做类似myform.validate（）的事情.Form（）;然后我检查是否（$（“＃myform”）。valid（））所以在我的两个poartial视图中，表单已经过验证，没有出现错误消息，这一切都很好。但是出于某些奇怪的原因，当我点击.addOtherSong按钮时，检查我的表单是否有效的if语句将转到我放置一个简单警告框的else部分。没有出现错误消息，我仔细检查我在文本框中键入的内容......当然......单击其他按钮时表单无效，表单有效。

但还有更多，所以我尝试调试这个，在谷歌的Chrome浏览器中我使用控制台，我键入类似$（“＃myform”）。validate（）。element（“＃myselect”）;逐个检查每个文本框，并且它们都返回true，这意味着我的输入已经过验证并通过了测试，但是当我运行应用程序并单击我的添加按钮时，表单不是有效的，有什么问题？

 $(function () {

    $(document).on("click", ".btnAddSongTilesToGenre", function (e) {
        var name = $('#youTubeNameTxt').val();
        var link = $('#youTubeLinkTxt').val();
        var len = link.length;
        var substr = link.substr(31, len - 31);
        var container = $(this).parent().parent().find(".actualTilesContainer");
        $(container).slideDown();
        var genreId = $(this).attr("name");
        $("#hiddenRank").val(genreId);

        $("#AddTopTenFavForm").validate().form();

        if ($("#AddTopTenFavForm").valid()) {
            $.ajax({
                beforeSend: function () { ShowAjaxLoader(); },
                url: "/Home/AddSong",
                type: "POST",
                data: $("#AddTopTenFavForm").serialize(),
                success: function (data) { HideAjaxLoader(), ShowMsg("Song Added Successfully"), $(container).find('ul').append('<li><a class="savedLinks" href="#" name="' + substr + '" >' + name + '</a> <span name= ' + data + ' class="btnDeleteSong dontDoAnything">x</span></li>'); },
                error: function () { HideAjaxLoader(), ShowMsg("Song could not be added, please try again") }
            });
            $('#youTubeLinkTxt').val('');
            $('#youTubeNameTxt').val('');

        }
        else {
            alert("notValid");
        }

        if ($(e.target).hasClass("dontDoAnything")) {
            e.stopPropagation();
            return false;
        }
    });

    $("#otherFavContainer").on("click", ".songTilesGenreContainer", function (e) {
        var myVar = $(this).find(".actualTilesContainer");

        if ($(myVar).hasClass("minimalized")) {
            $(myVar).removeClass("minimalized").addClass("maximized").slideDown();
        }
        else {
            $(myVar).removeClass("maximized").addClass("minimalized").slideUp();
        }

    });

我的验证属性

namespace yplaylist.Models
{
  [MetadataType(typeof(TopTenFav_Validation))]
  public partial class TopTenFav
  {
  }

  public class TopTenFav_Validation
  {
    [RegularExpression("http://www.youtube.com/watch\\?v=.*", ErrorMessage = "Youtube Link must begin with: http://www.youtube.com/watch?v= ")]
    [Required(ErrorMessage = "Youtube link is Required")]
    [StringLength(100, ErrorMessage = "Song Title cannot exceed 100 characters")]
    public string YoutubeLink { get; set; }

    [StringLength(100, ErrorMessage = "Youtube link cannot exceed 100 characters")]
    [Required(ErrorMessage = "Song title is Required")]
    public string Title { get; set; }
  }
}

我的jquery验证有什么问题？

0 个答案: