How to align MultiView with TreeView in asp.net web forms? - html

I want to have a tree view on the left side of the screen along with a multiview which displays the content of the selected tree item on the right side of the screen. My problem is that I cannot seem to align the multiview such that it is to the right of the tree view. Its stuck to the bottom of the treeview. Here's a simplified version of what I have.
<body>
<form id="form1" runat="server">
<div>
<asp:TreeView ID="TreeView1" runat="server">
<Nodes>
<asp:TreeNode Text="1" Value="1">
<asp:TreeNode Text="1.1" Value="1.1"></asp:TreeNode>
<asp:TreeNode Text="1.2" Value="1.2"></asp:TreeNode>
</asp:TreeNode>
<asp:TreeNode Text="2" Value="2"></asp:TreeNode>
</Nodes>
</asp:TreeView>
<asp:MultiView ID="MultiView1" runat="server" ActiveViewIndex="0">
<asp:View ID="View1" runat="server">
<asp:Label ID="Label1" runat="server" Text="something here"></asp:Label>
</asp:View>
</asp:MultiView>
</div>
</form>
</body>
How do I align it to the right?

put both inside two div's and use css-style float:left for the first and float:right for the second with width it will work.
<body>
<form id="form1" runat="server">
<div style="float:left;width:200px;">
<asp:TreeView ID="TreeView1" runat="server">
<Nodes>
<asp:TreeNode Text="1" Value="1">
<asp:TreeNode Text="1.1" Value="1.1"></asp:TreeNode>
<asp:TreeNode Text="1.2" Value="1.2"></asp:TreeNode>
</asp:TreeNode>
<asp:TreeNode Text="2" Value="2"></asp:TreeNode>
</Nodes>
</asp:TreeView>
</div>
<div style="float:right; width:800px;">
<asp:MultiView ID="MultiView1" runat="server" ActiveViewIndex="0">
<asp:View ID="View1" runat="server">
<asp:Label ID="Label1" runat="server" Text="something here"></asp:Label>
</asp:View>
</asp:MultiView>
</div>
</form>
</body>

For the sake of simplicity...you can wrap them both (treeview and multiview) inside a div. Then you can style the divs to dipplay inline-block...That'll give you the results you want
Hope it helps
leo

Related

I am having a problem with the login page. The login name text box is acting like a dropdown list. How can I stop this?

I am creating a website. It requires users to login.
When I click on the Username text box, as soon as I enter the first letter of the name it turns into a drop down list displaying every name ever entered, that starts with that letter!
I have found a lot of articles on how to accomplish this, but none how to PREVENT this from happening.
I want the text box to act like a text box.
I am using .NET version 4.62
I have searched here and there are many questions about making this happen, I could find none on how to stop it.
If you know how to stop this from happening, and can reply with the answer, I will be forever grateful.
The ASPX of the form is as follows
<%# Page Language="vb" AutoEventWireup="false" CodeBehind="Default.aspx.vb"
Inherits="Crescent._Default" %>
<!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">
<head id="Head1" runat="server" link= "stylesheet" href="styles.css">
<title></title>
</head>
<body>
<form id="Default" runat="server">
<div>
<p> <asp:Image ID="Image1" runat="server" Height="54px"
ImageUrl="Images/CrescentLogo2007.bmp" Width="175px" />
<asp:Label ID="Label1" runat="server" top="1px" Font-Names="Arial" ForeColor="Black"
Text="Call us at 1-800-560-7867" CssClass="style2"></asp:Label>
</p>
</div>
<p>
<asp:Label ID="Label2" runat="server" Font-Names="Arial" Text="Log In"></asp:Label>
</p>
<p>
</p>
<p>
<asp:Label ID="Label3" runat="server" Font-Names="Arial" Font-Size="Small"
Height="25px" Text="User Name:"></asp:Label>
<asp:TextBox ID="txtUserName" runat="server" cache=" "></asp:TextBox>
</p>
<p>
<asp:Label ID="Label4" runat="server" style="margin-left:5px" Font-Names="Arial" Font-
Size="Small"
Height="25px" Text="Password:"></asp:Label>
<asp:TextBox ID="txtPassword" runat="server" style="margin-left: 5px"
Width="164px" TextMode="Password"></asp:TextBox>
</p>
<p>
<asp:button runat="server" text="Login" style="margin-left: 58px"
Width="153px" ID="btnLogin" onclick="btnLogin_Click" />
</p>
</form>
</body>
</html>

