| javascript_components

# Class: Bs_Radio Source Location: /components/radio/Bs_Radio.class.js.php
### Class Overview
Radio Field. #### Author(s): andrej arn <at blueshoes dot org> #### Copyright: blueshoes.org | ### Variables $allowNoSelection $captionAsTitleText $constructor $cssClass $cssStyle $disabled $guiNochange $iconType $imgDir $imgHeight $imgType $imgWidth $invertActive $options $pixelate $radioFieldName $useMouseover $value | ### Methods addOption attachEvent constructor convertField draw drawInto fireEvent getValue hasEventAttached initByField onClick render renderAsTable
### Inherited Variables | ### Inherited Methods
### Class Details [line 46] Radio Field. check the website at http://www.blueshoes.org/en/javascript/radio/ Event-Handling (see attachEvent()): You can attach code or a callback function for certain events onto this component (events are things like onClick, onChange ... aso) See attachEvent() for a list of supported events and more details. #### Tags:
copyright: | blueshoes.org
author: | andrej arn <at blueshoes dot org>
[ Top ] ### Class Variables #### $allowNoSelection = false [line 117] should it be possible to remove the selection from all options? if so, set this to true. then a click on an already selected option will remove the selection. #### Tags:
var: | allowNoSelection
since: | bs4.4
access: | public
Type: | bool
[ Top ] #### $captionAsTitleText = false [line 168] if set to true then the caption will be used as title text only on the radio icons. in bs4.5 this has been renamed from captionAsAltText, but it's backward compatible. #### Tags:
var: | captionAsTitleText (default is false)
access: | public
Type: | bool
[ Top ] #### $constructor = [line 883]
Type: | mixed
[ Top ] #### $cssClass = [line 178] the css class to use. not specified = none. if you want different classes for different options, add some functionality to this code. :-) #### Tags:
var: | cssClass
see: | var this.cssStyle
access: | public
Type: | string
[ Top ] #### $cssStyle = [line 188] the css style to use. not specified = none. if you want different styles for different options, add some functionality to this code. :-) #### Tags:
var: | cssStyle
see: | var this.cssClass
access: | public
Type: | string
[ Top ] #### $disabled = false [line 96] no change can be made. if set to true then this overwrites the settings of all options. #### Tags:
var: | disabled (default is false)
todo: | implement this completely
see: | var guiNochange
access: | public
Type: | bool
[ Top ] #### $guiNochange = false [line 107] if set to true then the user cannot change things by clicking. changes through the api functions (for the coder, you) are still possible. if set to true then this overwrites the settings of all options. #### Tags:
var: | guiNochange
todo: | implement this completely
see: | var disabled
access: | public
Type: | bool
[ Top ] #### $iconType = 'image' [line 256] how the different radio icons should be made. 'image' => default, old fashion: for every mode there is an image. 'css' => styles: only one image, and 'active', disabled' etc are done using css. when using css, the disabled mode only works (visually) in ie because moz does not support the 'filters'. #### Tags:
var: | iconType
since: | bs4.5
access: | public
Type: | string
[ Top ] #### $imgDir = '/_bsJavascript/components/radio/img/bobby/' [line 133] directory where the images are. feel free to create your own images, put them into another directory (by using the same file names, etc.) #### Tags:
var: | imgDir
access: | public
Type: | string
[ Top ] #### $imgHeight = '12' [line 157] the height of the radio icon. #### Tags:
var: | imgHeight
see: | vars this.imgDir, this.imgWidth
access: | public
Type: | int
[ Top ] #### $imgType = 'gif' [line 141] the image type, 'gif' (default), 'jpg', 'png' or whatever. #### Tags:
var: | imgType
since: | bs4.5
access: | public
Type: | string
[ Top ] #### $imgWidth = '12' [line 149] the width of the radio icon. #### Tags:
var: | imgWidth
see: | vars this.imgDir, this.imgHeight
access: | public
Type: | int
[ Top ] #### $invertActive = false [line 241] inverts the currently active icon. uses microsoft filters, thus for ie only. see example 6: http://www.blueshoes.org/_bsJavascript/components/radio/examples/example6.html this.iconType has to be 'css', otherwise it makes no sense. #### Tags:
var: | invertActive
since: | bs4.5
status: | experimental
access: | public
Type: | bool
[ Top ] #### $options = new Object() [line 76] the options of this radio button. you may directly overwrite this var with your own array, or use this.addOption() to add one option after another. data structure: hash where the key is the value of the options, and the value is another hash with the keys: caption hide activateable deactivateable furtherOptions #### Tags:
see: | this.addOption()
Type: | mixed
[ Top ] #### $pixelate = 0 [line 225] pixelate the available options that are not currently selected? uses microsoft filters, thus for ie only. set to a number, eg 10, play with the values. see example 6: http://www.blueshoes.org/_bsJavascript/components/radio/examples/example6.html this.iconType has to be 'css', otherwise it makes no sense. #### Tags:
var: | pixelate
since: | bs4.5
status: | experimental
access: | public
Type: | int
[ Top ] #### $radioFieldName = [line 124] name of the radio form field. if not set until draw() is called then one will be made up. #### Tags:
var: | radioFieldName
Type: | string
[ Top ] #### $useMouseover = false [line 208] you may use the built in onMouseOver event to switch the icon. note: if you use this one, it's wise to create all icons, even those which are never used. consider just using spacer-gif's for them. because if an icon does not exist, the server returns a 404 not found. and then the client (the users browser) goes and re-requests those files again and again, on each click (radio status change), to see if they're now available, even if never used. btw, i'm speaking of the "inactive" icons. this.iconType has to be 'image', otherwise it makes no sense. #### Tags:
todo: | implement this
access: | public
Type: | bool
[ Top ] #### $value = null [line 86] the value of the currently checked option. null for no value. #### Tags:
var: | value (string, may be numeric if you like, just treated as string. null if no value.)
see: | Bs_Radio::getValue()
Type: | mixed
[ Top ] ### Class Methods ### method addOption [line 592]
`void addOption( string value, string caption, string hide, string activateable, string deactivateable, array furtherOptions)`
adds the given option to the radio options. if there is already an option with such a value, it will be overwritten. (case sensitive!) activateable and deactivateable: may this option be activated or deactivated? there are 2 possible values: 'yes' => this is the default. 'script' => the user may not do it, it's only possible via script. 'no' => no change is possible. so as an example, it is possible to have a radio option that cannot be selected, but if it is already selected by default, the selection can be "taken away". param "furtherOptions": if given, it can have some or all of the keys: iconPrefix, cssClass, cssStyle, captionAsTitleText (more to come?) these settings then overwrite the default settings of this class. #### Tags:
todo: | implement the activateable/deactivateable stuff
see: | var this.options
access: | public
#### Parameters:
string | value | value
string | caption | caption
string | hide | hide (if set to true then this option won't be visible.)
string | activateable | activateable (default is 'yes', see above)
string | deactivateable | deactivateable (default is 'yes', see above)
array | furtherOptions | furtherOptions (see above)
[ Top ] ### method attachEvent [line 804]
`void attachEvent( string trigger, mixed yourEvent)`
Attaches an event like onChange, onMouseOver, onClickCaption ... a.s.o. Supported events are: 'onChange' #### Tags:
see: | _attachedEvents
access: | public
#### Parameters:
string | trigger | trigger (for example 'onChange')
mixed | yourEvent | A globalFunctionName OR string of javascript to be evaled (using JS's eval())
[ Top ] ### method constructor [line 286]
`void constructor( )`
constructor [ Top ] ### method convertField [line 333]
`void convertField( string fieldName)`
uses an existing standard radio field and 'upgrades' it to a bs_radio field. a radio field (most always) has more than 1 radio option. all those options share the same field name, but may (and should!) have different id's. that's why you have to give the name, not the id as param to this method. NOTE: all onSomething functions that are attached to your existing plain html radio field options will be lost. #### Tags:
access: | public
#### Parameters:
string | fieldName | fieldName (name, not id!)
[ Top ] ### method draw [line 412]
`void draw( string value)`
DEPRECATED USE drawInto() renders the radio option specified and document.write()'s it immediatly. #### Tags:
deprecated: | use this.drawInto()
access: | public
#### Parameters:
string | value | value
[ Top ] ### method drawInto [line 387]
`bool drawInto( string value, string tagId)`
this method renders the option specified into the tag specified. example: you have a <div id="radioOptionMr"></div> and you want the <option name="sex" value="mr"> Mr. option rendered into this tag. then use: yourRadioObj.drawInto('mr', 'radioOptionMr'); #### Tags:
return: | (true on success, false on failure)
access: | public
#### Parameters:
string | value | value (null to render the full table, see this.renderAsTable().)
string | tagId | tagId
[ Top ] ### method fireEvent [line 833]
`void fireEvent( string trigger)`
Fires the events for the trigger specified. (used internally, but feel free to trigger events yourself...) #### Tags:
access: | public
#### Parameters:
string | trigger | trigger (for example 'onClickCaption')
[ Top ] ### method getValue [line 621]
`mixed getValue( )`
returns the current value. #### Tags:
return: | (null if no value, string otherwise
access: | public
[ Top ] ### method hasEventAttached [line 822]
`bool hasEventAttached( string trigger)`
Tells if an event is attached for the trigger specified. #### Tags:
access: | public
#### Parameters:
string | trigger | trigger
[ Top ] ### method initByField [line 305]
`void initByField( string fieldName)`
inits this class using an existing html radio field. the available options and current value is affected. the captions cannot be read in. #### Tags:
access: | public
#### Parameters:
string | fieldName | fieldName
[ Top ] ### method onClick [line 634]
`void onClick( string value)`
fires on an onclick event. you better use this.setTo(value) as API function cause this one is used half-internally. #### Tags:
see: | this.setTo()
access: | public
#### Parameters:
string | value | value
[ Top ] ### method render [line 461]
`string render( string value)`
renders the radio option (generates html code). a radio field in html looks like this: <input type="radio" name="name" value="value" checked> #### Tags:
return: | (empty string if no such option)
access: | public
#### Parameters:
string | value | value (of the option you want)
[ Top ] ### method renderAsTable [line 424]
`string renderAsTable( string direction, string tableTag)`
returns the whole select field with all options, rendered as html table. #### Tags:
access: | public
#### Parameters:
string | direction | direction ('vertical' (default) or 'horizontal')
string | tableTag | tableTag (you can give your own <table> tag here, otherwise '<table border="0">' is used.
[ Top ] Documentation generated on Mon, 29 Dec 2003 22:18:26 +0100 by phpDocumentor 1.2.3