通过Ajax或jQuery的ASP.NET Floating Div菜单 [英] ASP.NET Floating Div Menu via Ajax or jQuery
问题描述
问题:我有一个主页面,规定了css,html,head,body内容,所以我不能使用浮动div技术,而需要走ajax/asp唯一的路线.我在网上可以找到的所有相关人员都在实现此问题时遇到问题,但没有实际的示例代码.
Problem: I have a master page dictating the css, html, head, body content so I can't use the floating div technique and need to go trough the ajax/asp only route. All I have been able to find online on this subject is people having problems with implementing this but no actual working example code.
我尝试在jtricks.com上使用基于jQuery的浮动div菜单说明是针对html文件而不是asp.net文件的,并且导致了页面加载错误.
I tried using the jQuery based floating div menu off jtricks.com but the instructions were for an html file not a asp.net file and caused an error with the page load.
<script type="text/javascript" src="specify script file URL here">
</script>
<div id="floatdiv" style="
position:absolute;
width:200px;height:50px;top:10px;right:10px;
padding:16px;background:#FFFFFF;
border:2px solid #2266AA;
z-index:100">
This is a floating javascript menu.
</div>
<script type="text/javascript">
floatingMenu.add('floatdiv',
{
// Represents distance from left or right browser window
// border depending upon property used. Only one should be
// specified.
// targetLeft: 0,
targetRight: 10,
// Represents distance from top or bottom browser window
// border depending upon property used. Only one should be
// specified.
targetTop: 10,
// targetBottom: 0,
// Uncomment one of those if you need centering on
// X- or Y- axis.
// centerX: true,
// centerY: true,
// Remove this one if you don't want snap effect
snap: true
});
</script>
请提供一些有关通过Ajax在TabContainer或DragPanel中使用浮动div的示例代码.
Please provide some sample code on using floating divs in TabContainer or DragPanel via Ajax.
谢谢! :)
推荐答案
要使基于jquery的浮动div菜单正常工作,我将div的代码放在DynamicDataManager控件之后和ASP UpdatePanel中的ASP Content Main部分中:
To make the jquery based floating div menu work, I put the code for the div within the ASP Content Main Section after the DynamicDataManager Control and in the ASP UpdatePanel:
<asp:Content ID="main" ContentPlaceHolderID="main" Runat="Server">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<EditItemTemplate>
<div id="floatdiv" style="position:absolute; width:200px; height:50px; top:10px; right:10px; padding:16px;background:#FFFFFF; border:2px solid #080808; z-index:100">
<asp:LinkButton ID="LinkButton1" runat="server" CommandName="Update" Text="Update" style="right:25px; padding:25px" updateDisabled = "updateDisabled +1; if (updateDisabled == 1) {return true;} else {this.disabled=true;return false;};" />
<asp:LinkButton ID="LinkButton2" runat="server" CommandName="Cancel" Text="Cancel" CausesValidation="false" />
</div>
我还添加了一个禁用更新按钮,以防止人们在数据库中创建2条重复记录:
I also added a disable update button to prevent people creating 2 duplicate records in the DB:
<asp:DynamicEntity runat="server" Mode="Edit" OnInit="DynamicEntity_Init"/>
<script language="javascript" type="text/javascript"> var updateDisabled = 0; </script>
<asp:LinkButton runat="server" CommandName="Update" Text="Update" OnClientClick="updateDisabled = updateDisabled +1; if (updateDisabled == 1) {return true;} else {this.disabled=true;return false;};" />
<asp:LinkButton runat="server" CommandName="Cancel" Text="Cancel" CausesValidation="false" />
我将实际脚本放入ASP Content Main标记中,但位于更新面板"之后:
I put the actual script within the ASP Content Main tag but after the Update Panel:
<script type="text/javascript">
floatingMenu.add('floatdiv',
{
// Represents distance from left or right browser window
targetRight: 10,
// Represents distance from top or bottom browser window
targetTop: 10,
snap: true
});
</script>
这篇关于通过Ajax或jQuery的ASP.NET Floating Div菜单的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!