Improve company productivity with a Business Account.Sign Up

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1503
  • Last Modified:

Passing multi select box values to php using Ajax script

I have a multi select box called services[].  I want to save the values that are in that box to a database using ajax to pass the selected values to the php script.  I have tried this code

var services_array = document.getElementById('services[]').value;
services = "";
for (counter=0; counter<services_array.length; counter++) {
      services = services + services_array[counter] + ",";
}
alert (services)

but it only returns 1 value, even if you select more than one option.

If i can pass the values in an array to the php script, adding that to the database is easy.

Thanks in advance
0
revo1059
Asked:
revo1059
  • 7
  • 6
1 Solution
 
hieloCommented:
get rid of ".value":
var services_array = document.getElementById('services[]');
0
 
revo1059Author Commented:
When I do that, I get this (see attached file)
error.JPG
0
 
hieloCommented:
try:
var services_array = document.getElementById('services[]').options;
var services = "";
for (var counter=0; counter < services_array.length; counter++) {
      services = '&services[' +counter+ ']=' + encodeURIComponent(services_array[counter]);
}
services = services.substring(1);

Open in new window

0
Keep up with what's happening at Experts Exchange!

Sign up to receive Decoded, a new monthly digest with product updates, feature release info, continuing education opportunities, and more.

 
hieloCommented:
Sorry, this:
services = '&services[' ...

should be:
services += '&services[' ...
0
 
revo1059Author Commented:
Another error message
error2.jpg
0
 
revo1059Author Commented:
I made a test page instead of using the real page
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script>
 
function display_services() {
var services_array = document.getElementById('services[]').options;
var services = "";
for (var counter=0; counter < services_array.length; counter++) {
      services = '&services[' +counter+ ']=' + encodeURIComponent(services_array[counter]);
}
services = services.substring(1);
alert (services)
}
</script>
 
</head>
 
<body>
<form id="form1" name="form1" method="post" action="">
	<label>
	<select name="services[]" size="5" multiple="multiple" id="services[]">
		<option value="1">test</option>
		<option value="2">test2</option>
		<option value="3">test3</option>
		<option value="4">test4</option>
		<option value="5">test5</option>
		<option value="6">test6</option>
					</select>
	</label>
	<label>
	<input name="button" type="button" id="button" onclick="display_services()" value="Button" />
	</label>
</form>
</body>
</html>

Open in new window

0
 
hieloCommented:
encodeURIComponent(services_array[counter].value);
0
 
revo1059Author Commented:
I changed it to that, and got services[5]=6 in the pop up message
0
 
hieloCommented:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script>
 
function display_services() {
var services_array = document.getElementById('services[]').options;
var services = "";
var total=0;
for (var counter=0; counter < services_array.length; counter++) {
     if( services_array[counter].selected)
	{
      services += '&services[' +total+ ']=' + encodeURIComponent(services_array[counter].value);
	 ++total;
	 }
}
services = services.substring(1);
alert (services)
}
</script>
 
</head>
 
<body>
<form id="form1" name="form1" method="post" action="">
	<label>
	<select name="services[]" size="5" multiple="multiple" id="services[]">
		<option value="1">test</option>
		<option value="2">test2</option>
		<option value="3">test3</option>
		<option value="4">test4</option>
		<option value="5">test5</option>
		<option value="6">test6</option>
					</select>
	</label>
	<label>
	<input name="button" type="button" id="button" onclick="display_services()" value="Button" />
	</label>
</form>
</body>
</html>

Open in new window

0
 
revo1059Author Commented:
Perfect, that worked.  I looked at my php code, and it's a little different than I thought.  I use this script

$service = $_POST['services'];
foreach ($service as $service_id) {
      
//insert all the programs chosen and then redirect

  $insertSQL = sprintf("INSERT INTO services (order_id, service_id) VALUES (%s, %s)",
                       GetSQLValueString($order_id, "int"),
                                    GetSQLValueString($service_id, "int"));

            
  mysql_select_db($database_reseller, $reseller);
  $Result1 = mysql_query($insertSQL, $reseller) or die(mysql_error());

How would I store the php values when they are passed like this

services[0]=2&services[2]=4

If you want me to ask another question that would be fine
0
 
hieloCommented:
>>How would I store the php values when they are passed like this
PHP should see it as an array. So I would expect:
$service = $_POST['services'];
foreach ($service as $service_id) {...}

to work (Unless you are submitting a get instead of $_POST).

>>If you want me to ask another question that would be fine
If the problem persists, yes.
0
 
revo1059Author Commented:
Very nice, even went as far as to answer a slightly off topic question related to original question
0
 
hieloCommented:
glad to help.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 7
  • 6
Tackle projects and never again get stuck behind a technical roadblock.
Join Now