Panel.GroupingText in ContenPlaceholder shows first in all Panels - c#

On my asp webforms page I have code similar to this:
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContentPlaceHolder">
<asp:Panel ID="pnltest1" runat="server" GroupingText="Panel1">
Panel 1
</asp:Panel>
<asp:Panel ID="pnltest2" runat="server" GroupingText="Panel2">
Panel 2
</asp:Panel>
</asp:Content>
The problem is that in both fieldsets the legend-tag has the text of the first panel groupingtext ("Panel 1").
If I test it without the use of a master page all is correct.
Can someone explain this?

Thanks to Tim I have found the error. I was focusing on web-controls while the error was in bad coded javascript.
The following line of javascript produced the error:
$('legend').html('<span>' + $('legend').html() + '</span>');
After changing it to
$('legend').each(function () {
$(this).html('<span>' + $(this).html() + '</span>');
});
all is working fine again.

Related

Server Tags with HTML and Code Blocks inside

I'm trying to do something like this:
<asp:ListItem><div><%= Message.Success %></div></asp:ListItem>
but it gives me this error:
ASP.NET runtime error: Code blocks are not supported in this context.
Any ideas as to how to work around this error?
You need a Binding Expression inside Controls <%# %>.
<asp:ListView ID="ListView1" runat="server">
<ItemTemplate>
<div>
<%# Message.Success %>
</div>
</ItemTemplate>
</asp:ListView>
However this does not work in a ListItem. You will need to add that item with code if you want the Message.Success to be displayed.
DropDownList1.Items.Add(new ListItem() { Text = Message.Success, Value = "0" });

How to trigger ajax tabContainer resize in jQuery in asp.net c#?

I have ajax TabContainer in my App.
<asp:Panel ID="RightPanel" runat="server" CssClass="sizeForWrapper" style="width: 80%;float: right;">
<ajaxToolkit:TabContainer ID="TabContainer1" runat="server" OnDemand="true"
AutoPostBack="false" TabStripPlacement="Top" ActiveTabIndex="0">
<ajaxToolkit:TabPanel ID="TabPanelDims" runat="server" HeaderText="Dimensions" Enabled="true"
ScrollBars="Auto" OnDemandMode="Once">
<ContentTemplate>
...
</ContentTemplate>
</ajaxToolkit:TabPanel>
</ajaxToolkit:TabContainer>
</asp:Panel>
And I have some background image for main content of the page. The problem is that content of the panel is resizeble, so it can grow up=), and I want my background grow up too.
Inside this panel I have some inputs, so I've tried to do this in jQuery:
$('input').bind('click',function () {
$('.pageWrapper').height($('.sizeForWrapper').height() + 10);
});
pageWrapper is my background, and sizeForWrapper I added to Panel, but this works only for 1 click, so when I click multiple times it doesn't work.
My question is how to automatically trigger sizeForWrapper height change?
Update
The last thing that got into my head is:
window.setInterval(function () {
$('.pageWrapper').height($('.sizeForWrapper').height() + 10);
}, 50);
But for me it looks weird, isn't? How bad is that?
Finally
I found my own way=) Will post it as answer later.
http://benalman.com/projects/jquery-resize-plugin/
Upvotes appreciates if it helps somebody else=)
This guy has great plug-in
http://benalman.com/projects/jquery-resize-plugin/
Check this out=)

Printing the contents of a div in IE

Ok so for some reason my div prints out the way it should in Firefox and Chrome but then when I go to IE it doesnt work. It only prints out one page of the div then the header and footer. I have tried adding some new code to see if I can get it to work better but still having issues. The current code does print out fine but doesnt inherit the divs styling that they had on the page and not in an external style sheet. The commented out code below is what they had there before. Does anyone have any help?
function buildPrint() {
var sourceDiv = document.getElementById("display_div");
var WindowObject = window.open('', 'print_div', 'width=750,height=650,top=50,left=50,toolbars=no,scrollbars=yes,status=no,resizable=yes');
WindowObject.document.writeln(sourceDiv.innerHTML);
WindowObject.document.close();
WindowObject.focus();
WindowObject.print();
WindowObject.close();
//document.getElementById("print_div").innerHTML = sourceDiv.innerHTML;
//window.print();
}
<asp:Content ID="Content3" ContentPlaceHolderID="BodyPlaceHolder" runat="server">
<div id="display_div">
<asp:CheckBox ID="showAllOptionals" runat="server" Text="Show All Optionals" AutoPostBack="true" />
<asp:Literal ID="mainTable" runat="server" />
</div>
</asp:Content>
<asp:Content ID="Content4" ContentPlaceHolderID="PrintContent" runat="server">
<div id="print_div" style="page-break-after:avoid;">
</div>
</input><input onclick=\"buildPrint();\" id=\"printBtn\" type=\"button\" value=\"Print\">
I got the solution, I had to add different CSS to it so the div overflowed and printed. Thanks for all the help

