Radio Buttons Created With PHP, Change Another Field

[NFD]

Hi,

 

What I am basically trying to do here is when a user selects a radio button, it changes the values of other fields.

More specifically, when they select the radio button to use X address, the details for X get auto filled into the relevant fields.

 

Here is the PHP snippet that fetches the available address:

		$additionalAddressesQuery = "SELECT * FROM ".$glob['dbprefix']."Cube_Addship WHERE customerid = '".$ccUserData[0]['customer_id']."'";
	$additionalAddresses = $db->select($additionalAddressesQuery);

		if($additionalAddresses==TRUE){

				for($i=0; $i<count($additionalAddresses); $i++){

					$view_cart->assign("VAL_AA_SID",$additionalAddresses[$i]['sid']);
					$view_cart->assign("VAL_AA_CUSTOMERID",$additionalAddresses[$i]['customerid']);
					$view_cart->assign("VAL_AA_TITLE",$additionalAddresses[$i]['stitle']);
					$view_cart->assign("VAL_AA_FIRST_NAME",$additionalAddresses[$i]['sfirstname']);
					$view_cart->assign("VAL_AA_LAST_NAME",$additionalAddresses[$i]['slastname']);
					$view_cart->assign("VAL_AA_ADDRESS_1",$additionalAddresses[$i]['sadd']);
					$view_cart->assign("VAL_AA_ADDRESS_2",$additionalAddresses[$i]['sadd2']);
					$view_cart->assign("VAL_AA_CITY",$additionalAddresses[$i]['scity']);
					$view_cart->assign("VAL_AA_STATE",$additionalAddresses[$i]['sstate']);
					$view_cart->assign("VAL_AA_ZIP",$additionalAddresses[$i]['szip']);
					$view_cart->assign("VAL_AA_COUNTRY_NAME",countryName($additionalAddresses[$i]['scountry']));
					$view_cart->assign("VAL_AA_COUNTRY_ID",$additionalAddresses[$i]['scountry']);

				$view_cart->parse("view_cart.cart_true.step_3.additional_adresses.js.addresses_loop_js");
				$view_cart->parse("view_cart.cart_true.step_3.additional_adresses.addresses_loop");
				}
		$view_cart->parse("view_cart.cart_true.step_3.additional_adresses.js");
		$view_cart->parse("view_cart.cart_true.step_3.additional_adresses");
		}

 

Here is a couple of the fields I am looking at populating upon selection:

<tr>
<td><strong>{TXT_FIRST_NAME}</strong></td>
<td><input name="delInf[firstname]" type="text" class="textbox" id="firstname" value="{VAL_DEL_FIRST_NAME}" maxlength="100" /></td>
</tr>
<tr>
<td><strong>{TXT_LAST_NAME}</strong></td>
<td><input name="delInf[lastname]" type="text" class="textbox" id="lastname" value="{VAL_DEL_LAST_NAME}" maxlength="100" /></td>
</tr>

 

Here is the inputs I am currently using to make the selection:

<input type=radio name=copy value='yes' onclick="data_copy()";><i>Ship to :</i><br>
<input type=radio name=copy value='no' onclick="data_copy()";><i>Clear above, enter shipping address.</i>

 

And lastly, here is the javascript currently used to perform the population:

