Skip to main content
error in code post
Source Link
$(document).ready(function () {

    // foo ...

    $('#FormCreate').validate({
        rules: {
            thisval: "required"
        }
    });
    
    
    $("#BtnCreate").on("click", function () {
        
        if (!$("#FormActAuditoria""#FormCreate").valid()) {  //<=== Error Here...
            console.log("error");
        }
        
    });
    
});
$(document).ready(function () {

    // foo ...

    $('#FormCreate').validate({
        rules: {
            thisval: "required"
        }
    });
    
    
    $("#BtnCreate").on("click", function () {
        
        if (!$("#FormActAuditoria").valid()) {  <=== Error Here...
            console.log("error");
        }
        
    });
    
});
$(document).ready(function () {

    // foo ...

    $('#FormCreate').validate({
        rules: {
            thisval: "required"
        }
    });
    
    
    $("#BtnCreate").on("click", function () {
        
        if (!$("#FormCreate").valid()) {  //<=== Error Here...
            console.log("error");
        }
        
    });
    
});
Source Link

Jquery Validation Plugin Error This[0] is undefined - Sharepoint Online Add-in Development

I'm development a Sharepoint Hosted Add-in in Sharepoint Online tenant. I'm using Jquery and Jquery Validation to make form validation, but I have a issue with JQuery Validation because of get error this[0] is undefined always in button Event.

I checked:

  • Reference valid ID in form.
  • Load Jquery and Jquery Validation scripts inside page.
  • Verified in Browser Debugger that scripts load with status 200.
  • Wrap script in a ready event handler [Jquery].

I'm new in Sharepoint development and I don't know if I need enabled something in tenant, site collection or this is a limitation to Sharepoint online ?

This is my currently code in Page.aspx:

Section to load Scripts

 <asp:Content ContentPlaceHolderID="PlaceHolderAdditionalPageHead" runat="server">:

    <meta name="WebPartPageExpansion" content="full" />

    <!-- Css Files -->
    <link rel="stylesheet" type="text/css" href="../../Content/AdminLte/bower_components/bootstrap/dist/css/bootstrap.min.css" />
    <link rel="stylesheet" type="text/css" href="../../Content/AdminLte/bower_components/font-awesome/css/font-awesome.min.css" />
    <link rel="stylesheet" type="text/css" href="../../Content/AdminLte/dist/css/AdminLTE.min.css" />
    <link rel="stylesheet" type="text/css" href="../../Content/AdminLte/dist/css/skins/_all-skins.min.css" />

    <!-- Javascript Files -->

    <SharePoint:ScriptLink Name="sp.js" runat="server" OnDemand="true" LoadAfterUI="true" Localizable="false" />

    <script type="text/javascript" src="../../Scripts/jquery-3.3.1.min.js"></script>
    <script src="../../Scripts/Plugins/jquery-validation/jquery.validate.js"></script>
    <script src="../../Scripts/Plugins/jquery-validation/messages_es.js"></script>

    <!-- Others Javascript Files -->
    
    <script src="../../Scripts/LibreriasSP/sharepointplus-5.2.js"></script>
    <script src="../../Scripts/Plugins/SweetAlert2/sweetalert.min.js"></script>

    <script src="../../Scripts/Modulos/Audits/create.js"></script>

</asp:Content>

Html Section:

<asp:Content ContentPlaceHolderID="PlaceHolderMain" runat="server">

    <WebPartPages:WebPartZone runat="server" FrameType="TitleBarOnly" ID="full" Title="loc:full" />
    
    <form id="FormCreate" name="FormCreate">
        <div class="box-body">
            <div class="col-sm-12">
                <div class="form-group col-sm-4">
                    <label for="titulo">Title (*)</label>
                    <input type="text" class="form-control" name="Title" id="Title" required>
                </div>

                <div class="form-group col-sm-4">
                    <label for="codigo">Smart Code (*)</label>
                    <input type="text" class="form-control" name="smartCode" id="smartCode" required>
                </div>
            </div>
        </div>
        
         <div class="box-footer">
            <button type="button" class="btn btn-primary" id="BtnCreate">Create</button>
        </div>
        
    </form>

</asp:Content>

create.js

$(document).ready(function () {

    // foo ...

    $('#FormCreate').validate({
        rules: {
            thisval: "required"
        }
    });
    
    
    $("#BtnCreate").on("click", function () {
        
        if (!$("#FormActAuditoria").valid()) {  <=== Error Here...
            console.log("error");
        }
        
    });
    
});