0

Interface for login pane

asked 2013-04-09 08:42:25 +0800

hotboy301 gravatar image hotboy301
0

updated 2013-04-10 06:33:29 +0800

sjoshi gravatar image sjoshi flag of India
3493 1 8
http://zkframeworkhint.bl...

Hi, i want to design my login page, but i am amater here is my login.zul :

<zk>

<div apply="org.zkoss.bind.BindComposer"
        viewModel="@id('vm') @init('login.Login')"
        validationMessages="@id('vmsgs')"
        form="@id('fx') @load(vm.user) @save(vm.user, before='submit')">
    <window border="normal" width="400px" style="padding-top:20px;padding-left:20px;" title="Welcome! New User">
         <grid hflex="1">
        <auxhead>
            <auxheader colspan="2" label="Login Form" style="font-size:16px" />
        </auxhead>
        <columns/>

        <rows>

             <row>
                    <label value="UserName" width="250px" />
                    <hlayout>
                        <textbox value="@bind(fx.userName)"
                            width="150px" tabindex="1"  />
                    </hlayout>

                </row>
                <row>
                    Password
                    <textbox type="password" value="@bind(fx.password)"
                        width="150px" tabindex="2" />

                </row>
            <row spans="2" align="right">
                <hlayout>
                   <label visible="@load(empty vmsgs)" />
                    <button id="submitButton"  onClick="@command('submit')" label="Submit" />

                </hlayout>
            </row>
        </rows>
    </grid>

</window>
</div>
</zk>

Plz help me, design for it, simple, make it in center page and change backgroup color ! thanks for help !

delete flag offensive retag edit

2 Answers

Sort by ยป oldest newest most voted
0

answered 2013-04-10 01:58:47 +0800

hawk gravatar image hawk
3225 1 5
http://hawkphoenix.blogsp... ZK Team

updated 2013-04-10 02:02:01 +0800

you can reference login.zul in http://books.zkoss.org/wiki/ZKEssentials/Chapter8:_Authentication to make it center.

For changing color, you can use style attribute of a component or refer to http://books.zkoss.org/wiki/ZKStyleGuide for more details.

link publish delete flag offensive edit
1

answered 2013-04-12 08:23:21 +0800

Senthilchettyin gravatar image Senthilchettyin flag of India
2623 3 8
http://emrpms.blogspot.in...

Example here

link publish delete flag offensive edit
Your answer
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow
1 follower

RSS

Stats

Asked: 2013-04-09 08:42:25 +0800

Seen: 42 times

Last updated: Apr 12 '13

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More