2012-07-29 4 views
4

jQuery를 사용하고 사용자를위한 태그 지정 인터페이스를 만들고 싶습니다. StackOverflow의 사용자가 질문하는 유형의 태그를 추가하는 방법과 유사합니다. 라이브러리에 대한django + jquery로 태그 지정

http://jquery.webspirited.com/2011/02/jquery-tagit-a-jquery-tagging-plugin/

새로운 위치 :

https://github.com/hailwood/jQuery-Tagit

문제는 사용자가 다른의 오류가 말 즉 내가 jQuery를하고 tagit를 사용하여 작동하도록 받고 있어요 양식의 일부를 클릭하고 제출을 클릭하면 양식이 오류 메시지와 함께 다시로드되고 모든 태그가 사라집니다. 장고에서 태그를 지정하는 간단한 방법이 있습니까? 나는 페이지가로드를로드 할 때

[편집]

아래 Hailwood의 반응에 따라이 ...

그러나
<ul name="event_tag" class="tags"> 
    <li class="tagit-choice" tagvalue="3"> 
     Dog 
     <a class="tagit-close">x</a> 
    </li> 
</ul> 

, 특정 태그가로드되지 시도? ul 태그가 지워지고 다른 정보가로드 된 것 같습니다. 페이지를로드 할 때 표시되지 않습니다. 아래에 따라

나는 또한 시도 :이 방법을 시도 할 때

<ul name="event_tag" class="tags"> 
    <li data-value="3">Dog</li> 
</ul> 

, 그것은 잠시 나타나고 사라질 ...

[EDIT 2]

내 문제에 대한 해결책을 찾았습니다. Hailwood 제안으로, 프로그래밍 우리는 아래에 따라, li 년대를 만들 수 있습니다 나를 위해

$.getJSON("ajaxrequest.json", function(data) { 
    $(".tags").tagit("fill", data); 
}); 

문제가되었다 내가 초기 값을했기 때문에 나를 위해 작동하지 않는

<ul name="event_tag" class="tags"> 
    <li data-value="3">Dog</li> 
</ul> 

이유가 있었다 그 일은 모두 사라지고있었습니다. 이유는 fill입니다. 을 add으로 바꿀 때마다 : $(".tags").tagit("add", data);이 작동합니다.

답변

4

당신이 언급 한 제작자 tagit 플러그인이되어서 내가 당신을 도울 수 있다고 생각합니다.

폼의 일부로 사용하고있는 것처럼 보이며 제출을 클릭하면 서버 측에서 양식의 유효성을 검사합니다. 오류가 발생하면 양식 값이 견인 된 페이지가 다시로드됩니다 ?

숨겨진 선택 옵션 (select: true)을 사용하도록 설정하는 것이 좋습니다.

양식을 제출하면 선택한 태그 목록이 표시됩니다.

그런 다음 페이지를 새로 고침하면 태그를 목록에 다시로드하여 <li> 초라고 표시됩니다.

당신은 또한 initialTags 옵션에 태그를 전달할 수 *

if(form_values.tags) 
    for(tag in form_values.tags) 
     print '<li data-value=" '+tag.value+' "> '+tag.label+' </li>'; 
    endfor; 
endif; 

하지만이 IMO에서 작은 출력 자바 스크립트를 필요로 (다음은 의사 코드 그래서 나는 파이썬을 모르는 유의하시기 바랍니다) 위의 방법보다 깔끔합니다 :)

+0

P.s이 단지 tagit의 최신 버전에서 인식됩니다! 당신이 그것을 사용하고 있는지 확인하십시오! – Hailwood

0

태그 지정을 위해 jQuery Select2의 지원을 점검해야합니다. 나는 데이터 값 속성을 사용하고 위의 의사 코드 예제에 유의하시기 바랍니다

http://ivaynberg.github.com/select2/#tags