将jQuery验证应用于SharePoint可视化web部件

Applying jQuery validation to a SharePoint visual webpart

本文关键字:可视化 web 部件 SharePoint 应用于 jQuery 验证      更新时间:2023-09-26

我有一个SharePoint可视化web部件,我试图在页面中使用"HTML"元素。

<script src="../_layouts/15/CreateInitiativesCSOM/jquery-1.10.2.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script>
<script type="text/javascript" src="../_layouts/15/SP.js"></script>
<script type="text/javascript" src="../_layouts/15/sp.runtime.js"></script>
<script src="../_layouts/15/CreateInitiativesCSOM/CreateInitiatives.js"></script>
<body>
    <form id="CreateForm" novalidate="novalidate">
        <label for="Workspace_Name">Workspace Name</label>
        <input type="text" name="Workspace_Name"/><br />
        <label for="Description">Description</label>
        <input type="text" name="Description" /><br />
        <label for="PeoplePicker">Owner Name</label>
        <spuc:PeopleEditor name="PeoplePicker" runat="server" Width="350px"
            AllowEmpty="true" MultiSelect="true" SelectionSet="User"  />
         <br />
        <input type="submit" name="Create Workspace" value="Create Workspace" onclick="createSite();" />
        <input type="reset" name="reset" value="Reset" onclick="this.Form.clear();" />
    </form>
</body>

我想使用jquery.validate.js验证这个表单

这是我用来验证表单的代码:

$(document).ready(function () {
    $("#CreateForm").validate({
        rules: {
            Workspace_Name: "required",
            Description: "required",
            PeoplePicker: "required"
        },
        messages: {
            Workspace_Name: "Please enter the Workspace Name",
            Description: "Please enter the Description",
            PeoplePicker: "Please enter the Owners for the Workspace"
        }
    });
    function createSite() {
         $("#CreateForm").valid();
    }
}

当我点击按钮时,它只是返回,什么也没发生。如何解决这个问题?

请帮。

函数

应该返回false
 function createSite() {
         $("#CreateForm").valid();
         return false;
    }

你可以在你的函数中添加"return false",但是当你使用jQuery时,你甚至可以做一些更漂亮的事情:

$('#CreateForm').on('click',':submit',function(event) {
  event.preventDefault();
  createSite()
})

这样你就可以用jQuery绑定提交按钮的CLICK动作。然后使用event.preventDefault(),您停止浏览器的默认操作(即发布表单)。