[ 4 posts ]

sankaravadivel sivarajan

  • Username: sansun08
  • Joined: Sun Dec 26, 2010 2:59 am
  • Posts: 10
  • GitHub: sansun08
  • Gists: sansun08
  • IRC: sansun08
  • Offline
  • Profile
Tags:

setting id to a form field

Post Posted: Sun Jun 05, 2011 11:37 am
+0-
I have just started exploring yui 3 form. I wanted to set id(will call it as userName) for TextField. But the id I gave, gets set for the div containing the field while the actual fields id look like "userName-field'. I don't want this. What should I do to make the id of TextField to userName.

Any help appreciated.

Juan Ignacio Dopazo

YUI Contributor

  • Username: jdopazo
  • Joined: Fri Oct 02, 2009 5:39 am
  • Posts: 620
  • Location: Buenos Aires, Argentina
  • Twitter: juandopazo
  • GitHub: juandopazo
  • Gists: juandopazo
  • Offline
  • Profile

Re: setting id to a form field

Post Posted: Sun Jun 05, 2011 7:00 pm
+0-
Well, the 'id' attribute that you set when doing new Y.TextField({ id: 'someid' }) is the id defined in the Widget class. It will be set by the Widget class as the id of the boundingBox.

The gallery Form utility is always adding the "-field" suffix to the id of the input node. That's a convention defined by the Form utility. You can change the suffix by changing the Y.FormField.FIELD_ID_SUFFIX property or you can change the id of the field node after it's been rendered by doing
Code:
field._fieldNode.set('id', 'myid')

However, I don't think that would be a good practice. I'd definitely file a bug/enhancement request for an attribute that allows you to set the id of the input.

Greg Hinch

YUI Contributor

  • Username: greghinch
  • Joined: Wed Jun 03, 2009 10:49 am
  • Posts: 73
  • Location: Fairfax, CA , USA
  • Twitter: greghinch
  • GitHub: ghinch
  • Gists: ghinch
  • IRC: gr-eg
  • Offline
  • Profile

Re: setting id to a form field

Post Posted: Tue Jun 07, 2011 4:31 pm
+0-
So my thoughts on the subject are like this. The Form module should provide you an API for interacting with the field via javascript (get the Y.FormField instance to do this). The ID of the Widget bounding box for the field should allow you to target the input node for CSS. In favor of simplicity I forgo allowing you to set the ID of the specific input node directly. If you can give me a case where you would need to control the ID of the input node, I am open to hearing it, though I may offer up a different solution.

sankaravadivel sivarajan

  • Username: sansun08
  • Joined: Sun Dec 26, 2010 2:59 am
  • Posts: 10
  • GitHub: sansun08
  • Gists: sansun08
  • IRC: sansun08
  • Offline
  • Profile
Tags:

Re: setting id to a form field

Post Posted: Thu Jun 09, 2011 9:27 am
+0-
Thanks Juan and Greg.

Firstly, I should say the reason for me posting this question. I was trying to obtain the values of form fields on the server code. I just set the id for a TextField component and forget to specify the name. I was trying to get the parameter using id and it was null. So I just looked at the html in firebug and found out that the id that I gave for TextField was set to the bounding box and not the actual html element while the id for the text field element was myid-field. Without realizing that I was not setting the name I posted this question. So this came out due to bug on my code. Once I set the name everything worked fine.

I agree with Greg's theory of setting id to the bounding box and not the actual html field. I definitely do not have a compelling use-case to have an option to be able to set id directly for html element.

Sorry for posting a dumb question. But nonetheless, the replies from you guys helped me understand a lot of things.
  [ 4 posts ]
Display posts from previous:  Sort by  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum