Нужна помощь для CSS для кнопки

Question

У меня есть страница asp.net. Существует боковая панель, в которой есть несколько кнопок. Появится еще одна кнопка «Изменить». Пожалуйста, посмотрите на мое изображение:

Мой вопрос: Я не хочу кнопку «Редактировать» отображается, если кнопка на боковой панели не будет нажата. Прямо сейчас отображается сообщение о дефолте. Моя цель - «Изменить», не показывает бесценный ответ, нажмите «Проблемы1», затем «Редактировать» появится под сеткой. Мой код:

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" 
CodeBehind="Default.aspx.cs" Inherits="WebTest._Default" %> 
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent"> 
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> 
<link href="Styles/Site.css" rel="stylesheet" type="text/css" /> 
</asp:Content> 
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent"> 
<div id="wrap"> 
<div id="sidebar"> 
     <asp:Button ID="p1" runat="server" Text="Problems1" CssClass="sidebar_buttons" 
     OnClientClick="Edit_Click()" /> 
     <asp:Button ID="p2" runat="server" Text="Problems2" CssClass="sidebar_buttons" 
      /> 
     <asp:Button ID="p3" runat="server" Text="Problem3" CssClass="sidebar_buttons" /> 
     <asp:Button ID="p4" runat="server" Text="Problem4" CssClass="sidebar_buttons" /> 
     <asp:Button ID="p5" runat="server" Text="Problem5" CssClass="sidebar_buttons" /> 
     <asp:Button ID="p6" runat="server" Text="Problem6" CssClass="sidebar_buttons" /> 
     <asp:Button ID="p7" runat="server" Text="Problem7" CssClass="sidebar_buttons" /> 
    </div> 
    <div id="gridview"> 
     <asp:GridView ID="GridView1" runat="server"> 
     </asp:GridView> 
    </div> 
     <div id="btnEdit" > 
     <asp:Button ID="Edit" runat="server" Text="Edit" /></div> 
</div> 

И CSS:

#wrap 
{ 
    width: 800px; 
    background-color: #99c; 
} 
#sidebar 
{ 
    float: left; 
    width: 125px; 
    padding-top:10px; 
    background-color: #C0C0C0; 
} 
#gridview 
{ 
    float: right; 
    width: 675px; 
} 

.sidebar_buttons 
{ 
    margin-top: 10px; 
    margin-left: 2px; 
    margin-bottom: 10px; 
    width: 120px; 
} 

#btnEdit 
{ 
    float: inherit; 
} 

Answer 1

первую очередь скрыть кнопку редактирования, вставляя это свойство в вашем

#btnEdit 
{ 
    float: inherit; 
    display:none; //hide your edit button 
} 

затем вызвать функцию JQuery на мыши и показать кнопку редактирования, как

$("#button").click(function(){ 
    $("#btnEdit").show(); 
}); 

Answer 2

В коде ASPX, установите кнопку редактирования видимым = ложь. Перейти в свойство других кнопок, перейдите в события и дважды щелкните событие и место кода «Нажмите кнопку», чтобы сделать кнопку видимой :)

Надеется, что это помогает

Answer 3

сначала добавить дисплей: нет; в CSS из btnEdit

#btnEdit 
{ 
    display:none; 
} 

Затем вы используете Jquery, чтобы показать btnEdit, когда «Problem1Button» щелчке (заменить его на идентификатор вашей кнопки)

<script> 
$(document).ready(function() { 
    $("#Problem1Button").click(function (event) { 
    $("#btnEdit").show();    

    }); 
} 
</script>