Monday, November 28, 2022

Membuat Form Login Menggunakan Zkoss

 


Prasyarat yang dibutuhkan dalam membuat Form Login menggunakan Framework Zkoss :

IDE Tools Netbeans / Eclipse

Terinstall zk framework. :  Instalasi ZK Framework pada Netbean & Eclipse


Berikut adalah cara membuat form login menggunakan Zkoss

1.  Buka Netbeans 


2. New Project  : FormLogin


3.  Design Form Login



4.  Buat Controller dengan nama : LoginController.java

import org.zkoss.zk.ui.Executions;

import org.zkoss.zk.ui.Session;

import org.zkoss.zk.ui.Sessions;

import org.zkoss.zk.ui.util.GenericForwardComposer;

import org.zkoss.zul.Label;

import org.zkoss.zul.Textbox;

/**  Controller untuk pengecekan login */

public class LoginController extends GenericForwardComposer {

    private Textbox username, password;

    private Label message;

    public void onClick$login() {

        if (!username.getValue().trim().equals("") && !password.getValue().trim().equals("")

                && username.getValue().equals("admin") && password.getValue().equals("admin")) {

            //set session to browser

            Session sess = Sessions.getCurrent();

            sess.setAttribute("userCredential", "user");


            Executions.sendRedirect("home.zul");

        } else {

            message.setValue("Login Incorrect");

        }

    }

    public void onOK$username() {

        onClick$login();

    }

    public void onOK$password() {

        onClick$login();

    }

}


5.. Buat file : AuthController.java

import java.util.Map;

import org.zkoss.zk.ui.Executions;

import org.zkoss.zk.ui.Page;

import org.zkoss.zk.ui.Sessions;

import org.zkoss.zk.ui.util.Initiator;

/** Link form */

public class AuthController implements Initiator {

    @Override

    public void doInit(Page page, Map<String, Object> args) throws Exception {

        String name = (String) args.get("name");

        String cre = (String) Sessions.getCurrent().getAttribute("userCredential");

        if (cre == null) {

            if (!name.equals("login")) {

                Executions.sendRedirect("/login" + ".zul");

            }

        } else {

            if (!name.equals("home")) {

                Executions.sendRedirect("/home" + ".zul");

            }

        }

    }

}


6. Buat file : login.zul 

<?xml version="1.0" encoding="UTF-8"?>

<!-- protect page by the authcontroller  -->

<?init class="AuthController" name="login"?>

<zk xmlns="http://www.zkoss.org/2005/zul">

    <hbox self="@define(content)" vflex="1" hflex="1" align="center"

          pack="center" spacing="20px" style="background : white;">

        <vlayout>

            <window id="win"    apply="LoginController"

                    border="2" hflex="min" >

                <groupbox id="value" mold="3d" closable="false">

                    <caption label="Login Form" />

                    <vbox hflex="min" align="center" >

                        <label id="message" />

                        <div class="input-group" >

                            <textbox id="username" focus="true" placeholder="username"  />

                        </div>

                        <div class="input-group" width="300px">

                            <textbox id="password" placeholder="password" type="password"  />

                        </div>

                        <div> 

                            <button id="login" label="Enter" />

                        </div>

                    </vbox>

                </groupbox>

                

            </window>

        </vlayout>

    </hbox>

</zk>


7. Buat file : form home.zul

<?xml version="1.0" encoding="UTF-8"?>

<!-- protect page by the authcontroller  -->

<?init class="AuthController" name="home"?>

<zk xmlns="http://www.zkoss.org/2005/zul">

   Welcome, to home

</zk>


Memunculkan Simbol & Emoji Pada OS Mac

  Memunculkan Simbol & Emoji  1. Buka aplikasi Pages / Notes pada Macbook. 2. Klik pada Menubar Edit --> Pilih Emoji and Symbols a...