Łączenie JavaScript i Scala w szablonie Play

Question

Nie jestem pewien, jak to się robi. Mogę zakodować kod trasy, której próbuję użyć, ale chciałbym to zrobić we właściwy sposób.

Mam menu, które musi załadować nową stronę po zmianie. Tutaj w zasadzie jak próbuję to zrobić (próbowałem kilka odmian tego):

@getRoute(value: String) = @{ 
    routes.Accounts.transactions(Long.valueOf(value)) 
} 

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

     $("select[name='product']").change(function() { 

      location.href = @getRoute($(this).val()); 
     }).focus(); 

     $('a.view.summary').attr('href', "@routes.Accounts.index()" + "?selectedAccountKey=" + $('select[name=product]').val()); 
     }); 
    </script> 

To daje identifier expected but 'val' found wyjątek. Próbowałem również otaczanie go w cudzysłowach, ale to powoduje, że w jaki sposób wstawić wartość z JavaScript do funkcji Scala?

Edit

Oto moje rozwiązanie, inspirowany przez przyjętą odpowiedź. To menu jest zdefiniowane w tagu, który został ponownie użyty przez różne komponenty, a podstawowy adres URL jest inny dla każdego komponentu. Drogą do osiągnięcia tego celu było przekazać funkcję, która generuje URL w oparciu o klucz rachunku na liście rozwijanej:

@(accountList: List[models.MemberAccount], 
    selectedAccountKey: Long, 
    urlGenerator: (Long) => Html 
) 

<select name="product"> 
    @for(account <- accountList) { 
    @if(account.accountKey == selectedAccountKey) { 
     <option selected="selected" value="@urlGenerator(account.accountKey)">@account.description (@account.startDate)</option> 
    } else { 
     <option value="@urlGenerator(account.accountKey)">@account.description (@account.startDate)</option> 
    } 
    } 
</select> 

<script type="text/javascript"> 
$(function() { 
    $('select[name=product]').change(function() { 
     location.href = $(this).val(); 
    }); 
}); 
</script> 

Następnie można zdefiniować funkcję tak, aby przechodzić w:

@transactionsUrl(memberAccountKey: Long) = { 
    @routes.Accounts.transactions(memberAccountKey) 
} 

@accountsDropdown(transactionDetails.getMemberAccounts(), transactionDetails.getMemberAccountKey(), transactionsUrl) 

Answer 1

Ty potrzebujesz sposobu przechowywania wszystkich adresów URL na stronie, np

<option value="@routes.Accounts.transactions(id)">Display</option> 

Następnie onChange można:

$("select[name='product']").change(function() { 
    location.href = $(this).val(); 
});