2016-10-20 6 views
2

내 DB에 저장된 모든 사용 가능한 분야로 선택 상자를 채워야합니다.Grails 컨트롤러에서 JSON으로 선택 상자를 채우는 방법

그래서, DisciplineController에서이 같은 작업을 만든 :

def getDisciplinesJson() { 

def discList = Discipline.getAll() 
return discList as JSON 

} 

은 올바른 방법 JSON으로 학문을 얻을 즉, 내가 예를 들어 자바 스크립트를 사용하여이 작업을 호출하고 어떻게하는 선택을 채울 상자, 다음과 같은 내용 :

<select id=disc-select> </select> 

이 선택 상자는 학생용 페이지와 같이 다른 페이지에 나타납니다.

답변

2

다양한 방법이 있습니다.

<select id=disc-select> 
<g:each in="${discList}" var="disc"> 
<option value="${disc?.id}">${disc?.name}</option> 
</g:each> 
</select> 

그리고 이미 컨트롤러에서 반환 :

<script> 
    function loadDisciplines() { 
    $.ajax({ 
     url: "${createLink(controller: 'DisciplineController', action: 'getDisciplinesJson')}", 
     success: function (data) { 
     //... 
// Parse JSON, create select box etc.. 
     } 
    }); 
    } 
</script> 

변경을 JQuery와

를 사용하여 예를 들어, 또한

당신은 코드 템플릿을 만들 수 있습니다 "JSON으로 discList 렌더링"을 "JSON으로 discList를 반환" 렌더링 된 템플릿 :

render template:"pathToTemplate/thisTEmplate", model:[discList:discList] 

그런 다음 loadDisciplines() 성공 차단에서 단지 둘 필요가 : 당신이 데이터의 다음 목록을보다 쉽게로 선택 변경 괜찮다면 # 분야-DIV는

<div id="disciplines-div"></div> 
1

$('#disciplines-div').html(data); 

입니다

곳이다 데이터 목록 HTML5는 데이터 목록을 지원하고 당신이 찾을 수 example here : 그리고 여기에 보여

<input type=text list=browsers> 
<datalist id=browsers> 
    <option value="Firefox"> 
    <option value="IE"> 
    <option value="Chrome"> 
    <option value="Opera"> 
    <option value="Safari"> 
</datalist> 

당신이 다음 boselecta을 확인 dataLists와 자동 완성 작업을보고 싶어합니다. 나는 그것을 자동 완성을 위해 사용했고 당신은 example here을 찾을 수있다. JSON을 데이터 목록으로 파싱하는 것은 다소 복잡합니다. 그러나 그 페이지 내에 있습니다.

0

귀하의 질문은 'Grails 컨트롤러에서 JSON으로 선택 상자를 채우는 방법'이지만 귀하의 예제를 보면 알 수 있습니다. 왜 JSON으로 채워야합니까?

이 경우 <g:select> 태그는 더 간단한 방법 일 수 있습니다.

<g:select id="disc-select" from="${my.package.Discipline.list()}" name="myparam"/>

는 GSP에

사용이 개봉 된 가정되고
관련 문제