테이블 행 템플릿의 행을 렌더링하는 백본보기를 만들었습니다. 렌더링하는 동안 테이블 행의 배경색을 변경할 수 있기를 원했습니다. 그것은 가져 오기가 서버에서 모든 항목을 가져 오는 데 시간이 걸리므로 테이블의 특정 행의 배경을 변경하는 다른 메서드를 호출하기 전에 뷰가 완전히 렌더링되었는지 확인할 수 있는지 알고 싶었습니다. 전체 컬렉션을 렌더링하는 데 하나의보기 만 사용하고 있습니다. handlebars.js를 사용하여 하나의 템플릿을 사용하고 있습니다. 누군가 이걸로 나를 도울 수 있습니까?backbone.js를 렌더링하는 동안 테이블의 배경색 변경
질문이 명확하지 않아 요소의 배경색을 수정하는 방법을 알려 드리고자합니다.
$(" element ").css("background-color", "required-color")
또는
$(" element ").addClass("background_class")
이 같은 스타일을 추가
:이 원하지 않을 경우.background_class{
background-color: color_name;
}
는 몇 가지 코드를 게시하려고하고 우리는 대답을 시도합니다.
this.collection.fetch... ({ 성공 : 함수() { that.render(); } }) render 메소드 코드에서 이것은 $ ('# ProductContainer'). html (result)); result에는 렌더링 할 f 행 목록이 있습니다. 이제 렌더링이 완료된 후 표 행 수를 얻은 다음 조건에 따라 bgcolor를 변경하는 메소드를 호출하려고합니다. 나는 css를 설정하는 방법을 알고 있지만, 나는이 condtion을 점검하고 채색하는 다른 메소드를 호출하는 방법을 알고 싶다. 해당 메서드를 호출 할 수 있지만 테이블 행 수는 여전히 0입니다. – 8GB
@ 8GB보기가 어떻게 구성되어 있습니까?또한 질문을 편집하고 코드를 추가해야합니다. – Jack
나는 그것을 편집하려고 노력했으나 그것을 가져 가지 않았다. 나를 곰은 아직 스택 오버플로에 새로운입니다. – 8GB
귀하의 의견을 기반으로 모든 행을 렌더링하기위한 respoinsble의 단일보기가있는 것 같습니다. 단일 템플리트를 사용한다고 가정하면, 그 안에 조건문을 추가하기 만하면됩니다. 예 :
<div id="rows-template" type="text/template">
<% _each(list, function(item) { %>
<li <% if (item.something) { 'class="blue"' } %> ><%= item.name %></li>
<% }); %>
</div>
OK 이제 템플릿에 underscore.js를 사용하고 있지 않다는 귀하의 의견을 보았습니다. 그렇지만 핸들러에 익숙하지는 않습니다. (handlebar를 사용 했습니까?)). – Jack
handlebar.js 예, 제가 작동한다고 언급했듯이, js 모듈에서 조건을 검사해야하는 템플릿 내부에서는 아무 것도 할 수 없습니다. 내가 언급했듯이 그것은 지금 일하고있다. 질문은 단지 행의 색을 바꾸는 것입니다. 트위터 부트 스트랩의 클래스를 'table-bordered'로 사용하고 있기 때문입니다. 이 문제가 해결 되었습니까? – 8GB
해결책을 찾았습니다. 나는 Jquery의 함수를 사용할 때와 사용한 함수를 사용했다. 그런 다음 함수를 사용하여 조건부 메서드를 호출하고 언제 가져올 지 가져옵니다. 그것은 지금 일하고 있고 bg-clor를 바꾸고 있습니다. 문제는 테이블에 트위터 bootsraps의 css "table-bordered"클래스가있어서 bg-color가 대체 행으로 만 표시된다는 것입니다.
모든 행 또는 대체 행 또는 특정 행의 색상을 변경 하시겠습니까? –
조건에 따라 일부 특정 행 모든 테이블 행을 가져 와서 조건을 검사하고 CSS를 적용하는 다른 메서드를 호출하려고했습니다. 하지만 전혀 부르지 않습니다. 렌더링 메소드에서는 fetch를 사용하여 서버에서 콜렉션을 가져 와서 테이블 행의 html로 렌더링합니다. – 8GB
몇 가지 코드를 추가하십시오. – gmaliar