隐藏一个“清除”按钮，直到“应用”按钮，点击

我有一个表格，我有我下面的过滤器按钮（应用过滤器&清除过滤器）我想显示“清除”时，“应用”按钮点击时隐藏“清除”按钮。隐藏一个“清除”按钮，直到“应用”按钮，点击

下面的代码，如果我有我的表：

<dl class="filterlist" style="margin-top: 0px"> 
     <dt> 
      <label for="Environment">Environment</label> 
     </dt> 
     <dd> 
      @Html.DropDownList("EnvironmentDD", (IEnumerable<SelectListItem>)ViewBag.Environment, "- - All Environments - -", 
       new { @class = "ddstyle", @id = "Environment", @title = "Filter the table below by environment." }) 
     </dd> 
     <dt> 
      <label for="Product">Product</label> 
     </dt> 
     <dd> 
      @Html.DropDownList("ProductDD", (IEnumerable<SelectListItem>)ViewBag.Product, "- - All Products - -", 
       new { @class = "ddstyle", @id = "Product", @title = "Filter the table below by product." }) 
     </dd> 
     <dt> 
      <label for="TestType">Test Type</label> 
     </dt> 
     <dd> 
      @Html.DropDownList("TestTypeDD", (IEnumerable<SelectListItem>)ViewBag.TestType, "- - All Test Types - -", 
       new { @class = "ddstyle", @id="TestType", @title="Filter the table below by test type." }) 
     </dd> 
     <dt> 
      <label for="TestScenario">Test Scenario</label> 
     </dt> 
     <dd> 
      @Html.DropDownList("ScenarioDD", (IEnumerable<SelectListItem>)ViewBag.Scenario, "- - All Test Scenarios - -", 
       new { @class = "ddstyle", @id="TestScenario", @title="Filter the table below by test scenario." }) 
     </dd> 
     <dt>&nbsp;</dt> 
     <dd> 
      <button class="butstyle" id="ApplyFilter" type="submit" title="Click to apply any filters selected above."> 
       Apply Filter(s) <i class="fa fa-filter"></i> 
      </button> 
      <button class="butstyle" id="ClearFilters" title="Click to reset any filters set." style="display:none"> 
       Clear Filter(s) <i class="fa fa-eraser"></i> 
      </button> 
     </dd> 
    </dl>

我该怎么做或什么是为我似乎无法让我的头周围的最好方式。我正在使用HTML5 & MVC5。

默认情况下，该按钮设置为：

style="display:none">

来源

2014-03-25 murday1983

我宁愿Ø做到这一点不带Java/jQuery的可能的话 – murday1983

您可以使用“复选框黑客”。 [链接]（http://stackoverflow.com/questions/11166580/css3-transitions-is-there-an-on-click-option-without-using-jquery） – RobinvdA

可能有人请为此提供jQuery的，因为我已经找到使用这将是最好的选择。 AJ提供的那个似乎不起作用。即使在他们提供的小提琴 – murday1983

没有JQuery的：

<button onclick="document.getElementById('ClearFilters').style.display='block';" class="butstyle" id="ApplyFilter" type="submit" title="Click to apply any filters selected above."> 
    Apply Filter(s) <i class="fa fa-filter"></i> 
</button> 
<button onclick="document.getElementById('ClearFilters').style.display='none';" class="butstyle" id="ClearFilters" title="Click to reset any filters set." style="display:none"> 
    Clear Filter(s) <i class="fa fa-eraser"></i> 
</button>

唯一的另一种方法是具有当按下按钮的页面重新加载，做哪个按钮被按下的支票......

来源

2014-03-25 15:46:29

这是我正在寻找的，但它第一次工作（显示清除按钮），然后删除它，但当我尝试点击应用按钮再次清除按钮闪烁然后隐藏。 – murday1983

因为这[[小提琴]（http://jsfiddle.net/56Exs/）的作品...必须有其他的东西导致那么... ... –

我不认为这可以在不使用JavaScript/jQuery的使用jQuery ..来完成这是你正在寻找

$("#ApplyFilter").click(function(){ 
$("#ClearFilters").toggle(); 
    $(this).toggle(); 
}); 
$("#ClearFilters").click(function(){ 
$("#ApplyFilter").toggle(); 
    $(this).toggle(); 
});

什么

检查这个fiddle我做出来你的HTML。

来源

2014-03-25 15:39:28

你显然没有阅读他对“我更喜欢o如果可能的话，不用java/jquery就可以做到这一点。“ – VtoCorleone

@AnanthanUnni：我在我的回答中提到它不可能在没有脚本的情况下达到要求！或者是您对提问的用户的评论？ –

@AnanthanUnni：好的..但是这应该发布到问题上。 –

已经决定虽然隐藏'清除'按钮将是一个'很高兴'，它应该随时显示，并可能在将来的修复程序中隐藏它，一旦应用程序启动并运行。

感谢所有的意见/帮助。

来源

2014-03-27 09:05:54 murday1983

隐藏一个“清除”按钮，直到“应用”按钮，点击

回答

相关问题