JS PHP passing variable onchange in select drop down menu

[xpace]

Hi all,

 

I've searched the whole web, I found similar questions but I can't find the right solutions.  :'(

here is the code (in simpler form) that I'm trying to make :

 

function registration() {
<form name = 'x' action='' method='POST'>
<select name='trade' onchange='submit.form'>
<option value=1>item1</option>
<option value=2>item2</option>
<option value=3>item3</option>
<option value=4>item4</option>
</select>
<div id='extra'>variable passed upon selection</div>
<input type='submit' name='save_form' value='register'>
</form>
}

 

Now:

The form function is working 100%, I just need to integrate some JS into it which sends one or two variables upon making selection.

the main variable would be value from selection that will be used in the hidden area <div id='extra'></div> and the other one really can be anything, it might be used for separating some other functions/values if needed

 

can anyone help ?

 

thanks a lot

[rhodesa]

I'm confused why you have function code around this?

 

so, you just want the value to be put into the DIV when it's changed?

<form name="x" action="" method="POST">
  <select name="trade" onchange="document.getElementById('extra').innerHTML = this.value;">
    <option value="1">item1</option>
    <option value="2">item2</option>
    <option value="3">item3</option>
    <option value="4">item4</option>
  </select>
  <div id="extra">Your selection will apear here</div>
  <input type="submit" name="save_form" value="register">
</form>

[xpace]

Hi there,

 

the function is there for a reason because of variables checking, but anyway, thanks for the input, I'll try that and let you know

 

cheers

 

[rhodesa]

Hi there,

 

the function is there for a reason because of variables checking, but anyway, thanks for the input, I'll try that and let you know

 

cheers

 

it's just not valid code. is it supposed to be a PHP function or a JS function?

[xpace]

the script is 100% PHP, I just needed that function and I think the only way was some JS integration.

function meaning the pHP function and JS function integration is the one I need for posting the value

I hope I'm clear

 

all is working but can I put that walue into some variable so I can use it ?

one last thing I forgot to mention is that the div should be hidden until the item is picked from the selection, Is it possible to do it some simple way or is it too much hustle ?

[rhodesa]

what kind of variable? a php variable?

 

...just don't have anything in the DIV...i just left the "Your selection will apear here" text to show how it worked

[xpace]

yes, I need a php variable for example $selected_item, and that will be the value of the selected item

and that should be used in that div

 

[rhodesa]

ok....we need to have a talk about client and server side code

 

PHP is server side code. When the client's browser calls for the page, the server takes the PHP file and runs it through the PHP parser. The PHP code does it's thing and spits out a bunch of text and sends it to the client. The contents of this can be seen by doing a view source on the page in your browser.

 

Then, the client receives all that text and runs it turns it into the HTML/CSS/JavaScript that you see in visual form on your browser. Now that the page is loaded, only client side actions can occur, which means no more PHP. You can pass data back to the server (so PHP can do something with it), but you will need to make another request (either via a page refresh, form post, or ajax call).

 

That being said, from what I understand, you don't need to pass the value back to PHP. Is there a reason PHP would need the value of that SELECT? Or does the value of the select just need to be displayed inside that DIV?

[xpace]

Hey,

 

I'm sure I'm not being perfectly clear about this code. I know what PHP does and I know what JS does at least 90% 

 

I just need that value from the selection and put it into a variable $anything(PHP variable) so after I get it I will call a PHP function to process this variable.

I'm not sure yet if it is possible this way but I don't see why not

Maybe I wasn't very clear about this JS you trying to get for me. It should also submit the form as I mentioned in the first post. but then I was thinking to open the DIV to see it. maybe that has given you and now me bit of confusion.

I know it's not going to be that simple but I'm also sure it can't be that difficult.

 

thanks a lot

I appreciate your help with my dumb brain. it's past midnight here, so it's bit difficult to think clearly LOL

[xpace]

Here is another idea:

 

when item is selected, form will be submitted onchange and value from the selection + my variable that I will call "$nocheck" with value = 1 will be passed

