Question

这是PHP上的CodeIgniter。

在我的（MVC）视图中，我有一个循环，为循环的每个实例创建一个小的flot图（javascript）。

<?php
for each ($catalog as $book) {
    echo "<li>";
    echo anchor('controller/manager/'.$key['Title']) . ' is available';

      // flot javascript goes here to generate a small graph for this list item

}
unset ($book);      ?>

循环本身就是PHP，javascript可能大约有50行左右的代码，我从其他一些样本开发过。

因此，为了让代码在这个视图中工作，我需要回显每一行，否则当我在javascript启动之前终止PHP时，我打破每个循环的 -jcal完成后重新启动php。

什么是更有效的方法？

Answer 1

最好使用不引人注目的JavaScript，而不是将内联JavaScript耦合到后端代码中。

Answer 2

使用heredocs更容易回应大块文本/代码。如果你需要在JavaScript中使用PHP变量，PHP仍会解析块。

http://www.php.net/manual/en/language.types.string.php#language.types.string.syntax.heredoc

$some_javascript = <<<_JS
some mulit-
line text
<<<_JS

Answer 3

您可以使用短标记将控制器中的数据提供给视图的javascript部分。

例如，我们在视图中使用以下javascript代码：

    var assign_data = [
    {label : "Single", data:<?= $single_num ?>},
    {label : "Barcode", data:<?= $barcode_num ?>},
    {label : "Template", data:<?= $template_num ?>}

];

对于此图，我们然后从模型中获取相应的数字，然后为其分配相应的短标记以通过flot呈现。因此，对于$ barcode_num，我们使用以下代码：

    $data['barcode_num'] = $this->history_model->get_barcode_assign_num($this->org_id);

我们还在控制器中构建格式化字符串以提供flot数据。一个控制器方法的示例输出为条形图提供此样本字符串。：

          data: [ [144,4],[157,0],[138,0],[145,0],[149,0],[141,0],[137,3],[155,0],[150,0],[142,0],[148,0],[140,0],[146,0],[152,0],[153,0],[147,1],[143,0],[156,0],[139,1],[154,0],[151,0] ]

Answer 4

您可以使用hmtl5数据属性来传递图表的指标。您可以使用库将数据绑定到这些元素，例如knockout.js或 angular.js然后在javascript客户端工作，就像Neil说的那样。

视图：

<ul id="book-graph">
   <?php foreach($books as $book): ?>
        <li id="book_id_<?php echo $book->id;?>">
           <span id="graph" data-bind="metric : <?php echo $book->metric;?>">&nbsp;</span>
        </li>
   <?php endforeach; ?>
</ul>

// Jquery示例

(function($){

   var GraphAPI = {
        init : function(){
            if($("#book-graph"))
                this.drawBookGraph();
        },
        drawBookGraph : function(){
            //Your graph code
        }
   };

   $(function(){
        //Load up your graph API when your ready
        GraphAPI.init();
   });

}(jQuery));

如何避免回显大量的javascript

4 个答案: