how can i make fixed tree view in asp.net - c#

I have treeview in asp website when click linked node it redirect the whole page the treeview not remain to the page. but what i want only to change the the main page the tree view must remain in all page like windows explorer. I'm using asp.net website please help me how can i do that?
This is my treevew.
Home
page1
page2
page3
page4

Create a Master page that have tree view within the table as following
<table border="0" cellspacing="0" cellpadding="0" id="content-container" style="width: 1016px; height: 407px;">
<tbody>
<tr>
<td id="content-left" style="width: 200px; height: 424px; border-top-style: solid; border-right-style: solid; border-left-style: solid; border-bottom-style: solid; border-bottom-color: buttonface; border-top-color: buttonface; border-right-color: buttonface; border-left-color: buttonface;">
<!--
LEFT COLUMN
-->
<br />
<asp:Panel ID="Panel1" runat="server" Height="455px" Width="220px">
<asp:TreeView ID="tvNodes" runat="server" Height="448px" Width="215px" ShowLines="True">
</asp:TreeView>
</asp:Panel>
</td>
<td id="content" style="width: 736px; height: 424px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-bottom-color: buttonface; border-top-color: buttonface; border-right-color: buttonface; ">
<asp:contentplaceholder id="ContentPlaceHolder1" runat="server" >
</asp:contentplaceholder>
</td>
</tr>
</tbody>
</table>
And load the page to the ContentPlaceHolder1 on node click event.

Related

Cant Access Bootstrap WYSWYG from code Behind

I am using the bootstrap wsywyg editor but I am having problems in .net getting its values. I am Running the editor in my asp.net webpage with materpage with the following markup
<div class="box">
<div class="box-header">
<h3 class="box-title">Bootstrap WYSIHTML5 <small>Simple and fast</small></h3>
<!-- tools box -->
<div class="pull-right box-tools">
<button class="btn btn-default btn-sm" data-widget="collapse" data-toggle="tooltip" title="Collapse"><i class="fa fa-minus"></i></button>
<button class="btn btn-default btn-sm" data-widget="remove" data-toggle="tooltip" title="Remove"><i class="fa fa-times"></i></button>
</div><!-- /. tools -->
</div><!-- /.box-header -->
<div class="box-body pad">
<textarea id="txtDescription" name="txtDescription" class="textarea" placeholder="Place some text here" style="width: 100%; height: 200px; font-size: 14px; line-height: 18px; border: 1px solid #dddddd; padding: 10px;"></textarea>
</div>
</div>
</div>
Howver I have treid the following to gain access to the text behind code
Request.Form["txtDescription"] But the Value is null baring in mind my entire page is wrap in the following code.
<form id="main" runat="server">
<asp:ContentPlaceHolder ID="cptUniteCmsContent" runat="server">
</asp:ContentPlaceHolder></form>
Just wondering if anyone else new how to gain access to it. Must I referance my masterpage some how as If I try to use find control it does not work.
You need to indicate runat="server" for each of your controls.
For instance:
<textarea id="txtDescription" name="txtDescription" class="textarea" placeholder="Place some text here" style="width: 100%; height: 200px; font-size: 14px; line-height: 18px; border: 1px solid #dddddd; padding: 10px;"></textarea>
Needs to be changed to:
<textarea id="txtDescription" name="txtDescription" class="textarea" placeholder="Place some text here" style="width: 100%; height: 200px; font-size: 14px; line-height: 18px; border: 1px solid #dddddd; padding: 10px;" runat="server"></textarea>

How to remove overflow: hidden using with telerik

Below is code before convert to HTML.I want to change overflow hidden.I found many way of CSS file. But couldn't find it and try using id to change css always no responding.
Telerik Code
<telerik:ReportViewer ID="ReportViewer1" runat="server" Height="800px"
Width="100%"></telerik:ReportViewer>
HTML View Through Browser Developer tools
<td id="TD_2">
<div id="TD2" style="overflow-y: auto; padding-left: 100px; width: auto; overflow-x:
hidden; position: inherit; height: 355px;">
<telerik:ReportViewer ID="ReportViewer1" runat="server" Height="800px"
Width="100%"></telerik:ReportViewer>
</td>

How to Scroll start with bottom when page is loaded