is that possible ?

because when I submit my form now I have an error checking procedure, and if it finds errors it will call this form again. so avoiding the error check will give a client peace in filling the other fields of teh form.

 

thanks

[rhodesa]

Ok, if you want PHP to do something with the variable, you need to make another request. If you are ok with the page submitting, You can do this:

<form name="x" action="" method="GET">
  <select name="trade" onchange="this.form.submit();">
    <option value="1">item1</option>
    <option value="2">item2</option>
    <option value="3">item3</option>
    <option value="4">item4</option>
  </select>
<div id="extra"><?php
  if(isset($_GET['trade'])){
    echo "You selected ".$_GET['trade'];
  }
?></div>
</form>

...I changed it to GET instead of POST, so if the user hits refresh they are presented with that annoying "Do you want to resubmit the data" prompt.

 

If you don't want the page refreshed, you can do it with AJAX. With this method, you can make a background request with JavaScript to the server, the server will return something, and then you can put that inside the DIV. Let me know if that is the route you want to go...

 

edit: ah, THAT is your problem. You could do that...you would need a hidden form field, that get's set on the onchange before the form is submitted....but I think the AJAX would be the better way to go....i'll post an example in a sec

[rhodesa]

<?php
  if(isset($_GET['trade'])){
    //Everything in here will get echoed in the DIV
    echo "You selected: ".$_GET['trade'];
    exit;
  }
  if($_SERVER['REQUEST_METHOD'] == 'POST'){
    //For debugging
    print_r($_POST);
    
    //Your error checking goes here
    
    //Once validated, so whatever
    
    exit;
  }
?>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<form name="x" action="" method="POST">
  Some Text Box: <input type="text" name="some_text" /><br />
  Our Select Box: <select name="trade" onchange="$('#extra').load('?trade='+this.value);">
    <option value="1">item1</option>
    <option value="2">item2</option>
    <option value="3">item3</option>
    <option value="4">item4</option>
  </select>
  <div id="extra" style="color:red;"></div>
  Another Text Box: <input type="text" name="another_text" /><br />
  <input type="submit" value="register">
</form>

[xpace]

hey,

 

that was a quick one thanks

 

but it doesn't work

 

how about submitting form with passing just that value. I'm just confused, because the script is quite complicated to put the ajax in.

I would have to rewrite it all over again, and that's a big NO

