JavaScript DHTML/SmartClient/CheckBox

Материал из Web эксперт
Перейти к: навигация, поиск

CheckBox image button

   <source lang="html4strict">


<HTML><HEAD> 

 <SCRIPT>var isomorphicDir="isomorphic/";</SCRIPT>
   <SCRIPT SRC=isomorphic/system/modules/ISC_Core.js></SCRIPT>
   <SCRIPT SRC=isomorphic/system/modules/ISC_Foundation.js></SCRIPT>
   <SCRIPT SRC=isomorphic/system/modules/ISC_Containers.js></SCRIPT>
   <SCRIPT SRC=isomorphic/system/modules/ISC_Grids.js></SCRIPT>
   <SCRIPT SRC=isomorphic/system/modules/ISC_Forms.js></SCRIPT>
   <SCRIPT SRC=isomorphic/system/modules/ISC_DataBinding.js></SCRIPT>
 <SCRIPT SRC=isomorphic/skins/SmartClient/load_skin.js></SCRIPT>

</HEAD><BODY BGCOLOR="papayawhip" MARGINHEIGHT=0 MARGINWIDTH=0 LEFTMARGIN=0 TOPMARGIN=0> 

 ImgButton selection example

 Isomorphic SmartClient SDK
<IMG SRC=images/blank.gif WIDTH=1 HEIGHT=4>


<SCRIPT> Label.create({ 

   ID:"results",
   height:20,
   width:200,
   top:350,
   left:35

}) function showClicked(name) { 

   results.setContents(name + " clicked");

} // Labels Label.create({ 

 left:20,
 top:50,
 width:300,
 height:20,
 align:"Canvas.RIGHT",
 contents:"Buttons (Normal/Disabled):"

}); Label.create({ 

 left:20,
 top:150,
 width:400,
 height:20,
 align:"Canvas.RIGHT",
 contents:"Checkboxes (Selected/Unselected/Selected and Disabled):"

}); Label.create({ 

 left:20,
 top:250,
 width:300,
 height:20,
 align:"Canvas.RIGHT",
 contents:"Radio Buttons:"

}); // Buttons ImgButton.create({ 

   ID:"b1",
   left:20,
   top:80,
   width:33,
   height:33,
   src:"http://www.wbex.ru/style/logo.png",
   click:"showClicked(this.getID())"

});

ImgButton.create({ 

   ID:"b2",
   left:140,
   top:80,
   width:33,
   height:33,
   src:"http://www.wbex.ru/style/logo.png",
   click:"showClicked(this.getID())",
   disabled:true

});

ImgButton.create({ 

   ID:"cb1",
   left:20,
   top:180,
   width:33,
   height:33,
   src:"http://www.wbex.ru/style/logo.png",
   click:"showClicked(this.getID())",
   selected:true,
   actionType:"checkbox"

});

ImgButton.create({ 

   ID:"cb2",
   left:140,
   top:180,
   width:33,
   height:33,
   src:"http://www.wbex.ru/style/logo.png",
   click:"showClicked(this.getID())",
   actionType:"checkbox"

});

ImgButton.create({ 

   ID:"cb3",
   left:260,
   top:180,
   width:33,
   height:33,
   src:"http://www.wbex.ru/style/logo.png",
   click:"showClicked(this.getID())",
   disabled:true,
   selected:true,
   actionType:"checkbox"

});

ImgButton.create({ 

   ID:"rb1",
   left:20,
   top:280,
   width:33,
   height:33,
   src:"http://www.wbex.ru/style/logo.png",
   click:"if (selectedImgButton != this) {selectedImgButton.deselect(); selectedImgButton=this}; showClicked(this.getID())",
   selected:true,
   actionType:"radio"

});

ImgButton.create({ 

   ID:"rb2",
   left:140,
   top:280,
   width:33,
   height:33,
   src:"http://www.wbex.ru/style/logo.png",
   click:"if (selectedImgButton != this) {selectedImgButton.deselect(); selectedImgButton=this}; showClicked(this.getID())",
   actionType:"radio"

});

ImgButton.create({ 

   ID:"rb3",
   left:260,
   top:280,
   width:33,
   height:33,
   src:"http://www.wbex.ru/style/logo.png",
   click:"if (selectedImgButton != this) {selectedImgButton.deselect(); selectedImgButton=this}; showClicked(this.getID())",
   actionType:"radio"

});

var selectedImgButton = rb1; </SCRIPT> </BODY> </HTML> 

 </source>


Use checkbox

   <source lang="html4strict">


<HTML><HEAD> 

 <SCRIPT>var isomorphicDir="isomorphic/";</SCRIPT>
   <SCRIPT SRC=isomorphic/system/modules/ISC_Core.js></SCRIPT>
   <SCRIPT SRC=isomorphic/system/modules/ISC_Foundation.js></SCRIPT>
   <SCRIPT SRC=isomorphic/system/modules/ISC_Containers.js></SCRIPT>
   <SCRIPT SRC=isomorphic/system/modules/ISC_Grids.js></SCRIPT>
   <SCRIPT SRC=isomorphic/system/modules/ISC_Forms.js></SCRIPT>
   <SCRIPT SRC=isomorphic/system/modules/ISC_DataBinding.js></SCRIPT>
 <SCRIPT SRC=isomorphic/skins/SmartClient/load_skin.js></SCRIPT>

</HEAD><BODY> <SCRIPT> var abcdArray = ["a", "b", "c", "d"], 

   abcdList = {a:"option a", b:"option b", c:"option c", d:"option d"},

   formItems = [
   
   {name:"item1", type:"header", defaultValue:"header value"},
   {name:"item2", type:"blurb", defaultValue:"blurb value"},
   {type:"rowSpacer"},
   {name:"item3", title:"staticText", type:"staticText", defaultValue:"staticText value"},
   
   //----- data items -----\\
   {name:"item4", title:"text", type:"text", defaultValue:"text value"},
   {name:"item8", title:"checkbox", type:"checkbox", defaultValue:true},
 
   ];

DynamicForm.create({ 

   ID:"itemsForm",
   left:20,
   top:40,
   width:400,
   items:formItems,
   canSubmit:true  // Required for the submit button to be operative

}); </SCRIPT> </BODY> </HTML> 

 </source>
Источник — «http://wbex.ru/index.php?title=JavaScript_DHTML/SmartClient/CheckBox&oldid=3753»