Hi I am doing a social network service using asp.net/c#, I have little problems with message sending.
when i am starting to send message scroll display like this. when i press send message it shows old message first and scroll is top, but i want newer message it mean's when i page loaded page should be showed new messages first
my aspx codes
<div style=" overflow-y:auto; height:368px; margin-top: -50px; border-top-style: groove; border-right-style: groove; border-left-style: groove; width: 602px; margin-left: 0px;" >
<asp:Repeater runat="server" ID="Repeater1" >
<ItemTemplate>
<div style="border-top: thin none #BBCEB3; border-bottom: thin none #BBCEB3; padding: 10px; width: 548px; margin-top: -10px; right: 10px; left: 10px; border-left-width: thin; margin-left: 15px; background-color: #fffff0; border-left-color: #BBCEB3; border-right-color: #BBCEB3; border-top-style: groove; border-bottom-style: groove;">
<br />
<div style="width: 58px; height: 40px">
<asp:Image ID="Image2" runat="server" Height="59px" ImageAlign="Top" ImageUrl='<%#Eval("SProfilePic") %> ' Width="55px" />
</div>
<div style="width: 307px; margin-left: 65px; margin-top: -60px">
<asp:Label ID="Label6" runat="server" Font-Bold="True" Font-Names="Arial" ForeColor="#000066"><%#Eval("SenderName") %> </asp:Label>
</div>
<div id="status" style=" width: 461px; margin-left: 78px; margin-top: 11px;"> <asp:Label ID="Label7" runat="server" Font-Italic="False" ForeColor="Black" Font-Size="Medium"><%#Eval("Messages") %> </asp:Label>
</div>
<div style="margin-left: 400px; background-color: #C0C0C0;">
<asp:Label ID="Label11" runat="server" Text="" Font-Size="Small"><%#Eval("Time") %> </asp:Label>
</div>
</div>
</ItemTemplate>
Put server controller there for example this:
<asp:Button ID="BtnOutside" runat="server" Text="Random" style="margin-left:-999px;" />
And then use
Page.SetFocus(Me.BtnOutside.ClientID);
To get focus to that button which is not visible to the client because of the negative margin. This should push the scroll bar to the bottom.
Put this in your code wherever you want to Focus on -- You can use this
multilple times in the same code set just change the "ID"
<asp:Button ID="FocusBottom" runat="server" Text="Random" style="margin-left:-999px;"
In the event(button click whatever) put in this.
Page.SetFocus(FocusBottom);
Change the (#######) to "ID" you want to call

Using CSS id selector to style Gridview control

I have an existing CSS file with these 2 id selectors:
#TableHead {
font-family: Arial, Helvetica, sans-serif;
font-size:11px;
font-weight: bold;
color: #000000;
border-top-width: thin;
border-top-style: solid;
border-top-color: #A9AAAA;
border-bottom-width: thin;
border-bottom-style: solid;
border-bottom-color: #A9AAAA;
}
#TableDivs {
border-bottom-width: 1px;
font-size:11px;
border-bottom-style: dotted;
font-family:Arial, Helvetica, sans-serif;
border-bottom-color: #A9AAAA;
}
I need to use "TableHead" to style Gridview header and "TableDivs" to style the rest of the Gridview control.
I am able to use TableDivs by enclosing the gridview in section.
How can I use TableHead to style the header? Where should I specify id="TableHead"?
The rendered source code of Gridview after adding is:
<div id="TableDivs">
<div>
<table cellspacing="0" rules="all" border="0" id="ctl00_Main_GridView1" style="border-width:0px;font-weight:normal;border-collapse:collapse;">
<tr>
<th align="left" scope="col">
File Name
</th>
<th align="left" scope="col">Description
</th>
<th align="left" scope="col">Folder Name
</th>
<th align="left" scope="col">
Date Added
</th>
</tr>
<tr>
<td style="width:30%;">
<a id="ctl00_Main_GridView1_ctl02_btnDownload" href="javascript:__doPostBack('ctl00$Main$GridView1$ctl02$btnDownload','')">2.txt</a>
</td>
<td style="width:40%;">222222</td><td style="width:25%;">group11</td>
<td style="width:5%;">
<span id="ctl00_Main_GridView1_ctl02_lblDateAdded"></span>
</td>
</tr>
<tr>
...
</tr>
</table>
</div>
</div>
<asp:GridView HeaderStyle-CssClass="your_class" ></asp:GridView>
You should ideally use
Gridview .table, Gridview .th, Gridview .tr, Gridview .tr
selectors. This will help you select the gridview or all similar gridviews and give them a common look and feel.
It also allows CSS to do the styling instead of writing code in .NET and specifying the class.
<asp:GridView ID="gridId" runat="server" >
<HeaderStyle CssClass="TableHead" />
<RowStyle CssClass="TableDivs" />
</asp:GridView>
<asp:GridView ID="TableDivs" runat="server" >
use some js to get the parent of ths or just thead(if GridView can export thead), then add #TableHead to the element.
</asp:GridView>
Thanks everyone for the help.
Finally I had no choice but to modify all the css files and add new class selectors, because I had no way of using the id selectors. I used the new class selectors in GridView's HeaderStyle, RowStyle, PagerStyle cssclass attribute.
It is working fine now.

