有条件地禁用 link_to答案

【问题标题】：conditionally disable a link_to有条件地禁用 link_to
【发布时间】：2016-05-10 17:21:02
【问题描述】：

在我的 Rails 应用程序中，我希望人们只有在输入项目标题后才能删除项目：

我当前的“删除按钮”链接定义如下：

   <%= link_to "Delete Project", @project, :method=> :delete, :class=>"btn btn-danger disabled delete_project_btn"%>

为什么样式可以正常工作，即使按钮具有禁用类，用户仍然可以单击链接。

我希望只有在用户添加了项目名称后才能删除该项目：

$('.delete_project_btn').click(function(e){
    if($(this).hasClass('disabled')){
      console.log('preventing link click');
      e.preventDefault();
    }else{

    }
  });

    $('.delete_project_text_area').blur(function(){
      if($(this).val() == <%=@project.title%>){
        $('.delete_project_btn').removeClass('disabled');
      }else{
        if(!$('.delete_project_btn').hasClass('disabled')){
          $('.delete_project_btn').addClass('disabled');  
        }
      }
    });

当我在没有输入项目名称的情况下单击“删除项目”按钮时，我能够看到日志消息“阻止链接单击”，但它仍在删除项目。

如何有条件地禁用 link_to？

【问题讨论】：

为了更好的衡量，您是否也尝试在e.preventDefault(); 之后执行return false;？

标签： ruby-on-rails forms link-to

【解决方案1】：

我最终删除了原始的 link_to 并用一个虚拟按钮替换它，只有在用户输入项目的完整标题后才添加链接：

  <div class="modal-footer">
    <button type="button" class="btn btn-cancel" data-dismiss="modal" aria-hidden="true">Cancel</button>
    <button class="btn btn-danger delete_project_btn disabled">Delete Project</button>
  </div>
</div>

<script type="text/javascript">

    $('.delete_project_text_area').bind('input propertychange', function(){
      if($(this).val() == "<%=@project.title%>"){
        $('.delete_project_btn').replaceWith('<%=link_to "Delete Project", @project, :method=> :delete, :class=>"btn btn-danger delete_project_btn"%>');
      }else{
        if(!$('.delete_project_btn').hasClass('disabled')){
          $('.delete_project_btn').replaceWith('<button class="btn btn-danger delete_project_btn disabled">Delete Project</button>');
        }
      }
    });
</script>

【讨论】：