it's a 500 lines of code that just works like a charm, of course without this selection I want.  :'(

[xpace]

Hang on,

 

I'm getting something

not perfect something but something.

give me a sec

 

[rhodesa]

ajax is really the best way to go here...if you post your whole file, i can probably show you how to work it in...and maybe show you how to clean up some of the other code

 

[xpace]

Hey,

 

OK I got it working with partial code of yours.

but there is another thing. I need to keep those values or that value from selection to future submits of the form. any way of doing that. I think I would find the way, but I obviously you'll have the answer in few seconds 

 

I can post you the code, but it's confidential even though it's not from professional  :-\ and it's still a work version 

[rhodesa]

can you clarify?

 

do you mean, when the page is posted and there is a validation error or something...it needs to show what it did before?

 

or do you mean, i fill out the form, submit it successfully, and navigate somewhere else. i then navigate to the form again...at this point, the select box and div should be filled in the same as before.

[xpace]

the first option. let's say you have fields to fill in:

name

surname

address

x

x

x

and here you have drop down list of items (you pick -  airconditioning) after your pick it will run your ajax script and show this below:

 

comercial

residential

services

sale

 

and then you have

 

please provide details "textbox"

 

and so on and on and on

 

when you press NEXT, which is a submit button, it will check if you have filled in all the details in correct format and if you are not trying to hack the site.

when the script finds the problem or missing field it will come back (reloads the form with correct details you have provided previously, including those values called via  ajax script, asking you to finish it)

then you press next again and if everything is clear it will come up with the same form with all the details plus CAPTCHA box and instead of NEXT button you have REGISTER button.

 

so that's why I have to keep thatvalue somewhere

 

[xpace]

comercial

residential

services

sale

 

 

these will be checkboxes so those that are selected will need to stay selected until you press register

 

man thanks a lot for now I have to go to bed as it's 1:30 am, need to wake up about 6 so time to go.

 

if you come up with something, please let me know

 

again thanks

 

[rhodesa]

well...the PHP code that is run when the AJAX call is made...put that in a function...like this:

function make_checkboxes ( $select_value, $checked_values = array() ) {
  
}

In there, generate what needs to go in the DIV and either return it as a string or just echo it out directly. Assume $select_value is the value from the select box and $checked_values is an array of which which checkboxes should be pre-selected

 

Then, in the block of PHP code that gets run by the AJAX, use the function:

echo make_checkboxes($_GET['trade']);

since nothing is pre-checked, you only need one argument

 

Then, in the code to display the form, when echoing the SELECT box, make sure you use the $_POST value to determine which SELECT item should be pre-selected (you should have this). Then, in the DIV, if there is a POST, go ahead and use the function from above to show the checkboxes:

echo '<div id="extra">';
if($_POST)
  echo make_checkboxes($_POST['trade'],$_POST['checkboxes']);
echo '</div>';

where 'checkboxes' is the name of the INPUT used for the checkboxes

[xpace]

well...the PHP code that is run when the AJAX call is made...put that in a function...like this:

Code: [select]

function make_checkboxes ( $select_value, $checked_values = array() ) {

 

}In there, generate what needs to go in the DIV and either return it as a string or just echo it out directly. Assume $select_value is the value from the select box and $checked_values is an array of which which checkboxes should be pre-selected

You lost me on this one

 

Then, in the block of PHP code that gets run by the AJAX, use the function:

Code: [select]

echo make_checkboxes($_GET['trade']);since nothing is pre-checked, you only need one argument

I think I understand this bit

 

Then, in the code to display the form, when echoing the SELECT box, make sure you use the $_POST value to determine which SELECT item should be pre-selected (you should have this). Then, in the DIV, if there is a POST, go ahead and use the function from above to show the checkboxes:

Code: [select]

echo '<div id="extra">';

if($_POST)

  echo make_checkboxes($_POST['trade'],$_POST['checkboxes']);

echo '</div>';where 'checkboxes' is the name of the INPUT used for the checkboxes

 

and this one I think I know what you mean

 

 

can you get a real example, so I can see what's happening there ?

 

thanks

[xpace]

hey, this is what I was trying to do but I can't move any forward.

function make_checkboxes ( $select_value, $checked_values = array() ) {

$sql_x = mysql_query(" SELECT * FROM ".$tbl_prefix."category_sub WHERE sub_main_category_id='".$select_value."' ORDER BY sub_cat_name ASC ") or die ("no no no".mysql_error());
    
    while ($row_x = mysql_fetch_array($sql_x)) {
    	if ($_POST['sub_select'] && $_POST['sub_select'] == $row_x['sub_cat_id']) {
    		$check_selected = "CHECKED";
    	}
    	
    	echo "<input type='checkbox' name='sub_select[]' value='".$row_x['sub_cat_id']."' ".$check_selected."> ".$row_x['sub_cat_name']." - ".$row_x['sub_cat_id']."<br />";
    	$check_selected = NULL;

    }
}

This part I've tried to list the sub category with checkboxes first and it works but it's not showing again after submitting(the whole div), but then I wanted to use your function and  have no idea how to make the checkboxes again selected after submitting(I mean only those that been really selected) in that function

 

if(isset($_GET['trade'])){
    //Everything in here will get echoed in the DIV
   
   echo make_checkboxes($_GET['trade']);
    
    exit;
  }

this is the second bit you suggested and I'm hoping I got it right but thats it.

 

with last bit you sent I'm not sure where to put it as in the DIV it would be sort of strange when the second bit is already showing what's in it.

 

I'm really not good at this, I probably burn my PC down and will go to make some boomerangs 

 

thanks