PHP - get data from select box without the value

Question

I'm having a bit of a confusing question but hopefully you'll get what I mean:

In my website I'm trying to implement a select box which is updated based on the value from a previous select box. For that I'm using a javascript that takes the values. For example an option from the select box looks like this:

<option value="22"> Apple </option>

I need the value in order to filter the select boxes but in my PHP script I need to get that 'Apple' text. Is there a way to do that?

Sorry for the noob question but web development is new for me.

Edit:

This is the java script I'm using for filtering the second select box:

$("#select1").change(function() {
                           if ($(this).data('options') == undefined) {
                               /*Taking an array of all options-2 and kind of embedding it on the select1*/
                               $(this).data('options', $('#select2 option').clone());
                           }
                           var id = $(this).val();
                           var options = $(this).data('options').filter('[value=' + id + ']');
                           $('#select2').html(options);
                       });

If I try to change this 'value' in the filter function to some other attribute it doesn't work for some reason. I don't know JavaScript at all.

you question is not clear enough, please improve it by adding examples . — MaveRick, Aug 22 '13 at 10:10
preg_match and regex are the keywords, to find everything inside tags otherwise to get value 22 you can get it by $_POST['fruit'] and setting — Wiggler Jtag, Aug 22 '13 at 10:11
why dont you give and id or name to the option instead a value?? Like that why you can use the '22' with the name and get the value on PHP with $_POST['22']; — Tiago, Aug 22 '13 at 10:12
The short answer is no. The text is not passed back to the server, only the value. See tobspr's answer for how to retool. — Anthony, Aug 22 '13 at 10:14

score 1 · Answer 1 · answered Aug 22 '13 at 10:11

1

Try this

var pName = document.getElementById('selectname');

var name = pName.options[pName.selectedIndex].text;

Send the name value to your php script by hidden form field or ajax request, It will contain the text of the option

answered Aug 22 '13 at 10:11

Voonic

4,667
3
27
58

tobspr · Answer 2 · 2013-08-22T10:24:15.803

1

The Apple is not passed to the server, only your value, in this case 23. You can see that when you change your formular method to GET, it will look like script.php?some_select=23.

Two solutions to solve it:

The first one (the easy one) would be:

<option value="Apple" data-filterid="22"> Apple </option>

And in your js:

var options = $(this).data('options').filter('[data-filterid=' + id + ']');

So you get Apple in your php script instead of 22. You could then filter it in javascript by accessing data-filterid instead of value.

The second solution would be to store an associative dictionary which maps the value to the number, e.g.:

<?php
   $mapped = array(22 => "Apple",  23=>"Orange");
   $value = $mapped[$_GET['option_name']];

edited Aug 22 '13 at 10:24

answered Aug 22 '13 at 10:11

tobspr

8,200
5
33
46

That looks ok but the JavaScript doesn't work with data-filterid. I've updated the question so you can see what it is exactly. Thanks for your response though! – Asdwq Qwksf Aug 22 '13 at 10:23
the line above had to be changed as well to: var id = $('#select1 option:selected').data('filterid'); But anyways thanks for the help. – Asdwq Qwksf Aug 22 '13 at 10:59

score 1 · Answer 3 · answered Aug 22 '13 at 10:17

1

try this

function getSelectedText(elementId) {
    var elt = document.getElementById(elementId);

    if (elt.selectedIndex == -1)
        return null;

    return elt.options[elt.selectedIndex].text;
}

var text = getSelectedText('test');

or

this.options[this.selectedIndex].innerHTML

answered Aug 22 '13 at 10:17

Tushar Gupta

15,504
1
29
47

JS function appears to be from [Sean Bright's post](http://stackoverflow.com/questions/610336/javascript-retrieving-the-text-of-the-selected-option-in-select-element/610344#610344) – Jon Clements Mar 05 '14 at 12:33

score 1 · Answer 4 · answered Aug 22 '13 at 10:21

fruits_array.php

<?php
$fruits= array(
22 => 'apple' ,
23 => 'orange'
);

form_handler.php

if( isset($_POST['chosen_fruit']) && (int)$_POST['chosen_fruit'] > 0 ){
include 'fruits_array.php';
echo you chose ' . $fruits[$_POST['chosen_fruit'];
}

pick_your_fruit.php

<form action='form_handler.php' method= POST>
<select name='chosen_fruit'>
<?php
include 'fruits_array.php';

foreach($fruits as $key=$fruit)
echo '<option value=' . $key . '>' . $fruit .'</option>' . PHP_EOL ; 
?>
<input type=submit />
</form>

Give this a try. Maintain an array of fruit in one place. Include it where you need it. If necessary that array could be from a database.

Use the array to

generate the form elements
generate the message

But, essentially, transferring the number of the key between the form and the form handler eases the thorny question of validating the incoming data.

DRY. Dont Repeat Yourself. Now if you have 99 fruit, and you add another, you only add it in one place.

(the main thing missing is the handling of a fruit number which does not exist, which probably means someone is tampering with you input form, leave that for another question, eh?)

score 1 · Answer 5 · answered Aug 22 '13 at 10:21

Try like this

<form method="post" action="getvalue.php">
    <select name="fruit">
        <option value="">select the option</option>
        <option value="1">Apple</option>
        <option value="2">Banana</option>
        <option value="3">Mango</option>
    </select>
</form>


<?php
$option = array('1'=>'Apple','2'=>'Banana','3'=>'Mango');
echo $option[$_POST['fruit']];

?>

PHP - get data from select box without the value

5 Answers5