2014-01-27 2 views
0

grails에서 sortable list using Jquery을 만들고 싶습니다. 이 목록은 드롭 다운으로 채워 져야합니다. 여기서 흐름이다grails에서 jQuery 소트리스트 작성하기

(1) 사용자가 드롭 에서 항목 1을 선택하고, 항목 1은 정렬리스트에 표시

(2) 사용자가 드롭 중 항목을 선택하고, 항목 (3) 정렬리스트 나타 는

(3) 사용자가 드롭 다운에서 item5를 선택하고, 항목 5가 정렬 가능 목록에 나타납니다.

그런 다음 사용자는 원하는 방식으로 정렬 가능한 목록을 재정렬하고 목록에 저장할 수 있습니다. 유지하는 것이 중요하기 때문에 목록이어야합니다. 현재 여러 항목을 선택하려면 여러 항목을 선택해야합니다 ().을 순서대로 보관할 방법이 없습니다.

내 프로젝트에 Jquery 플러그인이 설치되어 있습니다. 드롭 다운에서 선택한 항목을 가져 오는 방법을 모르겠습니다. 이 클래스들 사이에는 많은 관계가 있습니다.

<div class="fieldcontain ${hasErrors(bean: CarInstance, field: 'parts', 'error')} "> 
<label for="parts"> 
    <g:message code="label" default="Car Parts" /> 
</label> 
<g:select name="parts" 
      from="${Parts.list()}" 
      multiple="multiple" 
      optionKey="id" 
      size="5" 
      optionValue="partName" 
      class="many-to-many"/> 

모든 조언은 도움이 될 것입니다. 고마워.

+0

업데이트 : select 태그에 OnChange 이벤트를 사용하여이를 해결할 수

(function ($) { $('select').on('change', function() { var value = $(this).val(); var text = $(this).find('option:selected').text(); $('<div class="item" data-value="' + value + '">' + text + '</div>') .appendTo('#sortable'); }); })(jQuery); 

은 샘플 jsFiddle에서보세요. 유용한 경우 업데이 트됩니다. – matuda

답변

0

일반적으로 클라이언트 측 로직에서 HTML 마크 업을 분리하고 모든 로직을 별도의 자바 스크립트 파일에 작성하는 것이 좋습니다. 예를 들어, 자바 스크립트 코드는 다음과 같습니다 http://jsfiddle.net/rsPW7/1/

+0

고마워 ..이게 .. 내가 GSP에서 정렬 가능한 목록을 만들 수있게 도와 줬어. – matuda

관련 문제