Word Wrap Muliple Selection Box

  • jordonshaw
  • Student
  • Student
  • User avatar
  • Posts: 96
  • Loc: Tennessee

Post 3+ Months Ago

I'm creating a form that has a multiple selection box. The options are generated by a PHP script that runs a query of my Database. This issue that I'm having is sometimes I have short options and others I have really long options, the problem is, I'm limited on how wide my selection box can be. I'm looking for a way to have the option automatically word wrap, once it gets to my width that I have specified. Is this possible?

Thanks,
Jordon
  • devilwood
  • Silver Member
  • Silver Member
  • User avatar
  • Posts: 437

Post 3+ Months Ago

Might look into wordwrap() but I'm not sure how that will work with <select> options. I'm not sure how you'd get double-lined option text, but that is what you have to find out how to do. I don't think a <br> or \n will break the text. You may have to truncate the text and add ellipsis if that is something you can go with which would be easy to do with php on the data coming out of the db. I'll keep seeing what I can dig up.
  • jordonshaw
  • Student
  • Student
  • User avatar
  • Posts: 96
  • Loc: Tennessee

Post 3+ Months Ago

Thank you for your help! I tried the /n and br, they didn't seem to work
  • jordonshaw
  • Student
  • Student
  • User avatar
  • Posts: 96
  • Loc: Tennessee

Post 3+ Months Ago

I tried wordwrap() and that didn't work. I don't have to have it auto wrap, I just have to have a way to break to a different line, is there anyway possible? Does anybody know?
  • devilwood
  • Silver Member
  • Silver Member
  • User avatar
  • Posts: 437

Post 3+ Months Ago

Yeah, it seems the problem isn't breaking the string, but displaying a mutli-line select->option via HTML. I don't believe I've ever done such and I'm not finding anything in my html references. Maybe someone else will chime in with some info. At the very least to say if it's even possible or not with a dropdown to have an option description use two lines. I'll do some trial and error when I get a chance maybe with some css or java.
  • jordonshaw
  • Student
  • Student
  • User avatar
  • Posts: 96
  • Loc: Tennessee

Post 3+ Months Ago

Well, I didn't exactly find an answer to a line break; however, I did find a way to group inside a selection box, which allows me to basically have a heading with a selection under it, which creates a line break. It will work for now; however, here is an example:

Code: [ Select ]
<P>Which Web browser do you use most often?
<SELECT NAME=browser>
    <OPTGROUP LABEL="Firefox">
     <OPTION LABEL="2.0 or higher">
        Firefox 2.0 or higher
     </OPTION>
     <OPTION LABEL="1.5.x">Firefox 1.5.x</OPTION>
     <OPTION LABEL="1.0.x">Firefox 1.0.x</OPTION>
    </OPTGROUP>
    <OPTGROUP LABEL="Microsoft Internet Explorer">
     <OPTION LABEL="7.0 or higher">
        Microsoft Internet Explorer 7.0 or higher
     </OPTION>
     <OPTION LABEL="6.x">Microsoft Internet Explorer 6.x</OPTION>
     <OPTION LABEL="5.x">Microsoft Internet Explorer 5.x</OPTION>
     <OPTION LABEL="4.x">Microsoft Internet Explorer 4.x</OPTION>
    </OPTGROUP>
    <OPTGROUP LABEL="Opera">
     <OPTION LABEL="9.0 or higher">Opera 9.0 or higher</OPTION>
     <OPTION LABEL="8.x">Opera 8.x</OPTION>
     <OPTION LABEL="7.x">Opera 7.x</OPTION>
    </OPTGROUP>
    <OPTION>Safari</OPTION>
    <OPTION>Other</OPTION>
</SELECT>
</P>
  1. <P>Which Web browser do you use most often?
  2. <SELECT NAME=browser>
  3.     <OPTGROUP LABEL="Firefox">
  4.      <OPTION LABEL="2.0 or higher">
  5.         Firefox 2.0 or higher
  6.      </OPTION>
  7.      <OPTION LABEL="1.5.x">Firefox 1.5.x</OPTION>
  8.      <OPTION LABEL="1.0.x">Firefox 1.0.x</OPTION>
  9.     </OPTGROUP>
  10.     <OPTGROUP LABEL="Microsoft Internet Explorer">
  11.      <OPTION LABEL="7.0 or higher">
  12.         Microsoft Internet Explorer 7.0 or higher
  13.      </OPTION>
  14.      <OPTION LABEL="6.x">Microsoft Internet Explorer 6.x</OPTION>
  15.      <OPTION LABEL="5.x">Microsoft Internet Explorer 5.x</OPTION>
  16.      <OPTION LABEL="4.x">Microsoft Internet Explorer 4.x</OPTION>
  17.     </OPTGROUP>
  18.     <OPTGROUP LABEL="Opera">
  19.      <OPTION LABEL="9.0 or higher">Opera 9.0 or higher</OPTION>
  20.      <OPTION LABEL="8.x">Opera 8.x</OPTION>
  21.      <OPTION LABEL="7.x">Opera 7.x</OPTION>
  22.     </OPTGROUP>
  23.     <OPTION>Safari</OPTION>
  24.     <OPTION>Other</OPTION>
  25. </SELECT>
  26. </P>
  • devilwood
  • Silver Member
  • Silver Member
  • User avatar
  • Posts: 437

Post 3+ Months Ago

Excellent. I figured it was going to some sort of work around using sometype of sub-sub menu and just kill the last option as active so it's just static text. It adds a little extra html but if you dynamically building the <select> option with php then it should be one in the same.

Post Information

  • Total Posts in this topic: 7 posts
  • Users browsing this forum: No registered users and 57 guests
  • 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
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.