Win a copy of 97 Things Every Java Programmer Should Know this week in the Java in General forum!
  • Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Paul Clapham
  • Jeanne Boyarsky
  • Junilu Lacar
  • Henry Wong
Sheriffs:
  • Ron McLeod
  • Devaka Cooray
  • Tim Cooke
Saloon Keepers:
  • Tim Moores
  • Stephan van Hulst
  • Frits Walraven
  • Tim Holloway
  • Carey Brown
Bartenders:
  • Piet Souris
  • salvin francis
  • fred rosenberger

Refactor repeating function of custom radio buttons

 
Greenhorn
Posts: 7
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I found this code on a tutorial site that I wanted to use for some custom radio buttons. The example is excellent and works very well. Trouble is, I need several radiobutton sets with unique names. I have found that I am repeating the function each time and calling the function several times passing different arguments and revising the function names. Could someone help me refactor this code so I don't have to keep repeating it like I'm doing? I think I should create an object but I'm not sure how to get started with it. I would have asked on the website, but I could not find a forum, but I did send an email. If I get an answer, I will post here. Meantime, I appreciate everyone's help here. Thanks.

HTML


Javascript
 
Bartender
Posts: 1845
10
  • Likes 1
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Ok, so you have copied/pasted the function four times.
And changed the variable names within each one.
You don't need to.
Having that function once should be sufficient.
You then call it once for each set of radio buttons you want on the page.
So delete customRadio2, customRadio3 and customRadio4 and you would have equivalent code with :

That is the whole point of a function. You write it once, and just reuse it.

Now taking a step back, and looking at your HTML
Do you really have several radio button sets with unique names?
Your example shows four radio buttons, each with their own name. But each "set" only consists of one radio button - what is the point of them then?

Are these radio buttons meant to be all one set in and of themselves, and you just have four options within this set? If so then you need to give all of them the same name (but different values)
 
Sheriff
Posts: 67403
173
Mac Mac OS X IntelliJ IDE jQuery Java
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
What prevents you from using the first function and simply passing in the various radio group names?

[Edit: posted before I saw Stefan's response]
 
Chris Disilva
Greenhorn
Posts: 7
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator

Stefan Evans wrote:Ok, so you have copied/pasted the function four times.
And changed the variable names within each one.
You don't need to.
Having that function once should be sufficient.
You then call it once for each set of radio buttons you want on the page.
That is the whole point of a function. You write it once, and just reuse it.

Now taking a step back, and looking at your HTML
Do you really have several radio button sets with unique names?
Your example shows four radio buttons, each with their own name. But each "set" only consists of one radio button - what is the point of them then?

Are these radio buttons meant to be all one set in and of themselves, and you just have four options within this set? If so then you need to give all of them the same name (but different values)


Thank you, Stefan. Yes, you are right, I have a typo here in my example code, however, in the html I am using the same "name" attribute for each set. My apologies -- I will update my code above. So I do have to call the customRadio(arg) function each time for each radio button set? I do have to swap out images for a different custom radio button, so I'll need to add the revised function that uses the new CSS classes to swap. So I would have:
Is this correct?
 
Greenhorn
Posts: 1
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator

Chris Disilva wrote:I found this code on a tutorial site . . .




Find the custom radio button
 
Marshal
Posts: 69477
277
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Welcome to the Ranch Did you write the toggle switch code yourself?
 
I would challenge you to a battle of wits, but I see you are unarmed - shakespear. Unarmed tiny ad:
Devious Experiments for a Truly Passive Greenhouse!
https://www.kickstarter.com/projects/paulwheaton/greenhouse-1
    Bookmark Topic Watch Topic
  • New Topic