使用Linkbutton和C＃隐藏面板和javascript

我是一个新的程序员，所以任何帮助或建议，将不胜感激。使用Linkbutton和C＃隐藏面板和javascript

我有一个datalist包含显示一行数据的链接按钮。点击链接按钮时，应该取消隐藏包含数据列表（也包含链接按钮）的面板，以显示更详细的信息。我遇到的问题是，当我点击摘要链接按钮时，它不会触发JavaScript来隐藏或显示详细信息面板。我没有得到任何例外，我的程序会建立并运行，所以我不确定为什么JavaScript不会触发。仅供参考，DBClass和DbClass对象是内部类，它们工作正常。这里是我的代码：

using System; 
usingSystem.Collections; 
usingSystem.Configuration; 
usingSystem.Data; 
usingSystem.Linq; 
usingSystem.Web; 
usingSystem.Web.Security; 
usingSystem.Web.UI; 
usingSystem.Web.UI.HtmlControls; 
usingSystem.Web.UI.WebControls; 
usingSystem.Web.UI.WebControls.WebParts; 
usingSystem.Xml.Linq; 
usingDBClass; 


namespaceTimeLogging.pages 
{ 
    publicpartialclassdbEntry:System.Web.UI.Page 
    { 
    QueryClassqc=newQueryClass(); 

    protectedvoidPage_Load(objectsender,EventArgse) 
    { 
    bindDlReportProjSum_devSummary(); 
    } 

    //getsthelinkbuttonattributefortheemployeeidsothatitcanbeboundtothedatalist 
protectedvoiddlReportProjSum_devSummary_OnItemDataBound(objectsender,DataListItemEventArgse) 
{ 
    if(e.Item.ItemType == ListItemType.Item 
    || e.Item.ItemType == ListItemType.AlternatingItem) 
    { 
    DataListnestedDataList=(DataList)e.Item.FindControl("dlReportProjSum_devDetail"); 
    LinkButtonlinkbtn=(LinkButton)e.Item.FindControl("lbReportProjSum_devSummary"); 
    bindDlReportProjSum_devDetail(nestedDataList,linkbtn.Attributes["empid"]); 
    //Panelpan=(Panel)e.Item.FindControl("panReportProjSum_devDetail"); 
    } 
} 

//hidesthedevedetailpanelonlinkbutttonclick 
protectedvoiddlReportProjSum_devSummary_OnItemCommand(objectsender,DataListCommandEventArgse){ 

LinkButtonlb=(LinkButton)e.Item.FindControl("lbReportProjSum_devSummary"); 
Panelpan=(Panel)e.Item.FindControl("panReportProjSum_devDetail"); 
} 

//thedatalistthatshowsasummaryofeachemployeewhohasworkedonaproject 
protectedvoidbindDlReportProjSum_devSummary(){ 
DbClassdb=newDbClass(); 
DataTabledt=newDataTable(); 
[email protected]"selectname,empid,sum(actualtime)astotal 
fromTime_logging_vwProjDevDetail 
whereprojid=1 
groupbyempid,name"; 
db.OpenConnection(); 
db.Execute(sqlString); 
dt=db.GetData.Table; 
dlReportProjSum_devSummary.DataSource=dt; 
dlReportProjSum_devSummary.DataBind(); 
db.CloseConnection(); 
db.Dispose(); 
} 



//bindthenesteddatalistinthedevSummaryOnItemDataBoundevent 
privatevoidbindDlReportProjSum_devDetail(DataListdl,stringdevEmpid) 
{ 
DbClassdb=newDbClass(); 
DataTabledt=newDataTable(); 
stringsqlString=string.Format(@"selectDAYOF,ESTTIME,ACTUALTIME,NOTES,TASK 
fromtime_logging_resourceswhere 
projid=1andempid={0}",devEmpid); 
db.OpenConnection(); 
db.Execute(sqlString); 
dt=db.GetData.Table; 
dl.DataSource=dt; 
dl.DataBind(); 

db.CloseConnection(); 
db.Dispose(); 
} 



////whenthedeveloperssummaryoftotalhoursonaprojectisclicked 
protectedvoidlbReportProjSum_devSummary_Click(objectsender,EventArgse) 
{ 
ClientScript.RegisterStartupScript(GetType(),"Javascript","HidePanel()",true); 

} 

} 
} 

ASPXpage//////////////////////////////////////////////////////////////////////////////// 


<%@PageLanguage="C#"AutoEventWireup="true"CodeBehind="dbEntry.aspx.cs"Inherits="TimeLogging.pages.dbEntry"%> 

<%@RegisterAssembly="AjaxControlToolkit"Namespace="AjaxControlToolkit"TagPrefix="asp"%> 

<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<htmlxmlns="http://www.w3.org/1999/xhtml"> 
<headrunat="server"> 
<title>UntitledPage</title> 
<linkhref="../css/Main.css"rel="stylesheet"type="text/css"/> 

<scripttype="text/javascript"language="javascript"> 
functionHidePanel() 
{ 
alert("hello"); 
varpanel=document.getElementById('panReportProjSum_devDetail'); 
if(panel.style.display=='none') 
{ 
panel.style.display='block'; 
} 
else 
{ 
panel.style.display='none'; 
} 
} 
</script> 

</head> 
<body> 
<formid="form1"runat="server"> 

<asp:ToolkitScriptManagerID="ToolkitScriptManager1"runat="server"> 
</asp:ToolkitScriptManager> 
<div> 
<asp:PanelID="panMainReportsHolder"runat="server"> 

<asp:DataListID="dlReportProjSum_devSummary"runat="server"RepeatDirection="Vertical" 
ShowFooter="False"ShowHeader="False"OnItemDataBound="dlReportProjSum_devSummary_OnItemDataBound" 
OnItemCommand="dlReportProjSum_devSummary_OnItemCommand"> 
<HeaderTemplate> 
</HeaderTemplate> 
<ItemTemplate> 
<div> 
<asp:LinkButtonID="lbReportProjSum_devSummary"OnClick="lbReportProjSum_devSummary_Click" 
runat="server"empid='<%#DataBinder.Eval(Container.DataItem,"empid")%>'name='<%#DataBinder.Eval(Container.DataItem,"name")%>' 
total='<%#DataBinder.Eval(Container.DataItem,"total")%>'CssClass="developerSummaryLinkButton"><%#DataBinder.Eval(Container.DataItem,"name")%>'stotalhoursspentdevelopingtheproject:<%#DataBinder.Eval(Container.DataItem,"total")%> 

</asp:LinkButton> 

<asp:PanelID="panReportProjSum_devDetail"runat="server"> 

<asp:DataListID="dlReportProjSum_devDetail"runat="server"RepeatDirection="Vertical" 
ShowFooter="False"ShowHeader="False"> 
<HeaderTemplate> 
</HeaderTemplate> 
<ItemTemplate> 
<div> 
<asp:LinkButtonID="LinkButton1"CssClass="developerDetailLinkButton"runat="server" 
Enabled="false">Dateworked:<%#DataBinder.Eval(Container.DataItem,"dayof")%>task:<%#DataBinder.Eval(Container.DataItem,"task")%>numberofhoursworked:<%#DataBinder.Eval(Container.DataItem,"actualtime")%>anynotes:<%#DataBinder.Eval(Container.DataItem,"notes")%> 
</asp:LinkButton> 
</div> 
</ItemTemplate> 
<FooterTemplate> 
</FooterTemplate> 
</asp:DataList> 
</asp:Panel> 


</div> 
</ItemTemplate> 
<FooterTemplate> 
</FooterTemplate> 
</asp:DataList> 
</asp:Panel> 
</div> 
</form> 
</body> 
</html>

来源

2012-10-26 katyholb

你需要连接你的Linkbutton1来触发Javascript事件。您可以使用的OnClientClick属性像这样做：

<asp:LinkButtonID="LinkButton1"CssClass="developerDetailLinkButton"runat="server" Enabled="false" onclientclick="HidePanel();return false;"/>

将返回false防止它调用设置的onclick（如果有的话），服务器端事件。

了解更多关于这里的OnClientClick的答复，约翰MC enter link description here

来源

2012-10-26 13:51:16

感谢。我试了一下，它确实让我的JavaScript火。现在的问题是JavaScript无法找到面板对象。该面板位于数据列表中，我相信对JavaScript的调用必须来自后面的代码，因为该面板只能在绑定数据列表之前和期间访问。我需要找出为什么linkbutton的“OnCick”事件不会触发JavaScript，但我不明白页面的生命周期，并且控制得足够好，以便进行调试。 – katyholb

根据.NET版本和其他设置，'panReportProjSum_devDetail'可能不是您需要使用的客户端ID（早期版本的.NET在ID之前添加'ct100_'之类的内容以避免命名冲突）。相反，在HidePanel（）函数中，您可能想要尝试如下所示：varpanel = document.getElementById（'<％= panReportProjSum_devDetail.ClientID％>'）; – psantiago

为什么你需要使用Javascript来隐藏面板？你能不能在页面加载时执行此操作（PreRender事件）？你可以在后面的代码中以编程方式设置style = display：none。不要使用Visible = false –

使用Linkbutton和C＃隐藏面板和javascript

回答

相关问题