<!-- BEGIN: js -->
<script type="text/javascript">
function data_copy()
{

<!-- BEGIN: addresses_loop_js -->
if(document.cart.copy[{VAL_AA_SID}].checked){

document.cart.delInf[title].value="{VAL_AA_TITLE}";
document.cart.delInf[firstname].value="{VAL_AA_FIRST_NAME}";
document.cart.delInf[lastname].value="{VAL_AA_LAST_NAME}";
document.cart.delInf[add_1].value="{VAL_AA_ADDRESS_1}";
document.cart.delInf[add_2].value="{VAL_AA_ADDRESS_2}";
document.cart.delInf[town].value="{VAL_AA_CITY}";
document.cart.delInf[county].value="{VAL_AA_STATE}";
document.cart.delInf[postcode].value="{VAL_AA_ZIP}";
document.cart.delInf[country].value="{VAL_AA_COUNTRY_NAME}";

}
<!-- END: addresses_loop_js -->

</script>
<!-- END: js -->

 

Now obviously, this is not working as I need it to.

Actually, it doesn't work at all!

 

One problem I think I have is using "delInf[country]" in the javascript.

This bit I should be able to counter by renaming those to simply "country" for example.

 

The main problem I am having is getting the loop itself to match up with the inputs and getting all inputs to work.

 

Any assistance that could be provided here would be highly appreciated.

[NFD]

Another method I attempted is....

 

Javascript:

<!-- BEGIN: js -->
<!-- BEGIN: addresses_loop_js -->
<script type="text/javascript">
function data_copy{VAL_AA_SID}()
{

if(document.cart.copy[0].checked){

document.cart.title.value="{VAL_AA_TITLE}";
document.cart.firstname.value="{VAL_AA_FIRST_NAME}";
document.cart.lastname.value="{VAL_AA_LAST_NAME}";
document.cart.add_1.value="{VAL_AA_ADDRESS_1}";
document.cart.add_2.value="{VAL_AA_ADDRESS_2}";
document.cart.town.value="{VAL_AA_CITY}";
document.cart.county.value="{VAL_AA_STATE}";
document.cart.postcode.value="{VAL_AA_ZIP}";
document.cart.country.value="{VAL_AA_COUNTRY_NAME}";

}
</script>
<!-- END: addresses_loop_js -->
<!-- END: js -->

 

Inputs:

<!-- BEGIN: addresses_loop -->
<input type=radio name=copy value='yes' onclick="data_copy{VAL_AA_SID}()";><i>Ship to :</i><br>
<!-- END: addresses_loop -->

 

Now using that method, I can look at the source and see that:

- both the js loop and the input loops are created

- both get the correct name assigned

- the data is there in the js loop

 

But when I goto use the radio button itself, the data doesn't get populated.

 

If I am going about this completely the wrong way, please feel free to point me in the correct direction.

[NFD]

Once last attempt for the night...any advice would be great

 

Now using a drop down instead of radio buttons.

 

Very basic javascript:

<script type="text/javascript">
function data_copy_address()
{

document.cart.title.value="YES";

}
</script>

 

New html:

				<td colspan="2">Ship to this address:<br>
			<select name="addresses" id="addresses" onchange="data_copy_address()" class="textbox">
			<option value="0">Please select...</option>
			<!-- BEGIN: addresses_loop -->
			<option value="{VAL_AA_SID}">{VAL_AA_TITLE} {VAL_AA_FIRST_NAME} {VAL_AA_LAST_NAME},{VAL_AA_ADDRESS_1} {VAL_AA_ADDRESS_2} {VAL_AA_CITY}, {VAL_AA_STATE}, {VAL_AA_ZIP}, {VAL_AA_COUNTRY_NAME}</option>
			<!-- END: addresses_loop -->
			</select>
			</td>

 

So now all I need to know is:

- the best way to have the correct fields retrieved based off what option was selected in the drop down

- if I can either use "delInf[title]" for field names or use just "title" but it auto copies the value to a hidden field called "delInf[title]".

[DeanWhitehouse]

only browsed through the post, but can't you just use innerHTML? this will do it

[NFD]

Thanks for the suggestion

 

I just took a quick look at innerHTML, and have a couple questions.

 

On the surface I can use that to create the dynamic ids, and then do the change, so thats good as I can retain the names for each field.

 

I see I can use it change things like the ahref values (url, target, text etc) but how would I get it change the value of value="" which isn't a link but is the form value?

[DeanWhitehouse]

from what i know it is something like

you do

 

formname.fieldname.value=""

 

set this in a var then do innerhtml

 

e.g.

 

var $value;

 

$value = formname.fieldname.value="empty";

 

document.getElementById().innerHTML = $value;

 

[NFD]

Thanks for that, very much appreciated.

 

Then the last thing I need to get this all working so I can retain the current field names, which are required as part of the form processing, is there a way to use these type of labels:

delInf[postcode]

 

i.e.

$value = formname.fieldname.value="empty";

becomes

$value = formname.delInf[postcode].value="empty";

 

Is there a way of doing that?

[DeanWhitehouse]

erm not sure, try looking on w3schools under the js sections and the dom section

[NFD]

Alrighty....

 

I have now got this working exactly how I want in Firefox, but of course it fails in IE.

 

Java Snippet:

<script type="text/javascript">
function data_copy_address_{VAL_AA_SID}()
{

document.getElementById('title').value = "{VAL_AA_TITLE}";
document.getElementById('firstName').value = "{VAL_AA_FIRST_NAME}";
document.getElementById('lastName').value = "{VAL_AA_LAST_NAME}";
document.getElementById('add_1').value = "{VAL_AA_ADDRESS_1}";
document.getElementById('add_2').value = "{VAL_AA_ADDRESS_2}";
document.getElementById('town').value = "{VAL_AA_CITY}";
document.getElementById('county').value = "{VAL_AA_STATE}";
document.getElementById('postcode').value = "{VAL_AA_ZIP}";
document.getElementById('country').value = "{VAL_AA_COUNTRY_NAME}";

}
</script>

 

Form Field Example:

<td><input name="delInf[title]" type="text" class="textbox" id="title" value="{VAL_DEL_TITLE}" size="7" maxlength="30" />

 

Drop Down Code:

<select  name="addresses" id="addresses" class="textbox">
<option value="0">Please select...</option>
<!-- BEGIN: addresses_loop -->
<option onclick="data_copy_address_{VAL_AA_SID}()" value="{VAL_AA_SID}">{VAL_AA_TITLE} {VAL_AA_FIRST_NAME} {VAL_AA_LAST_NAME},{VAL_AA_ADDRESS_1} {VAL_AA_ADDRESS_2} {VAL_AA_CITY}, {VAL_AA_STATE}, {VAL_AA_ZIP}, {VAL_AA_COUNTRY_NAME}</option>
<!-- END: addresses_loop -->
<option onclick="data_copy_address_clear()" value="clear">Clear above and manually enter address</option>
</select>

 

So as above it works perfectly in Firefox.

I just need to get it to work in IE.

 

Any pointers?

[DeanWhitehouse]

you may need to ask in the js section, as i have problems with js in ie aswell.

[NFD]

Alrighty, I will try that.

Thank you for all your help getting this far