1.Semantic UI in the validation of the control, the function is very good, the document written in the civil service is more detailed, I will not repeat here, mainly to say about the use of its events, this may have some friends just start contact when not very understanding
Note These events: The first two are calls to the field validation pass and the event after the failure, and the last two are the events that are invoked when the entire form is validated or failed, so we can write this when we call
function login () { $ (". Ui.form"). Form ( { username: { identifier: ' username ', rules: [ { Type: ' Empty ', prompt: ' User name cannot be empty ' } ' }, Userpass: { identifier: ' Userpass ', rules: [ { type: ' Empty ', prompt: ' user password cannot be null '}} }}, { onsuccess:function () { alert ("Succeeded! "); } } ); } </script>
<%@ Page Language="C #"AutoEventWireup="true"CodeFile="Login.aspx.cs"Inherits="Login" %><!DOCTYPE HTML><HTMLxmlns= "http://www.w3.org/1999/xhtml"><Headrunat= "Server"> <title></title> <Scriptsrc= "Scripts/jquery-1.8.2.js"></Script> <Linkhref= "Js-ui/packaged/css/semantic.css"rel= "stylesheet" /> <Scriptsrc= "Js-ui/packaged/javascript/semantic.js"></Script> <Script> //Login Verification functionLogin () {$ (". Ui.form"). Form ({username: {identifier:'UserName', rules: [{type:'Empty', prompt:'user name cannot be empty'}]}, Userpass: {identifier: 'Userpass', rules: [{type:'Empty', prompt:'The user password cannot be empty'}]}}, {onsuccess:function() {alert ("it worked."); } } ); } </Script></Head><Body> <formID= "Form1"runat= "Server"> <Divclass= "UI form segment"> <Divclass= "UI one column relaxed grid"> <Divclass= "column"> <Divclass= "UI Fluid Form segment"> <H3class= "UI Header">Test System Login Screen</H3> <Divclass= "Field"> <label>User name</label> <inputtype= "text"name= "UserName"ID= "UserName"placeholder= "User name"/> </Div> <Divclass= "Field"> <label>Password</label> <inputtype= "Password"name= "Userpass"ID= "Userpass"/> </Div> <Divclass= "UI Blue Submit Button"onclick= "Login ()">Login</Div> </Div> </Div> </Div> <Divclass= "UI error Message"> </Div> </Div> </form></Body></HTML>
For the field is written in the position of the field, the call for this event I also studied for a long time, I hope you encounter this problem when you can look at.
Semantic the use of events for validation controls in the UI