Smart questions
Smart answers
Smart people
INTELLIGENT WORK FORUMS
FOR COMPUTER PROFESSIONALS

Member Login
Remember Me
Forgot Password?
Join Us!

Come Join Us!

Are you a
Computer / IT professional?
Join Tek-Tips now!
  • Talk With Other Members
  • Be Notified Of Responses
    To Your Posts
  • Keyword Search
  • One-Click Access To Your
    Favorite Forums
  • Automated Signatures
    On Your Posts
  • Best Of All, It's Free!
Join Tek-Tips
*Tek-Tips's functionality depends on members receiving e-mail. By joining you are opting in to receive e-mail.

LINK TO THIS FORUM!

Add Stickiness To Your Site By Linking To This Professionally Managed Technical Forum.
Just copy and paste the
code below into your site.

Tek-Tips LinkedIn® Group

Partner With Us!

"Best Of Breed" Forums Add Stickiness To Your Site
Partner Button
(Download This Button Today!)

Feedback

"...I'm so glad I found this site... Now I can get some sleep, because my problem is solved..."
More...

Geography

Where in the world do Tek-Tips members come from?
Click Here To Find Out!

Tek-Tips Shirts!

Get Tek-Tips Swag
Get your
Tek-Tips Forums
SWAG here!
Home > Forums > Programmers > Web Development > Javascript Forum

return a select box option text value rather than its numeric valueHelpful Member! 

thread216-1685110
Read More Threads Like This One
mbarandao (Programmer)
6 Jun 12 13:06
Hello:

I'm trying to obtain the text value of the select box instead of its numeric value. I have a pair of cascading select boxes which are structured in the following sql:

CODE -->

$r = mysql_query("SELECT sc.cat_id, sc.category_label, ss.cat_id, ss.item_id, ss.subcat_label, ss.invt, ss.product_desc, ss.invt, ss.qty, ss.cost FROM service_cat AS sc INNER JOIN service_subcat AS ss ON sc.cat_id = ss.cat_id ORDER BY sc.category_label, ss.subcat_label"); if(mysql_num_rows($r)){ $dd1 = "<select name=\"categories[]\" class=\"categories\" style=\"color:#003399; text-align:justify; font-size:1.0em; border-left: none; border-right: none; border-bottom: none\"><option value=\"0\">--Select One--</option>"; $catname = ''; while($d = mysql_fetch_array($r)){ if($catname != $d['category_label'])$dd1.= "<option value=\"{$d['cat_id']}\">{$d['category_label']}</option>"; $array[$d['cat_id']][$d['item_id']] = array('subcat_label'=>$d['subcat_label'], 'invt' =>$d['invt'], 'product_desc' =>$d['product_desc'], 'qty'=>$d['qty'], 'cost'=>$d['cost']); $catname = $d['category_label']; } $dd1 .= "</select>"; } $arr = json_encode($array);

the html output is something like this:

CODE -->

<select name="categories[]" class="categories" ><option value="0">--Select One--</option><option value="2">BRAKE SYSTEMS</option>.....</select>


After submit and based on the code above, I need to be get text Value "BRAKE SYSTEMS: rather than "2". Unfortunately, I cannot make the <option></option> value equal to the text value as my entire cascading effect is dependent on the numeric value of the first select box.

Can anyone help with a suggestion on how I can get the text value during post?
Best,
Helpful Member!  vacunita (Programmer)
6 Jun 12 14:04
I would add a hidden input, and set its value to the text of the dropdown onchange. That way you can recover the value in your server side script (PHP by the looks of it) from the hidden input rather than the dropdown.

CODE

<select ... onchange="document.getElementById('cattext').value = this.options[this.selectedIndex].text;">...</select> <input type='hidden' name='categoriesText' id='cattext' value=''>

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech

mbarandao (Programmer)
6 Jun 12 15:11
vacunita, that is an excellent idea. This works great for one select box and its chained linked equivalent. Now suppose, my form offers the option of adding additional select boxes --dynamically, how would I capture those added dynamically? For visual understanding entirety of my form, here is a

Link

Again, thank you for that idea!
vacunita (Programmer)
6 Jun 12 16:58
2 ways I see. Concatenate the following values onto the text box value so you get a list separated by commas maybe; or make the the hidden element an array, that is create the hidden input as you do the select, and give it an incremental id you can then pass to the getElementById so you can alter the value of the correct hidden input.

CODE

<input type=hidden id='row1'> <input type=hidden id='row2'> ...

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech

mbarandao (Programmer)
6 Jun 12 20:06
thank you Vacunita. Got it resolved! following your suggestion, I did the following:

solution:



CODE

<input type='hidden' name='categoriesText[]' class='cattext' value=''> <input type='hidden' name='sub_categoriesText[]' class='sub_cattext' value=''>


and jquery for my pair of select boxes

CODE -->

.on('change', '.categories', function() { ... $row.find(".cattext").val($this.find("option:selected").text()); ... }); and .on('change', '.service_subcat', function() { ... $row.find(".sub_cattext").val($this.find("option:selected").text()); ... });

Thank you!
vacunita (Programmer)
6 Jun 12 21:02
Glad you got it to work.

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech

Read More Threads Like This One

Reply To This Thread

Posting in the Tek-Tips forums is a member-only feature.

Click Here to join Tek-Tips and talk with other members!

Back To Forum

Back To Javascript

Close Box

Join Tek-Tips® Today!

Join your peers on the Internet's largest technical computer professional community.
It's easy to join and it's free.

Here's Why Members Love Tek-Tips Forums:

Register now while it's still free!

Already a member? Close this window and log in.

Join Us             Close