pop up page , when a link button is clicked

<td colspan ="2" style="width: 64px">
<div style="float:left; padding-left:9px;">
<asp:LinkButton ID="lnkremoveloc" runat="server"
OnClick="lnkremoveloc_Click" CssClass="linkclass"
style="cursor:pointer" Font-Underline="True"
Font-Bold="true" Font-Size="12px">
Remove Location
</asp:LinkButton>
</div>
</td>
This is the link button from where i get a popup when clicked.
The popup page is like below. But when i click this link, the same page gets refreshed and i loose Save and Cancel button instead of opening a popup. Can someone help me out. I have no idea where i am doing wrong. Thanks a lot...
<%# Page Language="C#" AutoEventWireup="true" CodeFile="DisableLocation.aspx.cs" Inherits="DisableLocation" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%--<html xmlns="http://www.w3.org/1999/xhtml" >--%>
<script language ="javascript" type="text/javascript" >
function PopupCenter(pageURL, title,w,h) {
var left = (screen.width/2)-(w/2);
var top = (screen.height/2)-(h/2);
var targetWin = window.open (pageURL, title, 'toolbar=no, location=no, directories=no,
status=no, menubar=no,scrollbars=no, resizable=no, copyhistory=no, width='+w+',
height='+h+', top='+top+', left='+left);
}
</script language ="javascript" type="text/javascript">
<html>
<head runat="server">
<title>Disable Location | DealTown.com</title>
</head>
<body>
<form id="form1" runat="server">
<div style="display: block; background: url(images/reusable_blue_bg.jpg) repeat-x 0 -15px;border-left: #88b9c7 1px solid; border-bottom:#88b9c7 1px solid; border-top:#88b9c7 1px solid; border-right: #88b9c7 1px solid; padding: 0px 2px; height: 236px; min-height: 236px; height: auto; margin-left: auto; margin-right: auto;">
<table align="center" style="width: 554px; border-top-style: none; border-right-style: none;
border-left-style: none; border-bottom-style: none" id="TABLE1">
<tr >
<td align="center" colspan="5" style="font-weight:normal;font-size:18px;margin: 0px;font-family: Arial;color: #1e7c9b;" >Disable Location</td>
</tr>
<asp:GridView ID="diableloc" runat="server" AutoGenerateColumns="False"
DataKeyNames="LocationName" DataSourceID="getGridMerchantLocationData"
AllowPaging="True" EnableViewState="False">
<Columns>
<asp:BoundField DataField="chkbox" HeaderText="Select"
SortExpression="Selection" />
<asp:BoundField DataField="locname" HeaderText="Location Name"
ReadOnly="True" SortExpression="Locnames" />
</Columns>
</asp:GridView>
<asp:ObjectDataSource ID="ProductsDataSource" runat="server"
OldValuesParameterFormatString="original_{0}"
SelectMethod="GetLocations" TypeName="string">
</asp:ObjectDataSource>
</table>
<tr>
<td style="width: 44px; height: 63px">
</td>
<td style="width: 127px; height: 63px">
</td>
<td align="left" colspan="2" style="height: 63px; width: 196px;">
<asp:ImageButton ID="btnDisable" runat="server" ImageUrl="~/images/save.gif" OnClick="btnDisable_Click"
ValidationGroup="group1" />
<asp:ImageButton ID="btnCancel" runat="server" ImageUrl="~/images/cancel.gif" OnClick="btnCancel_Click" /></td>
<td colspan="1" style="width: 92px; height: 63px">
</td>
</tr>
</div>
</form>
</body>
</html>
Sounds like the page is posting back. Did you try AutoPostBack="false"? Not sure you need a LinkButton here. Can you just use a anchor tag with onclick instead to invoke the popup?
Do you have code that needs to execute on the server side when the LinkButton is clicked? If you need both you can use the OnClientClick property to have both. It has been a while, but I think you can make it so the server code won't execute if the value returned from the client side code in onclientclick returns false.
I don't see how your current LinkButton shows the popup.
Instead of OnClick use OnClientClick="lnkremoveloc_Click" where lnkremoveloc_Click is JavaScript function (somthing like PopupCenter you already have) that opens popup window.
Set the onclientclick instead of onclick. And while rendering(page load) itself set the onclientclick as "PopupCenter('url','title',....);return false;"
The url, title, width, etc can be set on load. The last part "return false" will annul the effect of click. Thus it prevents post back.
Note: If you want something to be processed at server side, its better not to set the onclientclick and use
Response.write("<script>PopupCenter('url','title',....);</script>");
I hope that helps.
This is my first post :)

Categories