如何使用GetOrgChart在输入字段上应用验证?我使用了以下代码..
json_data = $ .rails.ajax url:“/organization_units.json” async:false dataType:“json”
$("#organization").getOrgChart
gridView: false
zoomable: true
printable: true
editable: true
color: "neutralgrey"
primaryColumns: ["Title", "Role","Members"]
dataSource: json_data.responseJSON.tree_data
答案 0 :(得分:0)
我为您创建了一个示例,点击"运行代码片段"并尝试使用无效的电话号码更新电话。
$("#people").getOrgChart({
primaryColumns: ["Name", "Title"],
dataSource: [
{ id: 1, parentId: null, Name: "Amber McKenzie", Title: "ESL teacher", Phone: "05454545454"},
{ id: 2, parentId: 1, Name: "Ava Field", Title: "Bricklayer", Phone: "08888888888"},
{ id: 3, parentId: 1, Name: "Evie Johnson", Title: "Nursing aide", Phone: "077777777"}]
});
$("#people").on("updateEvent", function( event, sender, args ) {
if (!/^\d+$/.test(args.data.Phone)){
event.preventDefault();
args.returnValue = false;
alert(args.data.Name + ' cannot be updated because Phone number field is not in correct format!');
}
});

html, body {margin: 0px; padding: 0px;height: 100%; overflow: hidden; }
#people {width: 100%;height: 100%; }

<script type='text/javascript' src='//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js'></script>
I have created an example for you, hit "Run Code Snippet" and try to update the Phone with invalid phone number.
<link rel="stylesheet" type="text/css" href="//www.getorgchart.com/GetOrgChart/getorgchart/getorgchart.css">
<script type='text/javascript' src="//www.getorgchart.com/GetOrgChart/getorgchart/getorgchart.js"></script>
<div id="people"></div>
&#13;