Question

我在Rails中有部分形式，如下所示：

<div class"row">
    <div class="col-md-6" id="top_level">               
    </div>
</div>

<div class"row">
    <div class="col-md-2" id="sub_category1">               
    </div>
</div>  

<div class"row">
    <div class="col-md-2" id="sub_category2">               
    </div>
</div>

<div class"row">
    <div class="col-md-2" id="sub_category3">               
    </div>
</div>

<div class"row">
    <div class="col-md-3" id="sub_category4">               
    </div>
</div>  

    <div class"row">
        <div class="col-md-3" id="sub_category5">               
        </div>
    </div>

用于选择项目的类别和子类别。

listings_controller：

def new
  @product_listing = Listing.new
  @product_ = Product.find(params[:product_id])  
  # gon.categories = EbayCategory.all
  gon.top_level = EbayCategory.top_level
end

在模型中：

scope :top_level, -> { where('category_id = parent_id').order(:id) }

每个类别记录（其中17989个）具有唯一的category_id和parent_id。如上所述，顶级category_id =同一记录的parent_id。所有子类别都有自己的category_ids，它们是下一级别的parent_id，依此类推，在1到5个子级别之间变化。

我尝试了一系列视图文件，效果很好（它会呈现正确的类别和子类别），但我不能通过这种方式传递列表ID，因为我不知道如何使用link_to url helper通过params哈希传输2个ID（一个用于父类别，一个用于列表id），因此我丢失了我在尝试创建的列表的ID时导航所有子类别。

所以我用jQuery尝试使用Gon gem。这不仅意味着加载整个db表（大约7 MB，一旦我在第2级到第5级取消注释该行）进入ram，但我无法弄清楚如何动态传递category_id单击其中一个元素时创建top_level列表。有很多层次可以去，但是现在我只是尝试console.log将category_id设为一个级别，所以我可以看到它正在注册。到目前为止还没有成功，在尝试了许多不同的语法和方法之后，这是最新的：

<script type="text/javascript"> 

$(gon.top_level).each(function(){   
$("#top_level").append('<h5><a href="#">' + this.main_category + " >"  + '</a></h5>').data($(this).category_id);            
    })  

$("#top_level").on('click', 'a', function(){
    console.log($(this).data());
});     

</script>

...返回

Object {}

到控制台。

有关如何使用文本类别标题动态存储ID的任何建议？

Answer 1

$('gon.top_level').each(function(){   
    var lnk = $('<h5><a href="#">' + this.main_category + " >"  + '</a></h5>')
                  .find('a').data({'category':$(this).category_id,'anotherKey':'value'});   

    $("#top_level").append(lnk);         
}); 

$("#top_level").on('click', 'a', function(){
    console.log($(this).data('category'));
    console.log($(this).data('anotherKey'));
});

设置数据使用$(elment).data({key:value});

使用$(elment).data(key);

获取数据

jQuery将动态创建的变量传递给另一个函数

1 个答案: