如何使用jquery

时间:2015-12-24 07:15:08

标签: javascript jquery html css jquery-validate

我在搜索过的时候发现了很多例子,但是我的情况与众不同。

1)如果用户点击“保存和放大”,我最初会有一行下一个按钮会说你缺少3个字段

2)如果用户点击了addmore按钮并且他没有在文本字段中键入任何值,那么他点击保存和下一个按钮它应该仍然说3个字段丢失

3)如果用户键入克隆行中的任何一个字段,那么他单击保存和下一个按钮验证应该发生我的代码前两点正在工作

但问题是如果用户点击了更多的行并且他在任何一个克隆字段中键入,那么如果他点击安全和下一个按钮required_Field类正在所有其他字段中应用但它应该仅适用到那一行:(

如果我们能够找到用户类型的字段中最接近的元素,那么我只能将required_Field类添加到这些元素

我试过以下

        function additionalvalidation() {
          var myRow = $(".check").length;

          //$(".cloned_field").css("border","1px solid green");
          $(".cloned_field").change(function() {
                var myField = $(".cloned_field").val().length;
            if (myField >= 0) {
              $(".cloned_field").addClass("required_Field");
              debugger;
              $(".cloned_field").prevAll('label').find('span.required-star').removeClass('text-error-red');
              //bind_validation();
            } else {
              $(this).closest(".cloned_field").removeClass("errRed");
              $(".cloned_field").removeClass("text-error-red");
            }
            bind_validation();
            return false;
          });
        }

使用我当前的代码,我收到错误。

未捕获的TypeError:无法读取属性'长度'未定义的

$(this).closest(".cloned_field").addClass("required_Field");

我也尝试了这个

$(this).closest(".cloned-row1").addClass("required_Field");

对此问题的任何建议

我尝试了这个新的 - >

$(this).closest(".cloned_field").css({"color": "red", "border": "2px solid red"});

红色和红色边框的颜色仅适用于该行不适用于该行:(

Fiddle link参考

3 个答案:

答案 0 :(得分:3)

@mahadevan试试这段代码。我在工作

        function additionalvalidation() {
          var myRow = $(".check").length;

          //$(".cloned_field").css("border","1px solid green");
          $(document).on("change",".cloned_field",function() {
          var myField = $(this).val();
          var $clonedDiv  = $(this).closest('.cloned_div');

            if (myField!='') {     
                $clonedDiv.find(".cloned_field").addClass("required_Field");
                $clonedDiv.find(".deg_date").addClass("required_Field");
                $clonedDiv.find(".trans_date").addClass("required_Field");
                $clonedDiv.find(".txt_degreName").addClass("required_Field");


              debugger;
              $(".cloned_field").prevAll('label').find('span.required-star').removeClass('text-error-red');
              //bind_validation();
            } else {
                $clonedDiv.find(".cloned_field").removeClass("errRed");
                $clonedDiv.find(".deg_date").removeClass("errRed");
                $clonedDiv.find(".trans_date").removeClass("errRed");
                $clonedDiv.find(".txt_degreName").removeClass("errRed");

                //$(".cloned_field").removeClass("text-error-red");
            }
            bind_validation();
            return false;
          });
        }

答案 1 :(得分:0)

Jquery接下来可能是你的答案

  

描述:获取匹配元素集中每个元素的紧随其后的兄弟。如果提供了选择器,则仅当它与该选择器匹配时,它才会检索下一个兄弟。

https://api.jquery.com/next/

答案 2 :(得分:-1)

您在父树中显示最近搜索并找到最近的搜索。如果你想在兄弟姐妹中搜索,你应该在兄弟姐妹身上执行find。