AJAX UpdatePanel help needed

I have the following ASPX code:
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel runat="server" ID="UpdatePanel" UpdateMode="Conditional">
<ContentTemplate>
<asp:Button runat="server" ID="UpdateButton1" OnClick="NextImg_Click" Text="Update" />
<asp:Repeater runat="server" ID="urlsUpdateRepeater">
<ItemTemplate>
<!-- THIS WOULD BE A LOOP FROM HERE -->
<!-- OPENS RESULT ITEM DIV CONTAINER -->
<div id="result_item">
<a href="<%# Eval("myUrl") %>" target="_blank">
<%# Eval("urlPageTitle")%></a>
</ItemTemplate>
</asp:Repeater>
</ContentTemplate>
</asp:UpdatePanel>
I have a NextImg_Click() event which works fine.
I use this code for DataBind... what is the Update method?
urlsUpdateRepeater.DataSource = resultsCollection;
urlsUpdateRepeater.DataBind();
Everything would appear to be in order. But every time the Update button is clicked it re-renders the whole page instead of the partial-postback UpdatePanel only.
It is driving me completely mad as I can't see anything wrong with the code. Is there some simple thing I'm missing?! Please help!
The search and data is displayed correctly (inside the panel) it just will not do a partial postback.
Appreciate your help with my noob problems!
Because the button is inside your UpdatePanel's ContentTemplate, it is unnecessary to take any extra action to get a partial page postback.
Try removing the line from your Page_Load() method.
Taken from MSDN:
Use the RegisterAsyncPostBackControl
method to register controls outside an
UpdatePanel control as triggers for
asynchronous postbacks, and to
potentially update the content of an
update panel. To update an UpdatePanel
control programmatically, call the
Update method.
So, you're control (UpdateButton1) is inside the UpdatePanel, no need for the ScriptManager1.RegisterAsyncPostBackControl call - ditch it and your problem is solved.
The problem was that my <form> tag was nested further into the document than it's corresponding end tag (with Warning!)...
Upon moving my form tag - it worked!
Entirely my fault, thanks guys.

Setting focus on top of the page on click of asp.net link button

I've a asp.net datagrid which shows customer order details.
Pagination at the bottom of the grid is done using datalist and asp.net Linkbutton controls.
Here is the code:
<asp:DataList ID="DataList2" runat="server" CellPadding="1" CellSpacing="1"
OnItemCommand="DataList2_ItemCommand"
OnItemDataBound="DataList2_ItemDataBound" RepeatDirection="Horizontal">
<ItemTemplate>
<asp:LinkButton ID="lnkbtnPaging" runat="server"
CommandArgument='<%# Eval("PageIndex") %>'
CommandName="lnkbtnPaging"
Text='<%# Eval("PageText") %>' />
<asp:Label runat="server" ID="lblPageSeparator" Text=" | " name=></asp:Label>
</ItemTemplate>
</asp:DataList>
When the user clicks on any page number(ie.Link button), I need to set focus on top of the page.
How do i do this?
Thanks!
I think the default behaviour would be for the page scroll position to be set back to the top of the page. Is there anything else in your page that might be overriding this behaviour?
For example:
Is your DataList inside an UpdatePanel? In that case the current scroll position will be maintained over a (partial) post-back. You would therefore need to reset the scroll position to the top of the page yourself. One way to do this would be to implement a handler for the PageRequestManager's EndRequest client-side event which would set the scroll position - this thread explains how
Is the Page MaintainScrollPositionOnPostBack property set to true?
You could try setting a named anchor at the top of the page. Here is an article that explains it http://www.w3schools.com/HTML/html_links.asp
After an AJAX partial postback you may need to return to the top of your ASPX page to display an error message, etc. Here is one way that I have done it. You can add the JavaScript function below to your ASPX page and then call the method when needed in your code-behind by using the ScriptManager.RegisterClientScriptBlock method.
ASP.NET C# Code-behind:
ScriptManager.RegisterClientScriptBlock(this, Page.GetType(),
"ToTheTop", "ToTopOfPage();", true);
JavaScript:
<script type="text/javascript">
function ToTopOfPage(sender, args) {
setTimeout("window.scrollTo(0, 0)", 0);
}
You can also just JavaScript to scroll to the top of the page by using the OnClientClick property of your button. But this will cause this behavior to occur every time the button is clicked and not just when you want it to happen. For example:
<asp:Button id="bntTest" runat="server"
Text="Test" OnClick="btn_Test" OnClientClick="javascript:window.scrollTo(0,0);" />
<asp:LinkButton ID="lbGonder" runat="server" CssClass="IK-get" ValidationGroup="ik" OnClick="lbGonder_Click" OnClientClick="ddd();" title="Gönder">Gönder</asp:LinkButton>`
<script type="text/javascript">
var ddd = (function () {
$('body,html').animate({
scrollTop: 300
}, 1453);
return false;
});

Categories