addClass to <tr> in handlebar script

Есть ли простой способ добавить класс в строку таблицы в скрипте руля?addClass to <tr> in handlebar script

Сейчас я перекручивание через JSON и хочу добавить класс PageNumber ко всем строкам

for (var i = 0; i < allData.length; i++) { 

     if (i % 10 == 0 && i != 0) { 
      pageNumber++;        
     } 
     $('.tableRow').addClass('page' + pageNumber); 
     console.log("page" + pageNumber); 
    }

.tableRow является <tr> я мой руль сценарий

Это все работает нормально, но я не могу добавьте к этому классу. Он отлично работает, если я пытаюсь добавить к классу вне моего сценария

HTML код:

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <link rel="stylesheet" type="text/css" media="screen" href="/includes/css/style.css" /> 
</head> 
<body> 
    <div class="wrapper"> 
     <div class="tab-container"> 

      <div class="tab-content"> 

       <div id="scriptData"></div> 


       <script id="template" type="text/x-handlebars-template"> 


         <table class="table-look"> 
          <thead> 
           <tr> 
            <th class="Header">Some data</th> 
            <th class="Header">Some data</th> 
            <th class="Header">Some data</th> 
            <th class="Header">Some data</th> 
           </tr> 
          </thead> 
          <tbody> 
           {{#each this}} 
           <tr class="tableRow"> 
            <td">{{data}}</td> 
            <td>{{data}}</td> 
            <td>{{data}}</td> 
        <td>{{data}}</td>        
           </tr> 
        {{/each}} 
          </tbody>       
         </table> 
       </script> 

      </div> 
     </div> 
    </div> 

    <script type="text/javascript" src="includes/js/libs/jquery-1.11.3.min.js"></script> 
    <script src="includes/js/libs/handlebars-v4.0.2.js"></script> 
    <script type="text/javascript" src="includes/js/custom.js"></script> 
</body> 
</html>

источник

2015-11-02 J_K_J

Показать HTML таблицы. – Manwal

добавлено сейчас :) –

Я видел HandlebarJS полосчатого вокруг немного, но гавань» когда-либо использовал его сам, так что это казалось хорошей возможностью справиться с этим.

jQuery обыкновенно подбирает любые элементы в пределах <script id="..." type="text/x-handlebars-template">. У вас нет каких-либо элементов DOM для jQuery для работы там - у вас только что есть текст. Это немного запутанно, потому что выглядит как обычные HTML-элементы, но его просто текст. Это сценарий.

У вас есть 2 варианта - вы можете:

A: Петля через элементы DOM после того как ваш шаблон придан.
B: Используйте поручень в Block Expressions

Вариант А:

$(document).ready(function() { 
    var source = $("#template").html(); 
    var template = Handlebars.compile(source); 
    var html = template(context); 
    $('#foo').html(html); 
    $('.tableRow').each(function(idx,o){ 
     $(this).addClass('page'+Math.floor(idx/2)); 
    }); 
});

http://jsfiddle.net/daveSalomon/xzey0dnj/3/

Вариант B:

Шаблон

<tr class = "tableRow {{#page-number}}page{{/page-number}}">

var fooItemNumber = 0; 
Handlebars.registerHelper('page-number', function(items, options) { 
    var out = "page"; 
    return out + Math.floor(fooItemNumber++/2); 
});

http://jsfiddle.net/daveSalomon/xzey0dnj/5/

источник

2015-11-02 12:46:15

Должно быть, устали или что-то в этом роде. Решена проблема, как вы упомянули, перемещение кода под скриптом шаблонов ручек –

попробовать этот

$(document).ready(function(){ 
    $(".table-look tr").each(function(index,row){ 
     // add your class here 
     $(row).addClass("yourClass"); 
    }); 
});

источник

2015-11-02 12:11:52

цикл for находится в $ (funtion() {} –

не работает извините –

Пожалуйста, подумайте над редактированием сообщения, чтобы добавить больше объяснений о том, что делает ваш код и почему он решит проблему. Ответ, который в основном содержит только код (даже если он работает) обычно не помогает OP понять их проблему. Также рекомендуется, чтобы вы не отправляли ответ, если это просто предположение. Хороший ответ будет правдоподобной причиной того, почему он может решить проблему OP. – SuperBiasedMan

ответ

Смежные вопросы