• 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 Pie Elite all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Jeanne Boyarsky
  • Ron McLeod
  • Paul Clapham
  • Liutauras Vilda
Sheriffs:
  • paul wheaton
  • Rob Spoor
  • Devaka Cooray
Saloon Keepers:
  • Stephan van Hulst
  • Tim Holloway
  • Carey Brown
  • Frits Walraven
  • Tim Moores
Bartenders:
  • Mikalai Zaikin

select option selected="selected". Who was the genius

 
ranger
Posts: 17347
11
Mac IntelliJ IDE Spring
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Sometimes I just want to smack the creator(s) of HTML for being morons. ;)

So, I will not be able to write any code to convert an enum value to be able to choice which of three options will be selected. And on top of that I am just returning json of my domain object with one property to hold that objects value from the enum. And I am using a templating engine which only gets values from the json. I would have to add a boolean for each option into my domain object to fulfill HTML for choosing a selected option.

Why doesn't it just have a value for all options, and you set that value to match the string for an option.

Rant over.

Mark
 
Mark Spritzler
ranger
Posts: 17347
11
Mac IntelliJ IDE Spring
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Oh, and because of that genius, causes me to spend at least 10 hours to create a hack around their problem.

Mark
 
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Two points;
  • In HTML5 it's just selected. The selected="selected" nonsense is an XHTML abomination.
  • The reason that selected is placed on individual options is that for a multi-select <select> elements more than one option can be selected. It's consistent with the way that checked is used on the checkboxes of checkbox groups and radio buttons of radio groups.
  •  
    author
    Posts: 15385
    6
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator

    Mark Spritzler wrote:Oh, and because of that genius, causes me to spend at least 10 hours to create a hack around their problem.

    Mark



    Typing with your toes?

    Eric
     
    Mark Spritzler
    ranger
    Posts: 17347
    11
    Mac IntelliJ IDE Spring
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator

    Eric Pascarello wrote:

    Mark Spritzler wrote:Oh, and because of that genius, causes me to spend at least 10 hours to create a hack around their problem.

    Mark



    Typing with your toes?

    Eric



    No, it is tough when you are jumping up and down excited while watching. Ohh, sorry, Don't want to bring that subject up. (But tomorrow night after E3, I will stay around that area which is right next to Staples Center.)

    Actually, it is searching the web for some kind of solution that I am spending so much time. But I haven't found a solution.

    Yeah, selected for multi selection is understandable, but I still should just be able to set the <select> value to some single String or Collection of Strings.

    Thanks

    Mark
     
    Bear Bibeault
    Sheriff
    Posts: 67746
    173
    Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator
    Well, with jQuery you can use the .val() method on the select element to set the value, but there's no way with just HTML markup.
     
    Mark Spritzler
    ranger
    Posts: 17347
    11
    Mac IntelliJ IDE Spring
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator

    Bear Bibeault wrote:Well, with jQuery you can use the .val() method on the select element to set the value, but there's no way with just HTML markup.



    But how would get reference to the one in the drop down that matches the String value and be able to call .val on it. That is the type of hack that I thought might be possible, but couldn't find one that would work with the template and json code returned. So I have json in an object, and I call ich('templateName') and that returns me html with my data in the template all done. So now I have a var that is referencing my entire form in html. I need to go down to the drop down, get all the elements and have to loop through them just to compare the strings, then I can set the val(). Definitely a hack in my mind, but if that is the only way.

    I know not to expect much with html, it is what it is.

    So How do I do that? would this work



    I mean I know that doesn't work, but what would need to change to get it to work?

    Thanks

    Mark
     
    Bear Bibeault
    Sheriff
    Posts: 67746
    173
    Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator

    Mark Spritzler wrote:But how would get reference to the one in the drop down that matches the String value and be able to call .val on it.


    You don't have to; you call .val() on the select element with the value that matches the option to be selected and jQuery takes care of the rest.

    If you want to find the selected option by hand (no reason to unless you really want to) then: $('#mySelect option[selected]'). Or to find an option with a matching value: $('#mySelect option[value="whatever"]').

    and have to loop through them just to compare the strings, then I can set the val(). Definitely a hack in my mind, but if that is the only way.


    No looping. See above.
     
    Mark Spritzler
    ranger
    Posts: 17347
    11
    Mac IntelliJ IDE Spring
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator
    Right, selectors. I have just been using the basics with id and class selectors, but nothing more than that.

    Thanks

    Mark
     
    Mark Spritzler
    ranger
    Posts: 17347
    11
    Mac IntelliJ IDE Spring
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator
    so calling val(), will set the option to be selected? I thought it just returned whether it was selected or not. I want to set selected to the option that matches the String. And how am I to pass the String if it is in json.

    here is now the line I have

    $('#visibility option[value="' + data.visibility = '"]').val();

    data is my json object.

    However, the drop down doesn't show the correct value selected. It still just selects the first option.

    No hurries, about to leave to go to E3, so will be gone till late, and probably won't get to this for a few days.

    Thanks

    Mark
     
    Bear Bibeault
    Sheriff
    Posts: 67746
    173
    Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator

    Mark Spritzler wrote:so calling val(), will set the option to be selected? I thought it just returned whether it was selected or not.


    As with many methods in jQuery, the method is overloaded. Called with no parameter, it returns the value of the element, Called with a parameter it sets the value.

    So if the id of the select element is mySelect, $('#mySelect').val() returns the value of whatever option is selected, while $('#mySelect').val('whatever') will cause the option whose value is "whatever" to be the selected option. No looping; easy peasy.

    I want to set selected to the option that matches the String. And how am I to pass the String if it is in json.


    I assume that the JSON has been parsed and is no longer a string but a JavaScript object. If not, the JSON must be parsed. Then you just use normal JavaScript syntax: $('#mySelect').val(myObject.somePropertyValue);

    here is now the line I have
    $('#visibility option[value="' + data.visibility = '"]').val();


    You're working too hard it's much easier than that. Again, no need to find the option. Just call val on the select element. jQuery handles the options.

    So if data.visibility has the value of the option you want to be selected, and visibility is the id of the select element (consider clearer names such as visibilityDropdown or some such), then it would be: $('#visibility').val(data.visibility)

    No hurries, about to leave to go to E3, so will be gone till late, and probably won't get to this for a few days.


    No worries. If you have more questions later, I'm here all week! (Er, month.... year.... century?)
     
    Mark Spritzler
    ranger
    Posts: 17347
    11
    Mac IntelliJ IDE Spring
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator
    Thanks Bear that's perfect. That is what I would have expected, but I actually never saw anyone post that answer after spending hours searching. Well, it was searching with Google, and these days Google search never gives you what you are looking for anymore.

    "consider clearer names such as visibilityDropdown"

    I understand what you are saying. The reason I like visibility better is because it is the property of my domain object.

    I was never a fan of variable/method name prefixes like __construct() in php, or gs_someGlobalString.

    Mark

     
    Mark Spritzler
    ranger
    Posts: 17347
    11
    Mac IntelliJ IDE Spring
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator
    Of course, now I see I have another problem. But I think I can resolve it by adding a toString method to my enum. Because the json data has the enum names, but the dropdown has prettier proper case with no underscore. So they don't match. ;)

    Mark
     
    Mark Spritzler
    ranger
    Posts: 17347
    11
    Mac IntelliJ IDE Spring
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator
    I didn't give the select an id. I had just name="visibility". So now it all works.

    Thanks

    Mark
     
    Bear Bibeault
    Sheriff
    Posts: 67746
    173
    Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator
     
    I love a good mentalist. And so does this tiny ad:
    a bit of art, as a gift, the permaculture playing cards
    https://gardener-gift.com
    reply
      Bookmark Topic Watch Topic
    • New Topic