Hi Daniel, That is really helpful. Thank you very much! Wendy From: dancer-users <dancer-users-bounces@dancer.pm<mailto:dancer-users-bounces@dancer.pm>> on behalf of Daniel Perrett <dp13@sanger.ac.uk<mailto:dp13@sanger.ac.uk>> Reply-To: Perl Dancer users mailing list <dancer-users@dancer.pm<mailto:dancer-users@dancer.pm>> Date: Wednesday, March 23, 2016 at 5:00 PM To: Perl Dancer users mailing list <dancer-users@dancer.pm<mailto:dancer-users@dancer.pm>> Subject: Re: [dancer-users] how to change drop down list on different tabs 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:dancer-users-bounces@dancer.pm] 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 <dancer-users-bounces@dancer.pm<mailto:dancer-users-bounces@dancer.pm>> on behalf of "John J. McDermott, CPLP" <jjm@jkintl.com<mailto:jjm@jkintl.com>> Reply-To: Perl Dancer users mailing list <dancer-users@dancer.pm<mailto:dancer-users@dancer.pm>> Date: Tuesday, March 22, 2016 at 5:38 PM To: "dancer-users@dancer.pm<mailto:dancer-users@dancer.pm>" <dancer-users@dancer.pm<mailto:dancer-users@dancer.pm>> 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 dancer-users@dancer.pm<mailto:dancer-users@dancer.pm>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.