Master page with more then 1 form?

So, I know you can only have 1 runat="server" and <form> per master page. My question is, how do I put my login FORM on my website? Do I put it all on the master page? Or some on the page and some on the .aspx form? Right now I have it mostly on Master, and the onClick() event on the .aspx page. I'll postcode at the below.
My Login.ASPX page.
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<div class="navbar">
Login
</div>
<p style="text-align: center">WELCOME HOME</p>
</asp:Content>
Here is my Master page code
<head runat="server">
<link href="CSS/StyleCSS.css" rel="stylesheet" />
<title>11</title>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<div class="header">
<h1> 11MO</h1>
</div>
<div class="PopupPosition">
<div class="form-popup" id="myForm">
<form class="form-container" id="form1" runat="server">
<h1>Login Form</h1>
<p style="text-align: center">Please login using your <strong><em>User ID and Password</em></strong></p>
<asp:Label ID="lblUserName" runat="server" Text="User Name:"> </asp:Label>
<asp:TextBox ID="txtUserName" runat="server"> </asp:TextBox>
<asp:Label ID="lblPassword" runat="server" Text="Password:"> </asp:Label>
<asp:TextBox ID="txtPassword" runat="server" TextMode="Password"> </asp:TextBox>
<asp:Button ID="btnLogin" runat="server" Width="315px" CssClass="btn" OnClick="btnLogin_Click" Text="Login"></asp:Button>
<button type="button" class="btn cancel" onclick="closeForm()">Close</button>
</form>
</div>
</div>
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
<footer class="Footer">
<p>© 2020 - Application Homepage</p>
</footer>
</body>
</html>
<script>
function openForm() {
document.getElementById("myForm").style.display = "block";
}
function closeForm() {
document.getElementById("myForm").style.display = "none";
}
</script>
RESULT I would like to get the code all on 1 page, be it master or login. I've tried putting it all in the ContentPlaceHolder1 area and it doesn't work. I think it's because I have 2 server run operations when I do that. So, how do I get it all on 1 page, but still keep the format for my other pages available. I also have Tiles that I want to be transferred so I'll haft to keep that on the master. Will I haft to add a sub Master page?
you can use the article to create login form using master pages
https://www.c-sharpcorner.com/UploadFile/009464/simple-login-form-in-Asp-Net-using-C-Sharp/

Trying to put two runat=server forms in one web form asp.net

i'm building a site for course project in Web forms asp.net
and i did a master page for all the website
i want to have a text box that acts as a search in the website
but it needs to be in
<form runat="server">
this is master code
<html>
<div id="topContent">
<head runat="server">
<form runat="server">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<asp:ContentPlaceHolder ID="head" runat="server"></asp:ContentPlaceHolder>
<title>Dor Lugasi Guitar Shop</title>
<link href="Styles.css" rel="stylesheet" type="text/css" />
<right>
<img src="../Images/logobk2.png" alt="Powered by DLG!" class="auto-style7"/><br />
<center id="headdiv">
<asp:LinkButton ID="lnkHome" runat="server" PostBackUrl="~/Pages/Home.aspx" >Home</asp:LinkButton>
<asp:LinkButton ID="lnkLogin" runat="server" PostBackUrl="~/Pages/Login.aspx">Login</asp:LinkButton>
<asp:LinkButton ID="lnkContact" runat="server" PostBackUrl="~/Pages/Contact.aspx" >Contact</asp:LinkButton>
<asp:LinkButton ID="lnkGuitarLab" runat="server" PostBackUrl="~/Pages/GuitarLab.aspx">Guitar Lab</asp:LinkButton>
<asp:ImageButton style="float:left;margin-left:10px;" ID="btnCart" runat="server" Height="55px" ImageUrl="~/Images/cart.png" Width="55px" PostBackUrl="~/Pages/Cart.aspx" />
<asp:TextBox ID="txtSearch" runat="server" BackColor="Silver" BorderColor="Black" TextMode="Search" placeholder=" Search" onkeypress="txtSearch"></asp:TextBox>
<asp:ImageButton ID="btnSearch" runat="server" ImageUrl="~/Images/src.png" OnClick="btnSearch_Click" Width="25px" />
</center>
<center id="headdiv" class="auto-style6">
<asp:Label style="float:left;margin-left:10px;" ID="lblLoggedUser" runat="server" Font-Bold="True" Font-Size="Large" ForeColor="Red"></asp:Label>
<asp:LinkButton ID="btnLogOut" runat="server" OnClick="btnLogOut_Click" Visible="False" CssClass="auto-style5" Height="24px" Width="99px">Log Out</asp:LinkButton>
<asp:LinkButton style="float:right;margin-right:10px;" ID="lnkManageProducts" runat="server" PostBackUrl="~/Pages/ManageProducts.aspx">Manage Products</asp:LinkButton>
<asp:LinkButton style="float:right;margin-right:10px;" ID="lnkManageUsers" runat="server" PostBackUrl="~/Pages/ManageUsers.aspx">Manage Users</asp:LinkButton>
</center>
</form>
</head>
</div>
<body id="body">
<form runat="server">
<center>
<asp:contentplaceholder id="ContentPlaceHolder1" runat="server">
</asp:contentplaceholder>
</center>
<footer id="footer" class="auto-style3">
</left>
<img src="../Images/logowhite.png" alt="Powered by ASP.NET!" />
</footer>
</form>
</body>
</html>
but im getting a:
A page can have only one server-side Form tag.
before i added this search textbox and button i had
<form runat="server">
<html>
...
<head>.....</head>
<body>....</body>
<footer>.....</footer>
</html>
</form>
and it worked
but at the login page when i pressed Enter it applied to the search form instead of the login form
eventually i ended up making a single form for the page and just put the specific form that had buttons in
<asp:Panel ID="search_panel" runat="server" DefaultButton="btnSearch">
<asp:TextBox ID="txtSearch" runat="server" BackColor="Silver" BorderColor="Black" TextMode="Search" placeholder=" Search" onkeypress="txtSearch"></asp:TextBox>
<asp:ImageButton ID="btnSearch" runat="server" ImageUrl="~/Images/src.png" OnClick="btnSearch_Click" Width="25px" />
</asp:Panel>
i hope thats the right way

