|

DOM cannot get Checkbox Button value

View: New views

6 Messages — Rating Filter: Alert me

	DOM cannot get Checkbox Button value by hkjackjoke :: Rate this Message: Reply to Author \| View Threaded \| Show Only this Message Hi, I use DOM to get the Checkbox Button value, but it returned as "undefined". Look like I am referring to not exist object. I can't find any hint from the YUI Library website. Could you please help me? Thanks in advance! regards, JK Below are the codes(Most of them from Checkbox Example): <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title>Checkbox Buttons</title> <link rel="stylesheet" type="text/css" href="../../build/fonts/fonts-min.css" /> <link rel="stylesheet" type="text/css" href="../../build/button/assets/skins/sam/button.css" /> <script type="text/javascript" src="../../build/yahoo-dom-event/yahoo-dom-event.js"></script> <script type="text/javascript" src="../../build/element/element-min.js"></script> <script type="text/javascript" src="../../build/button/button-min.js"></script> </head> <body class="yui-skin-sam"> <div id="checkboxbuttonsfrommarkup"> <span id="checkbutton8" class="yui-button yui-checkbox-button"><span class="first-child"><button type="button" name="checkboxfield2">Four</button></span></span> <input type="button" id="buttonMe" name="buttonMe" value="Get CheckBox Button Value" onClick="getByDom()"> <script> (function () { var Button = YAHOO.widget.Button; YAHOO.util.Event.onContentReady("checkboxbuttonsfrommarkup", function () { function onButtonClick(p_oEvent) { alert("You " + this.get("checked")+ " info "+ this.get("id")); } var oCheckButton8 = new Button("checkbutton8", { type: "checkbox", value: "4" ,onclick: { fn: onButtonClick }}); }); }()); function getByDom(){ var Dom = YAHOO.util.Dom; var value=Dom.get('checkbutton8').value; alert(value); } </script> </body> </html>
	Re: DOM cannot get Checkbox Button value by Todd Kloots :: Rate this Message: Reply to Author \| View Threaded \| Show Only this Message JK - When using a YUI Button instance, you don't query the DOM for the value, but rather the Button's "value" attribute via the get() method. For example: var val = oCheckButton8.get("value"); - Todd On Nov 2, 2009, at 8:47 PM, hkjackpot wrote: > Hi, > I use DOM to get the Checkbox Button value, but it returned as > "undefined". > Look like I am referring to not exist object. > I can't find any hint from the YUI Library website. Could you please > help me? Thanks in advance! > regards, > JK > > Below are the codes(Most of them from Checkbox Example): > > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd > "> > <html> > <head> > <meta http-equiv="content-type" content="text/html; charset=utf-8"> > <title>Checkbox Buttons</title> > <link rel="stylesheet" type="text/css" href="../../build/fonts/fonts- > min.css" /> > <link rel="stylesheet" type="text/css" href="../../build/button/ > assets/skins/sam/button.css" /> > <script type="text/javascript" src="../../build/yahoo-dom-event/ > yahoo-dom-event.js"></script> > <script type="text/javascript" src="../../build/element/element- > min.js"></script> > <script type="text/javascript" src="../../build/button/button- > min.js"></script> > </head> > <body class="yui-skin-sam"> > > <div id="checkboxbuttonsfrommarkup"> > > <span id="checkbutton8" class="yui-button yui-checkbox-button"><span > class="first-child"><button type="button" > name="checkboxfield2">Four</button></span></span> > > <input type="button" id="buttonMe" name="buttonMe" value="Get > CheckBox Button Value" onClick="getByDom()"> > > > <script> > (function () { > var Button = YAHOO.widget.Button; > YAHOO.util.Event.onContentReady("checkboxbuttonsfrommarkup", > function () { > > function onButtonClick(p_oEvent) { > alert("You " + this.get("checked")+ " info "+ this.get("id")); > } > > var oCheckButton8 = new Button("checkbutton8", { type: "checkbox", > value: "4" ,onclick: { fn: onButtonClick }}); > }); > > }()); > > function getByDom(){ > var Dom = YAHOO.util.Dom; > var value=Dom.get('checkbutton8').value; > alert(value); > > } > </script> > </body> > </html> > > > > > > > > > > > > > > > ------------------------------------ > > Yahoo! Groups Links > > >
	Re: DOM cannot get Checkbox Button value by hkjackjoke :: Rate this Message: Reply to Author \| View Threaded \| Show Only this Message Todd, With your advise, I finally get the value, tks. I write my understanding here, may be can help other people, too. a. I create the button from markup of Checkbox field, but Checkbox Button is different from Checkbox input field. b. DOM can use to get value of Checkbox field, however not applicable for Checkbox Button. (But there is a question mark in my head, why there is different? And where can I find this information in the API or website?) c. The Example provided by yui, the variable Scope is in a function (local). JK --- In ydn-javascript@..., Todd Kloots <kloots@...> wrote: > > JK - > > When using a YUI Button instance, you don't query the DOM for the > value, but rather the Button's "value" attribute via the get() > method. For example: > > var val = oCheckButton8.get("value"); > > - Todd > > On Nov 2, 2009, at 8:47 PM, hkjackpot wrote: > > > Hi, > > I use DOM to get the Checkbox Button value, but it returned as > > "undefined". > > Look like I am referring to not exist object. > > I can't find any hint from the YUI Library website. Could you please > > help me? Thanks in advance! > > regards, > > JK > > > > Below are the codes(Most of them from Checkbox Example): > > > > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd > > "> > > <html> > > <head> > > <meta http-equiv="content-type" content="text/html; charset=utf-8"> > > <title>Checkbox Buttons</title> > > <link rel="stylesheet" type="text/css" href="../../build/fonts/fonts- > > min.css" /> > > <link rel="stylesheet" type="text/css" href="../../build/button/ > > assets/skins/sam/button.css" /> > > <script type="text/javascript" src="../../build/yahoo-dom-event/ > > yahoo-dom-event.js"></script> > > <script type="text/javascript" src="../../build/element/element- > > min.js"></script> > > <script type="text/javascript" src="../../build/button/button- > > min.js"></script> > > </head> > > <body class="yui-skin-sam"> > > > > <div id="checkboxbuttonsfrommarkup"> > > > > <span id="checkbutton8" class="yui-button yui-checkbox-button"><span > > class="first-child"><button type="button" > > name="checkboxfield2">Four</button></span></span> > > > > <input type="button" id="buttonMe" name="buttonMe" value="Get > > CheckBox Button Value" onClick="getByDom()"> > > > > > > <script> > > (function () { > > var Button = YAHOO.widget.Button; > > YAHOO.util.Event.onContentReady("checkboxbuttonsfrommarkup", > > function () { > > > > function onButtonClick(p_oEvent) { > > alert("You " + this.get("checked")+ " info "+ this.get("id")); > > } > > > > var oCheckButton8 = new Button("checkbutton8", { type: "checkbox", > > value: "4" ,onclick: { fn: onButtonClick }}); > > }); > > > > }()); > > > > function getByDom(){ > > var Dom = YAHOO.util.Dom; > > var value=Dom.get('checkbutton8').value; > > alert(value); > > > > } > > </script> > > </body> > > </html> > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > ------------------------------------ > > > > Yahoo! Groups Links > > > > > > >
	Re: Re: DOM cannot get Checkbox Button value by Todd Kloots :: Rate this Message: Reply to Author \| View Threaded \| Show Only this Message JK - Button transforms all pre-existing markup into a new format (using the <button> element) in order to provide a look and feel that is consistent across Button types. For this reason, you need to use the Button's API, not the DOM API for accessing any attributes as the original markup provided (in your case, the <input>) element, isn't in the DOM any longer. So that covers your points a and b. Not sure about question c. Can you clarify your question? Thanks, Todd On Nov 3, 2009, at 7:10 PM, hkjackpot wrote: > Todd, > > With your advise, I finally get the value, tks. > > I write my understanding here, may be can help other people, too. > > a. I create the button from markup of Checkbox field, but Checkbox > Button is different from Checkbox input field. > b. DOM can use to get value of Checkbox field, however not applicable > for Checkbox Button. > (But there is a question mark in my head, why there is different? > And where can I find this information in the API or website?) > c. The Example provided by yui, the variable Scope is in a function > (local). > > JK > --- In ydn-javascript@..., Todd Kloots <kloots@...> wrote: >> >> JK - >> >> When using a YUI Button instance, you don't query the DOM for the >> value, but rather the Button's "value" attribute via the get() >> method. For example: >> >> var val = oCheckButton8.get("value"); >> >> - Todd >> >> On Nov 2, 2009, at 8:47 PM, hkjackpot wrote: >> >>> Hi, >>> I use DOM to get the Checkbox Button value, but it returned as >>> "undefined". >>> Look like I am referring to not exist object. >>> I can't find any hint from the YUI Library website. Could you please >>> help me? Thanks in advance! >>> regards, >>> JK >>> >>> Below are the codes(Most of them from Checkbox Example): >>> >>> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" > "http://www.w3.org/TR/html4/strict.dtd >>> "> >>> <html> >>> <head> >>> <meta http-equiv="content-type" content="text/html; charset=utf-8"> >>> <title>Checkbox Buttons</title> >>> <link rel="stylesheet" type="text/css" > href="../../build/fonts/fonts- >>> min.css" /> >>> <link rel="stylesheet" type="text/css" href="../../build/button/ >>> assets/skins/sam/button.css" /> >>> <script type="text/javascript" src="../../build/yahoo-dom-event/ >>> yahoo-dom-event.js"></script> >>> <script type="text/javascript" src="../../build/element/element- >>> min.js"></script> >>> <script type="text/javascript" src="../../build/button/button- >>> min.js"></script> >>> </head> >>> <body class="yui-skin-sam"> >>> >>> <div id="checkboxbuttonsfrommarkup"> >>> >>> <span id="checkbutton8" class="yui-button yui-checkbox-button"><span >>> class="first-child"><button type="button" >>> name="checkboxfield2">Four</button></span></span> >>> >>> <input type="button" id="buttonMe" name="buttonMe" value="Get >>> CheckBox Button Value" onClick="getByDom()"> >>> >>> >>> <script> >>> (function () { >>> var Button = YAHOO.widget.Button; >>> YAHOO.util.Event.onContentReady("checkboxbuttonsfrommarkup", >>> function () { >>> >>> function onButtonClick(p_oEvent) { >>> alert("You " + this.get("checked")+ " info "+ this.get("id")); >>> } >>> >>> var oCheckButton8 = new Button("checkbutton8", { type: "checkbox", >>> value: "4" ,onclick: { fn: onButtonClick }}); >>> }); >>> >>> }()); >>> >>> function getByDom(){ >>> var Dom = YAHOO.util.Dom; >>> var value=Dom.get('checkbutton8').value; >>> alert(value); >>> >>> } >>> </script> >>> </body> >>> </html> >>> >>> >>> >>> >>> >>> >>> >>> >>> >>> >>> >>> >>> >>> >>> ------------------------------------ >>> >>> Yahoo! Groups Links >>> >>> >>> >> > > > > > ------------------------------------ > > Yahoo! Groups Links > > >
	Re: DOM cannot get Checkbox Button value by hkjackjoke :: Rate this Message: Reply to Author \| View Threaded \| Show Only this Message Todd, Sorry for my late reply! My point c was remark to help anybody who looking for the issue too. In the example, oCheckButton8 is declared inside the function; in case to access it outside the function. I need to declare oCheckButton8 outside the function. Inside ====== (function () { ... var oCheckButton8 = new Button("checkbutton8" .... Outside ======= var oCheckButton8; (function () { Regards, JK --- In ydn-javascript@..., Todd Kloots <kloots@...> wrote: > > JK - > > Button transforms all pre-existing markup into a new format (using > the <button> element) in order to provide a look and feel that is > consistent across Button types. For this reason, you need to use the > Button's API, not the DOM API for accessing any attributes as the > original markup provided (in your case, the <input>) element, isn't in > the DOM any longer. So that covers your points a and b. Not sure > about question c. Can you clarify your question? > > Thanks, > Todd > > On Nov 3, 2009, at 7:10 PM, hkjackpot wrote: > > > Todd, > > > > With your advise, I finally get the value, tks. > > > > I write my understanding here, may be can help other people, too. > > > > a. I create the button from markup of Checkbox field, but Checkbox > > Button is different from Checkbox input field. > > b. DOM can use to get value of Checkbox field, however not applicable > > for Checkbox Button. > > (But there is a question mark in my head, why there is different? > > And where can I find this information in the API or website?) > > c. The Example provided by yui, the variable Scope is in a function > > (local). > > > > JK > > --- In ydn-javascript@..., Todd Kloots <kloots@> wrote: > >> > >> JK - > >> > >> When using a YUI Button instance, you don't query the DOM for the > >> value, but rather the Button's "value" attribute via the get() > >> method. For example: > >> > >> var val = oCheckButton8.get("value"); > >> > >> - Todd > >> > >> On Nov 2, 2009, at 8:47 PM, hkjackpot wrote: > >> > >>> Hi, > >>> I use DOM to get the Checkbox Button value, but it returned as > >>> "undefined". > >>> Look like I am referring to not exist object. > >>> I can't find any hint from the YUI Library website. Could you please > >>> help me? Thanks in advance! > >>> regards, > >>> JK > >>> > >>> Below are the codes(Most of them from Checkbox Example): > >>> > >>> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" > > "http://www.w3.org/TR/html4/strict.dtd > >>> "> > >>> <html> > >>> <head> > >>> <meta http-equiv="content-type" content="text/html; charset=utf-8"> > >>> <title>Checkbox Buttons</title> > >>> <link rel="stylesheet" type="text/css" > > href="../../build/fonts/fonts- > >>> min.css" /> > >>> <link rel="stylesheet" type="text/css" href="../../build/button/ > >>> assets/skins/sam/button.css" /> > >>> <script type="text/javascript" src="../../build/yahoo-dom-event/ > >>> yahoo-dom-event.js"></script> > >>> <script type="text/javascript" src="../../build/element/element- > >>> min.js"></script> > >>> <script type="text/javascript" src="../../build/button/button- > >>> min.js"></script> > >>> </head> > >>> <body class="yui-skin-sam"> > >>> > >>> <div id="checkboxbuttonsfrommarkup"> > >>> > >>> <span id="checkbutton8" class="yui-button yui-checkbox-button"><span > >>> class="first-child"><button type="button" > >>> name="checkboxfield2">Four</button></span></span> > >>> > >>> <input type="button" id="buttonMe" name="buttonMe" value="Get > >>> CheckBox Button Value" onClick="getByDom()"> > >>> > >>> > >>> <script> > >>> (function () { > >>> var Button = YAHOO.widget.Button; > >>> YAHOO.util.Event.onContentReady("checkboxbuttonsfrommarkup", > >>> function () { > >>> > >>> function onButtonClick(p_oEvent) { > >>> alert("You " + this.get("checked")+ " info "+ this.get("id")); > >>> } > >>> > >>> var oCheckButton8 = new Button("checkbutton8", { type: "checkbox", > >>> value: "4" ,onclick: { fn: onButtonClick }}); > >>> }); > >>> > >>> }()); > >>> > >>> function getByDom(){ > >>> var Dom = YAHOO.util.Dom; > >>> var value=Dom.get('checkbutton8').value; > >>> alert(value); > >>> > >>> } > >>> </script> > >>> </body> > >>> </html> > >>> > >>> > >>> > >>> > >>> > >>> > >>> > >>> > >>> > >>> > >>> > >>> > >>> > >>> > >>> ------------------------------------ > >>> > >>> Yahoo! Groups Links > >>> > >>> > >>> > >> > > > > > > > > > > ------------------------------------ > > > > Yahoo! Groups Links > > > > > > >
	Re: Re: DOM cannot get Checkbox Button value by Todd Kloots :: Rate this Message: Reply to Author \| View Threaded \| Show Only this Message In that example I am simply declaring an anonymous function for the purpose of creating a scope to declare a variable (Button) that is an alias for YAHOO.widget.Button. So, if you want to create a Button instance outside that function scope, simply do so using the fully qualified reference: var oCheckButton8 = new YAHOO.widget.Button("checkbutton8"); - Todd On Nov 9, 2009, at 1:56 AM, hkjackpot wrote: > Todd, > > Sorry for my late reply! My point c was remark to help anybody who > looking for the issue too. In the example, oCheckButton8 is declared > inside the function; in case to access it outside the function. I > need to declare oCheckButton8 outside the function. > > Inside > ====== > (function () { ... > var oCheckButton8 = new Button("checkbutton8" .... > Outside > ======= > var oCheckButton8; > (function () { > > Regards, > JK > > --- In ydn-javascript@..., Todd Kloots <kloots@...> wrote: >> >> JK - >> >> Button transforms all pre-existing markup into a new format (using >> the <button> element) in order to provide a look and feel that is >> consistent across Button types. For this reason, you need to use the >> Button's API, not the DOM API for accessing any attributes as the >> original markup provided (in your case, the <input>) element, isn't >> in >> the DOM any longer. So that covers your points a and b. Not sure >> about question c. Can you clarify your question? >> >> Thanks, >> Todd >> >> On Nov 3, 2009, at 7:10 PM, hkjackpot wrote: >> >>> Todd, >>> >>> With your advise, I finally get the value, tks. >>> >>> I write my understanding here, may be can help other people, too. >>> >>> a. I create the button from markup of Checkbox field, but Checkbox >>> Button is different from Checkbox input field. >>> b. DOM can use to get value of Checkbox field, however not >>> applicable >>> for Checkbox Button. >>> (But there is a question mark in my head, why there is >>> different? >>> And where can I find this information in the API or website?) >>> c. The Example provided by yui, the variable Scope is in a function >>> (local). >>> >>> JK >>> --- In ydn-javascript@..., Todd Kloots <kloots@> wrote: >>>> >>>> JK - >>>> >>>> When using a YUI Button instance, you don't query the DOM for the >>>> value, but rather the Button's "value" attribute via the get() >>>> method. For example: >>>> >>>> var val = oCheckButton8.get("value"); >>>> >>>> - Todd >>>> >>>> On Nov 2, 2009, at 8:47 PM, hkjackpot wrote: >>>> >>>>> Hi, >>>>> I use DOM to get the Checkbox Button value, but it returned as >>>>> "undefined". >>>>> Look like I am referring to not exist object. >>>>> I can't find any hint from the YUI Library website. Could you >>>>> please >>>>> help me? Thanks in advance! >>>>> regards, >>>>> JK >>>>> >>>>> Below are the codes(Most of them from Checkbox Example): >>>>> >>>>> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" >>> "http://www.w3.org/TR/html4/strict.dtd >>>>> "> >>>>> <html> >>>>> <head> >>>>> <meta http-equiv="content-type" content="text/html; >>>>> charset=utf-8"> >>>>> <title>Checkbox Buttons</title> >>>>> <link rel="stylesheet" type="text/css" >>> href="../../build/fonts/fonts- >>>>> min.css" /> >>>>> <link rel="stylesheet" type="text/css" href="../../build/button/ >>>>> assets/skins/sam/button.css" /> >>>>> <script type="text/javascript" src="../../build/yahoo-dom-event/ >>>>> yahoo-dom-event.js"></script> >>>>> <script type="text/javascript" src="../../build/element/element- >>>>> min.js"></script> >>>>> <script type="text/javascript" src="../../build/button/button- >>>>> min.js"></script> >>>>> </head> >>>>> <body class="yui-skin-sam"> >>>>> >>>>> <div id="checkboxbuttonsfrommarkup"> >>>>> >>>>> <span id="checkbutton8" class="yui-button yui-checkbox- >>>>> button"><span >>>>> class="first-child"><button type="button" >>>>> name="checkboxfield2">Four</button></span></span> >>>>> >>>>> <input type="button" id="buttonMe" name="buttonMe" value="Get >>>>> CheckBox Button Value" onClick="getByDom()"> >>>>> >>>>> >>>>> <script> >>>>> (function () { >>>>> var Button = YAHOO.widget.Button; >>>>> YAHOO.util.Event.onContentReady("checkboxbuttonsfrommarkup", >>>>> function () { >>>>> >>>>> function onButtonClick(p_oEvent) { >>>>> alert("You " + this.get("checked")+ " info "+ this.get("id")); >>>>> } >>>>> >>>>> var oCheckButton8 = new Button("checkbutton8", { type: "checkbox", >>>>> value: "4" ,onclick: { fn: onButtonClick }}); >>>>> }); >>>>> >>>>> }()); >>>>> >>>>> function getByDom(){ >>>>> var Dom = YAHOO.util.Dom; >>>>> var value=Dom.get('checkbutton8').value; >>>>> alert(value); >>>>> >>>>> } >>>>> </script> >>>>> </body> >>>>> </html> >>>>> >>>>> >>>>> >>>>> >>>>> >>>>> >>>>> >>>>> >>>>> >>>>> >>>>> >>>>> >>>>> >>>>> >>>>> ------------------------------------ >>>>> >>>>> Yahoo! Groups Links >>>>> >>>>> >>>>> >>>> >>> >>> >>> >>> >>> ------------------------------------ >>> >>> Yahoo! Groups Links >>> >>> >>> >> > > > > > ------------------------------------ > > Yahoo! Groups Links > > >