Strictly this is a jQuery question rather than a Dancer question, but:
Assuming you’re making an ajax request to get the data, where data is of the
form
[['kidney',1],['liver',2],['noggin',3]]
I’m assuming this structure because this is what your template expects – then
you could achieve this by code in the success function in your $.ajax call
along the lines of:
var selectElement = $('select[name="tissue"]').first().empty();
$.map(data, function(tissue){
selectElement.append(
$('<option/>').attr('value',tissue[1]).text(tissue[0]))
} );
In live production code you would probably want to use a better selector for
the select element in case you have multiple panels.
… however, if the tabs control the contents of the form, are you sure your form
belongs outside the tabs and not inside them?
Daniel
From: dancer-users [mailto:[email protected]] On Behalf Of Wanjuan
Yang
Sent: 23 March 2016 16:40
To: Perl Dancer users mailing list
Subject: Re: [dancer-users] how to change drop down list on different tabs
From: dancer-users
<[email protected]<mailto:[email protected]>> on
behalf of "John J. McDermott, CPLP" <[email protected]<mailto:[email protected]>>
Reply-To: Perl Dancer users mailing list
<[email protected]<mailto:[email protected]>>
Date: Tuesday, March 22, 2016 at 5:38 PM
To: "[email protected]<mailto:[email protected]>"
<[email protected]<mailto:[email protected]>>
Subject: Re: [dancer-users] how to change drop down list on different tabs
Changing the drop down can be done most easily client-side. Therefore, I'd use
jQuery to switch tabs and change the drop down.
--john
I am able to get the data needed, but how to use jQuery to update the drop
down, I.e. The option element in the template?
It is a list, not a single value.
Can anybody give me a hint please?
Many thanks,
Wendy
On 3/22/2016 11:08 AM, Wanjuan Yang wrote:
Hi,
I have a template:
The first part is a form with a drop down list.
The second part of the template consists different tabs.
By selecting from the list, it shows different content in the second part of
the template.
But I want to change the drop down list content when switch between tabs. How
can I do it?
The simplified version of the codes look like:
<div class="panel">
<h3 >Select a tissue specific analysis: </h3>
<div class="filt_options">
<form action=“/someaction/&" method="post" autocomplete="off">
<select name="tissue" class="tissue_selector">
<?pl foreach my $tissue ( @$tissues ){ ?>
<option value="[== $tissue->[1] =]"> [== $tissue->[0]
=]</option>
<?pl } ?>
</select>
</form>
</div>
<div class="sub_data" id="tissue_selection”>
<ul class="tabs">
<li><a href="#t_first">Overview</a></li>
<li><a href=“#t_second”>Plot</a></li>
</ul>
<div id="t_first" class=“overview”>
</div>
<div id=“t_second” class="plot">
</div>
</div>
</div>
Many thanks,
Wendy
_______________________________________________
dancer-users mailing list
[email protected]<mailto:[email protected]>http://lists.preshweb.co.uk/mailman/listinfo/dancer-users
--
John J. McDermott, CPLP
Learning and Performance Consultant
jjm at jkintl.com 575/737-8556
Check out my security blog posts<http://cybersecurity.learningtree.com>
Add an A for the Arts To STEM and get STEAM and a strong engine to move forward.
_______________________________________________
dancer-users mailing list
[email protected]
http://lists.preshweb.co.uk/mailman/listinfo/dancer-users