0

我有一个包含三个复选框的视图:

<div class="tourny-games">

    <h4>Games</h4>

    <div class="checkboxOptions games show-tabs">

      <div class="show-tab">
        <div class="checkbox uncheckBoxed">
          <input id="" name="" onclick="toggleCheckboxImage(this, &#x27;&#x27;);" type="checkbox" value="1" />
        </div>
        <img src="https://s3.amazonaws.com/...iconlol.png.jpg" class="game-logo-label" />
      </div>

      # two more checkboxes here

    </div>

</div>

创建标签:

<div class="tabs">
  <% @games.each do |game| %>  
    <a href="#<%= game.striped_name %>" game="<%= game.id %>" game-type="<%= Game::TEAM_GAMES.include?(game.name) ? "team" : "single" %>" class="tab" style="<%= "display:none;" unless @tournament.game_ids.include?(game.id) %>">
      <%= game.name %>
    </a> 
  <% end %>  
</div>

通过这个jQuery:

$('.show-tabs .show-tab').live('click', function(){
  var tab = $('.tabs .tab:nth-of-type(' + ( $(this).index() + 1 ) + ')');
  ...      
  if ($(this).find('.checkbox').hasClass('checkBoxed')){
    tab.show();
    ...
  } else {
    tab.hide();
  }
});

基于这个答案,我有以下代码要设置@game_type

控制器:

def game_type
  @game_type = params[:game_type]
end

jQuery:

if ($(this).find('.checkbox').hasClass('checkBoxed')){
  tab.show();
  $.get('tournaments/game_type?game_type='+tab.attr("game-type"))

我已经测试过tab.attr("game-type")alert所以我知道它正在拉动我想要的变量 - 它返回team或者single- 但我需要在页面下方的其他 Rails 代码中进行一些条件检查 - 我该怎么做?

例如,这个伪代码演示了我需要做的一件事:

if @game_type == "team"
  "Team Name"
else
  "Player Name"
end

我知道该@game-type变量是用 Rails 加载的,因此只是空白 - 但这就是 AJAX 的用武之地,这也是我有点困惑的地方。 这个问题似乎与我要问的内容相关,但它的不同之处在于我似乎无法让它在我自己的代码中工作。

4

1 回答 1

1

查看您所写的内容,在我看来,您对系统的某些方面感到困惑。我将简要解释我的意思,并希望有一个解决方案:

  1. 我将 MVC 称为“模块化”——当每个元素都完成其工作时,它的效果最好
  2. MVC 的“控制器”方面用于处理视图中的逻辑
  3. 因此,如果您需要创建基于逻辑的解决方案,则需要使用控制器
  4. 在我看来,Ajax 就像一个伪视图——它在不重新加载页面的情况下创建请求;并且应该只发送和处理来自控制器的响应(不执行逻辑)

从您所说的来看,您似乎最好将您的条件JSgame-type.js.erb从您的控制器加载到它自己的;像这样:

def game_type
  respond_to do |format|
      format.js { @game_type = params[:game_type] }
  end
end


#game_type.js.erb
#handle your conditional JS here
alert(<%=j @game_type %>)

你可以像这样将它绑定到你的 JS 中:

$(document).on('click', '.show-tabs .show-tab', function(){
  var tab = $('.tabs .tab:nth-of-type(' + ( $(this).index() + 1 ) + ')');
  ...      
  if ($(this).find('.checkbox').hasClass('checkBoxed')){
    tab.show();
    $.get('tournaments/game_type?game_type='+tab.attr("game-type"))
  } else {
    tab.hide();
  }
});

这应该输出警告框,这意味着您正在从控制器获取变量。然后由你来做你想做的事!

于 2013-10-21T08:48:58.490 回答