Action after selected item

Dev Shed Forums Sponsor:

December 19th, 2012, 12:53 AM

a2370370

Registered User

Join Date: Dec 2012

Posts: 11

Time spent in forums: 7 h 25 m 59 sec
Reputation Power: 0

Action after selected item

Hello, I need to do something with my dropdown menu.

If an item with prefix BLUE is selected then show a text field, if any other item is selected show something else.

Also I need to make it as soon as they select an item, not after they submit a form.

Here is my dropdown menu so far:

PHP Code:


		
			
<select id="select1" name="selectz1">

<?php

$id = 0;

while ($row = mysql_fetch_row($result)) {

    echo "<option value=$id>$row[0]</option>";

    $id++;

}

?>

</select>

December 19th, 2012, 01:07 AM

aeternus

For POny!

Join Date: Apr 2012

Location: Amsterdam

Posts: 416

Time spent in forums: 5 Days 4 h 56 m 43 sec
Reputation Power: 114

Quote:

Also I need to make it as soon as they select an item, not after they submit a form.

You need javascript for that. PHP runs on the server.

__________________
PHP Tutorial

December 19th, 2012, 01:18 AM

a2370370

Registered User

Join Date: Dec 2012

Posts: 11

Time spent in forums: 7 h 25 m 59 sec
Reputation Power: 0

Yes it can be JS or any other language I just dont know how to go about it.

December 19th, 2012, 01:20 AM

aeternus

For POny!

Join Date: Apr 2012

Location: Amsterdam

Posts: 416

Time spent in forums: 5 Days 4 h 56 m 43 sec
Reputation Power: 114

Quote:

Originally Posted by a2370370

Yes it can be JS or any other language I just dont know how to go about it.

decent response..
have a read here: http://api.jquery.com/change/ first example (all you have to do is add an if clause)

Last edited by aeternus : December 19th, 2012 at 01:23 AM.

December 19th, 2012, 01:25 AM

a2370370

Registered User

Join Date: Dec 2012

Posts: 11

Time spent in forums: 7 h 25 m 59 sec
Reputation Power: 0

Ok, thanks for the reply.

I tried with jquery, but since I have 2 dropdown boxes it now echoes both selected values.

Here is the script Ive added:

jquery Code:

Original - jquery Code
<script> $("select").change(function () { var str = ""; $("select option:selected").each(function () { str += $(this).text() + " "; }); $("div").text(str); }) .change(); </script>

<script>
    $("select").change(function () {
          var str = "";
          $("select option:selected").each(function () {
                str += $(this).text() + " ";
              });
          $("div").text(str);
        })
        .change();
</script>

December 19th, 2012, 01:35 AM

aeternus

For POny!

Join Date: Apr 2012

Location: Amsterdam

Posts: 416

Time spent in forums: 5 Days 4 h 56 m 43 sec
Reputation Power: 114

Quote:

Originally Posted by a2370370

Ok, thanks for the reply.

I tried with jquery, but since I have 2 dropdown boxes it now echoes both selected values.

Here is the script Ive added:

jquery Code:

Original - jquery Code
<script> $("select").change(function () { var str = ""; $("select option:selected").each(function () { str += $(this).text() + " "; }); $("div").text(str); }) .change(); </script>

<script>
    $("select").change(function () {
          var str = "";
          $("select option:selected").each(function () {
                str += $(this).text() + " ";
              });
          $("div").text(str);
        })
        .change();
</script>

Than make the drop down Unique by giving it a class or id and use that uniqueness in the code

Code:

$("#unique").change(function () {

Code:

<select id="unique" name="etc">
...
</select>

December 19th, 2012, 01:37 AM

a2370370

Registered User

Join Date: Dec 2012

Posts: 11

Time spent in forums: 7 h 25 m 59 sec
Reputation Power: 0

Quote:

Originally Posted by aeternus

Than make the drop down Unique by giving it a class or id and use that uniqueness in the code

Code:

$("#unique").change(function () {

Code:

<select id="unique" name="etc">
...
</select>

Ok, thanks got it working now

Here is my code:

jquery Code:

Original - jquery Code
<div></div> <script> $("#select2").change(function () { var str = ""; $("#select2 option:selected").each(function () { str += $(this).text() + " "; }); $("div").text(str); }) .change(); </script>

<div></div>
<script>
    $("#select2").change(function () {
          var str = "";
          $("#select2 option:selected").each(function () {
                str += $(this).text() + " ";
              });
          $("div").text(str);
        })
        .change();
</script>

Now what I need to do is display an input field if an item with prefix Blue is selected and display some text if any other item is displayed, could you please help me with that?

December 19th, 2012, 01:39 AM

aeternus

For POny!

Join Date: Apr 2012

Location: Amsterdam

Posts: 416

Time spent in forums: 5 Days 4 h 56 m 43 sec
Reputation Power: 114

Quote:

Originally Posted by a2370370

Now what I need to do is display an input field if an item with prefix Blue is selected and display some text if any other item is displayed, could you please help me with that?

Did you even try to do it yourself?
What prefix you mean the Value or innerhtml of the option? Can you give a hard code example?

December 19th, 2012, 01:42 AM

a2370370

Registered User

Join Date: Dec 2012

Posts: 11

Time spent in forums: 7 h 25 m 59 sec
Reputation Power: 0

Quote:

Originally Posted by aeternus

Did you even try to do it yourself?
What prefix you mean the Value or innerhtml of the option? Can you give a hard code example?

Sorry, I have been trying myself many different ways to do this, now I ask for help.

I mean prefix as the name of the option selected.

Here is my while loop generated form:

Code:

<form action="ThisPage.php" method="POST">
Accounts: <br />
<select id="select1" name="selectz1">
<option value=0>account 2000-01</option><option value=1>account 2000-02</option>
<option value=2>blue 2000-03</option><option value=3>blue 2000-04</option><option value=4>other 2000-05</option>
<option value=5>new 2000-06</option>
</select>
</form>

I want to make it so that if user select item with prefix blue do that, if they select anything else show something else.

#10

December 19th, 2012, 01:59 AM

aeternus

For POny!

Join Date: Apr 2012

Location: Amsterdam

Posts: 416

Time spent in forums: 5 Days 4 h 56 m 43 sec
Reputation Power: 114

Quote:

Originally Posted by a2370370

Sorry, I have been trying myself many different ways to do this, now I ask for help.

You're right i totally missed that.

here is an if clause stick it anywhere you like...

javascript Code:

Original - javascript Code
if($(this).text().substring(0,4) == "blue"){ alert('trololol'); }else{ alert('no blue stuff'); }

 
if($(this).text().substring(0,4) == "blue"){
                        alert('trololol');
                    }else{
                        alert('no blue stuff');
                    }

P.s it does exactly what you need!
-edit: changed it a tiny bit

Last edited by aeternus : December 19th, 2012 at 02:12 AM.

#11

December 19th, 2012, 02:07 AM

a2370370

Registered User

Join Date: Dec 2012

Posts: 11

Time spent in forums: 7 h 25 m 59 sec
Reputation Power: 0

Ok yes

Thank you very much for all the help

Action after selected item

Developer Shed Advertisers and Affiliates