It is currently Mon Oct 23, 2017 6:39 pm

News News of CrossUI Code Snaps

Site map of CrossUI Code Snaps » Forum : CrossUI Code Snaps

Find code here before you post.

Mask Input 2

   
Class('App.tech_form_f2', 'xui.Com',{
Instance:{
iniComponents:function(){
// [[code created by CrossUI RAD Tools
var host=this, children=, append=function(child){children.push(child.get(0))};

append((new xui.UI.Input)
.setHost(host,"input2")
.setLeft(210)
.setTop(70)
.setWidth(260)
.setTips("Input please")
.setTipsErr(": (")
.setTipsOK(": )")
.setTipsBinder("divB1")
.setMask("(111) aaa-11%$1")
);

append((new xui.UI.Div)
.setHost(host,"div13")
.setLeft(60)
.setTop(70)
.setWidth(130)
.setHeight(20)
.setHtml("(111) aaa-11%$1")
);

append((new xui.UI.Div)
.setHost(host,"divB1")
.setLeft(490)
.setTop(70)
.setWidth(230)
.setHeight(20)
);

return children;
// ]]code created by CrossUI RAD Tools
}
}
});
   
Read more : Mask Input 2 | Views : 2364 | Replies : 0


Mask Input

Class('App.tech_form_f1', 'xui.Com',{
Instance:{
iniComponents:function(){
// [[code created by CrossUI RAD Tools
var host=this, children=, append=function(child){children.push(child.get(0))};

append((new xui.UI.Group)
.setHost(host,"group1")
.setLeft(60)
.setTop(40)
.setWidth(500)
.setCaption("mask input")
);

host.group1.append((new xui.UI.Div)
.setHost(host,"div14")
.setLeft(233)
.setTop(19)
.setWidth(90)
.setHeight(20)
.setHtml("(111) 111-1111")
);

host.group1.append((new xui.UI.Div)
.setHost(host,"div13")
.setLeft(20)
.setTop(19)
.setWidth(80)
.setHeight(20)
.setHtml("11/11/1111")
);

host.group1.append((new xui.UI.Div)
.setHost(host,"div15")
.setLeft(20)
.setTop(50)
.setWidth(80)
.setHeight(20)
.setHtml("~1.11")
);

host.group1.append((new xui.UI.Div)
.setHost(host,"div16")
.setLeft(250)
.setTop(50)
.setWidth(80)
.setHeight(20)
.setHtml("(111) a-a *$*")
);

host.group1.append((new xui.UI.Input)
.setHost(host,"iMask")
.setLeft(100)
.setTop(19)
.setMask("11/11/1111")
.setTabindex("17")
);

host.group1.append((new xui.UI.Input)
.setHost(host,"input18")
.setLeft(330) ...
Read more : Mask Input | Views : 2370 | Replies : 0


Form validator dynamically

Class('App.tech_form_v3', 'xui.Com',{
Instance:{
iniComponents:function(){
// [[code created by CrossUI RAD Tools
var host=this, children=, append=function(child){children.push(child.get(0))};

append((new xui.UI.Div)
.setHost(host,"div13")
.setLeft(60)
.setTop(70)
.setWidth(130)
.setHeight(20)
.setHtml("Using ValueFormat")
);

append((new xui.UI.Div)
.setHost(host,"div12")
.setLeft(170)
.setTop(30)
.setWidth(420)
.setHeight(20)
.setHtml("Format Validator (example : only number) -- check dynamically")
);

append((new xui.UI.Input)
.setHost(host,"input2")
.setLeft(210)
.setTop(70)
.setWidth(260)
.setValueFormat("^-?(\\d\\d*\\.\\d*$)|(^-?\\d\\d*$)|(^-?\\.\\d\\d*$)")
.setTips("Input number please")
.setTipsErr(": (")
.setTipsOK(": )")
.setTipsBinder("divB1")
.setDynCheck(true)
);

append((new xui.UI.Div)
.setHost(host,"divB1")
.setLeft(490)
.setTop(70)
.setWidth(230)
.setHeight(20)
.setHtml("Using ValueFormat")
);

return children;
// ]]code created by ...
Read more : Form validator dynamically | Views : 2357 | Replies : 0


Form validator with tips binder

Class('App.tech_form_v2', 'xui.Com',{
Instance:{
iniComponents:function(){
// [[code created by CrossUI TAD Tools
var host=this, children=, append=function(child){children.push(child.get(0))};

append((new xui.UI.Input)
.setHost(host,"input2")
.setLeft(210)
.setTop(70)
.setWidth(260)
.setValueFormat("^-?(\\d\\d*\\.\\d*$)|(^-?\\d\\d*$)|(^-?\\.\\d\\d*$)")
.setTips("Input number please")
.setTipsErr(": (")
.setTipsOK(": )")
.setTipsBinder("divB1")
);

append((new xui.UI.Div)
.setHost(host,"div12")
.setLeft(170)
.setTop(30)
.setWidth(430)
.setHeight(20)
.setHtml("Format Validator (example : only number) -- binder tips info to a Div")
);

append((new xui.UI.Div)
.setHost(host,"div13")
.setLeft(60)
.setTop(70)
.setWidth(130)
.setHeight(20)
.setHtml("Using ValueFormat")
);

append((new xui.UI.Div)
.setHost(host,"divB1")
.setLeft(490)
.setTop(70)
.setWidth(230)
.setHeight(20)
.setHtml("Using ValueFormat")
);

return children;
// ...
Read more : Form validator with tips binder | Views : 3807 | Replies : 0


Simple Form validator

Class('App.tech_form_v1', 'xui.Com',{
Instance:{
iniComponents:function(){
// [[code created by CrossUI RAD Tools
var host=this, children=, append=function(child){children.push(child.get(0))};

append((new xui.UI.Input)
.setHost(host,"input2")
.setLeft(210)
.setTop(70)
.setWidth(260)
.setValueFormat("^-?(\\d\\d*\\.\\d*$)|(^-?\\d\\d*$)|(^-?\\.\\d\\d*$)")
.setTips("Input number please")
.setTipsErr(": (")
.setTipsOK(": )")
);

append((new xui.UI.Div)
.setHost(host,"div12")
.setLeft(170)
.setTop(30)
.setWidth(300)
.setHeight(20)
.setHtml("Format Validator (example : only number)")
);

append((new xui.UI.Div)
.setHost(host,"div13")
.setLeft(60)
.setTop(70)
.setWidth(130)
.setHeight(20)
.setHtml("Using ValueFormat")
);

append((new xui.UI.Input)
.setHost(host,"input9")
.setLeft(210)
.setTop(110)
.setWidth(260)
.setTips("Input number please")
.setTipsErr(": (")
.setTipsOK(": )")
.beforeFormatCheck("_input9_beforeFormatCheck")
);

append((new xui.UI.Div)
.setHost(host,"div18")
.setLeft(60)
.setTop(110)
.setWidth(130) ...
Read more : Simple Form validator | Views : 2343 | Replies : 0


Several ways to customize event functions

   
Class('App.tech_UI_cf', 'xui.Com',{
Instance:{
_button21_onclick:function (profile, e, value) {
if(profile.CF.click){
_.tryF(profile.CF.click);
}else
xui.message('click fired in normal onclick event')
},
iniComponents:function(){
// [[code created by CrossUI RAD Tools
var host=this, children=, append=function(child){children.push(child.get(0))};

append((new xui.UI.Button)
.setHost(host,"button21")
.setLeft(110)
.setTop(100)
.setCaption("button21")
.onClick("_button21_onclick")
);

append((new xui.UI.Button)
.setHost(host,"button24")
.setLeft(270)
.setTop(100)
.setCaption("button21")
.onClick("_button21_onclick")
.setCustomFunction({"click":function () {
xui.message("click fired in Custom Functions");
}})
);

return children;
// ]]code created by CrossUI RAD Tools
}
}
});
   
Read more : Several ways to customize event functions | Views : 2163 | Replies : 0


Several ways to customize Appearances by CSS class

   
Class('App.tech_UI_cc', 'xui.Com',{
Instance:{
events:{"onReady":"_onready"},
iniComponents:function(){
// [[code created by CrossUI RAD Tools
var host=this, children=, append=function(child){children.push(child.get(0))};

append((new xui.UI.List)
.setHost(host,"list3")
.setItems()
.setLeft(170)
.setTop(70)
);

append((new xui.UI.List)
.setHost(host,"list4")
.setItems()
.setLeft(330)
.setTop(70)
.setCustomClass({"ITEMS":"css-class-a", "ITEM":"css-class-b"})
);

return children;
// ]]code created by CrossUI RAD Tools
},
_onready:function () {
xui.CSS.addStyleSheet(".css-class-a{border:dashed 2px #00ff00} .css-class-b{font-size:14px; border:solid 1px #ccc; margin: 4px;}", '__class_added')
}
}
});
   
Read more : Several ways to customize Appearances by CSS class | Views : 2305 | Replies : 0


Several ways to customize Behaviors

   
Class('App.tech_UI_cb', 'xui.Com',{
Instance:{
_button21_onclick:function (profile, e, value) {
xui.message('click fired in normal onclick event')
},
iniComponents:function(){
// [[code created by CrossUI RAD Tools
var host=this, children=, append=function(child){children.push(child.get(0))};

append((new xui.UI.Button)
.setHost(host,"button21")
.setLeft(110)
.setTop(100)
.setCaption("button21")
.onClick("_button21_onclick")
);

append((new xui.UI.Button)
.setHost(host,"button24")
.setLeft(270)
.setTop(100)
.setCaption("button21")
.onClick("_button21_onclick")
.setCustomBehavior({"onClick":function () {
xui.message("click fired in Custom Behaviors");
}})
);

return children;
// ]]code created by CrossUI RAD Tools
}
}
});
   
Read more : Several ways to customize Behaviors | Views : 2174 | Replies : 0


Several ways to customize Appearances

   
Class('App.tech_UI_ca', 'xui.Com',{
Instance:{
iniComponents:function(){
// [[code created by CrossUI RAD Tools
var host=this, children=, append=function(child){children.push(child.get(0))};

append((new xui.UI.List)
.setHost(host,"list3")
.setItems()
.setLeft(170)
.setTop(70)
);

append((new xui.UI.List)
.setHost(host,"list4")
.setItems()
.setLeft(330)
.setTop(70)
.setCustomStyle({"ITEMS":"border:dashed 2px #00ff00", "ITEM":"font-size:14px; border:solid 1px #ccc; margin: 4px;"})
);

append((new xui.UI.List)
.setHost(host,"list5")
.setItems()
.setLeft(490)
.setTop(70)
);

return children;
// ]]code created by CrossUI RAD Tools
}
}
});
   
Read more : Several ways to customize Appearances | Views : 1763 | Replies : 0


UI Event Tester

Class('App.tech_UI_event', 'xui.Com',{
Instance:{
arr:,
iniComponents:function(){
// [[code created by CrossUI RAD Tools
var host=this, children=, append=function(child){children.push(child.get(0))};

append((new xui.UI.Input)
.setHost(host,"input1")
.setLeft(100)
.setTop(40)
.setWidth(278)
.beforeValueSet("_traceEvent")
.afterValueSet("_traceEvent")
.beforeUIValueSet("_traceEvent")
.afterUIValueSet("_traceEvent")
.beforeHoverEffect("_traceEvent")
.onRender("_traceEvent")
.onLayout("_traceEvent")
.onDestroy("_traceEvent")
.onHotKeydown("_traceEvent")
.onHotKeypress("_traceEvent")
.onHotKeyup("_traceEvent")
.onShowTips("_traceEvent")
.onFocus("_traceEvent")
.onBlur("_traceEvent")
.beforeDirtyMark("_traceEvent")
.beforeFormatCheck("_traceEvent")
.beforeFormatMark("_traceEvent")
);

append((new xui.UI.Panel)
.setHost(host,"panelbar2")
.setDock("none")
.setLeft(100)
.setTop(70)
.setWidth(278)
.setHeight(298)
.setZIndex(1)
.setCaption("Event Tracer")
.setCustomStyle({"KEY":"border:solid 1px #ccc"})
);

append((new xui.UI.Button)
.setHost(host,"button3")
.setLeft(100)
.setTop(390)
.setCaption("Clear")
.setWidth(278)
.onClick("_button3_onclick")
);

return children;
// ]]code created by CrossUI RAD Tools
},
_traceEvent:function(p) ...
Read more : UI Event Tester | Views : 1741 | Replies : 0


 

Login  •  Register


Statistics

Total posts 991 • Total topics 332 • Total members 35

cron