States dropdown if else statement needed, pls

[payless4domains]

Hi Guys,

 

My issue is the states dropdown menu on the vieworders page. not an issue I just need it to be able to display a new option further down the page depending on the original option selected before the form has been submitted.

 

i.e dropown

 

<div class="form-group">
<label for="inputState" class="col-md-4 control-label">{$LANG.clientareastate}</label>
<div class="col-md-8">
<input type="text" name="state" id="inputState" value="{$clientsdetails.state}" class="form-control"{if $loggedin} disabled="disabled"{/if} />
</div>
</div>

 

States - Queensland

- NSW

- ETC

 

What I'm trying to achieve is:

If a client selects value "Queensland" I need a new custom field to show further down the page, that relates to Queensland

If a client selects value "NSW" I need a different custom field to show in the same spot further down the page.

 

I've tried:

{foreach $values as $value}

{if $value = "Queensland"}
    Queensland
{elseif $value = "NSW"}
    do action
{elseif $value = c}
    do action
{/if}

{/foreach}

 

This is the code that goes down the page for "Queensland", but now needs to link to "Queensland" when selected and then there will be others for the other selections, I just can't get my head around how I can link via selection without sumbiting the form and then using the clientsdetails.state

{if $loggedin}
						<div class="line-padded" style="float:right;">
						<div class="col-md-12">
						<input type="checkbox" name="ctp" id="ctp" value="{$clientsdetails.customfields21}" checked>
						 Yes, Transfer my CTP insurance to RACQ
						</div>
						</div>
					{/if}



						{foreach key=num item=customfield from=$customfields}
							{if $customfield.name eq "CTP Insurance"}
							<div class="line-padded" style="float:right;>
							<div class="col-md-12">
							<div class="control">{$customfield.input|replace:'>':"checked>"}
							 Yes, Transfer my CTP insurance to RACQ
							</div>
							</div>
							</div>
							{/if}
						{/foreach}

 

another way to explain what I am trying to do: (doesn't work though}

{if $clientsdetails.state eq selected "Queensland"}
show the Queensland tickbox above
{elseif $clientsdetails.state eq selected "NSW"}
then show the NSW tick box
{elseif .... etc}
another tick box
{/if}

 

Really appreciate your help in advance.

 

Thanks Kev

[Kian]

You have to use jQuery to achieve your goal. You need a script to hide/show your custom field depending on the selected state. Anyway keep in mind that this kind of solution is not bulletproof (e.g. people with javascript turned off).

[payless4domains]

Thank you and got this one solved. but again it does work when logged in.

 

<script>
$(function() {
   $("#stateselect").on("change",function() {
      $(".hideable").hide(); 
      var id = "#state"+(this.selectedIndex+1);
   $(id).show();
   }).change();
});
</script>

<style>
.hideable { display:none }
</style>

<div id="state1"></div>
<div id="state2" class="hideable">
{foreach key=num item=customfield from=$customfields}
{if $customfield.name eq "ACT"}
<div class="panel input-panel authorisation">
	<div class="panel-input">
	{$customfield.input}
	</div>
</div>
{/if}
{/foreach}
</div>

 

Thanks again Guys