how to control space between radiobuttons of the radiobuttonlist control

I am having lot of space between newly added radiobuttons(yes and No) of the RadioButtonList and the first part of the existing region(divName) is aligned properly.
can any body help me in aligning the newly added second region(div1)
<div id="divpanelFacts" runat="server">
<fieldset id="panelFacts">
<table width="100%">
<tr>
<td>
<div id="divName" runat="server" visible="false">
<span>
<label runat="server" id="Label1">
<span id="pNameSpan" runat="server">*</span>P Name</label>
<asp:TextBox ID="textPName" runat="server" MaxLength="20"></asp:TextBox>
</span>
</div>
</td>
<td>
<div id="div1" runat="server" visible="false">
<asp:Label ID="lbl1" runat="server" Text="Would like to use this option for document purpose"></asp:Label>
<asp:RadioButtonList ID="rbl1" runat="server" TextAlign="Left" RepeatDirection="Horizontal">
<asp:ListItem Value="Yes" Text="Yes" />
<asp:ListItem Value="No" Text="No" Selected="True" />
</asp:RadioButtonList>
</div>
</td>
</tr>
</table>
</fieldset>
</div>
Your table width is at 100%, which means it's going to stretch it, and table I think takes precedence.

post to iframe in another page

I am having a real struggle trying to accomplish something for work.
I have a starting page with a textbox and a button. I want to be able to post the value entered in the textbox to an iframe, but the iframe is on another another web page called iframeholder.
I am not allowed to session variables or querystring. It has to be post.
I want to send the value of TextBox_Link to the iframe and be able to store it as the value of a ListItem in the RadioButtonList. I greatly appreciate any feedback.
Starting Page
<body>
<form id="form1" runat="server">
<div>
<table>
<tr>
<td><asp:TextBox ID="TextBox_Link" runat="server"></asp:TextBox></td>
</tr>
<tr>
<td><asp:Button ID="Button_Post" runat="server" Text="Button" /></td>
</tr>
</table>
</div>
</form>
iframeholder page
<body>
<form id="form1" runat="server">
<div>
<iframe src ="iframe.aspx" name="iframe" width="100%" height="300">
</div
</form>
</body>
iframe
<body>
<form id="form1" runat="server">
<div>
<asp:RadioButtonList ID="RadioButtonList1" runat="server">
<asp:ListItem>Link1</asp:ListItem>
</asp:RadioButtonList>
<br />
<asp:Button ID="Button1" runat="server" Text="Submit" />
</div>
</form>
</body>
Try adding target='iframe' in your <form> tag.