Solved

ASP.net organising a screen using <div> (sorry but couldn't delete SQL area only ASP relevant)

Posted on 2012-03-25
4
359 Views
Last Modified: 2012-06-22
Hi

I have been asked to rearrange the following ASP.net web page that is divided up using <div...
I have no idea on how this works. The markup for the page is below followed with my currently disorganised screen. Could someone please give me a few pointers on how to organise the screen so the right hand side that I have managed to somehow force downward somehow comes up again into a neat design.
Thanks

<%@ Page Title="Placements" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeBehind="Placements.aspx.cs" Inherits="CRM_GHB.Placements" EnableEventValidation="false" %>


<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">

<script type="text/javascript">
    $(function () {
        $('input#contact_search').quicksearch('.gvContacts tr:gt(0)');
    });
</script>

<link href="/Styles/crm.css" rel="stylesheet" type="text/css" media="screen" />

</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <div style="margin-top:10px;">
        <div id="col_left">
            <div class="sectionContent">
                <div class="sectionHeading">
                    <h3 style="float:left">Contacts</h3><span class="label">Search: <input id="contact_search" /></span>
                </div>

                <div style="width: 95%; height: 200px; overflow-y:scroll; margin:10px auto 0 auto;">
                        <asp:GridView ID="gvContacts" CssClass="gvContacts" runat="server"
                        AllowSorting="True" DataSourceID="SQL"
                        OnRowDataBound="gvContacts_RowDataBound" OnRowCommand="gvContacts_RowCommand"
                        OnSelectedIndexChanged="gvContacts_SelectedIndexChanged" AutoGenerateColumns="False"
                        >

                        <Columns>
                            <asp:BoundField DataField="Company" HeaderText="Company"
                                SortExpression="Company" />
                            <asp:BoundField DataField="Last_Name" HeaderText="Last_Name"
                                SortExpression="Last_Name" />
                            <asp:BoundField DataField="First_Name" HeaderText="First_Name"
                                SortExpression="First_Name" />
                            <asp:BoundField DataField="column1" HeaderText="column1"
                                SortExpression="column1" />
                        </Columns>

                        <HeaderStyle BackColor="#EDEEF0"  Font-Bold="True" />
                    </asp:GridView>
               
                      <asp:SqlDataSource ID="SQL" runat="server"
                        ConnectionString="<%$ ConnectionStrings:ConnectionString1 %>"
                       
                        SelectCommand="SELECT [Company], [Last Name] AS Last_Name, [First Name] AS First_Name, [E-mail Address] AS column1 FROM [Customers]"
                        ProviderName="<%$ ConnectionStrings:ConnectionString1.ProviderName %>">
                    </asp:SqlDataSource>
                  </div>
               
                <asp:TextBox id="txtContactID"  runat="server" value="-1" visible="false"/>
               
            </div>

            <div class="sectionContent">
                <div class="sectionHeading">
                    <h3>Notes</h3>
                </div>
               
                <div style="width: 95%; height: 200px; overflow-y:scroll; margin:10px auto 0 auto;">
                        <asp:GridView ID="gvNotes" CssClass="gvNotes" runat="server"
                        AllowSorting="True" DataSourceID="notes_SQL"
                        OnRowDataBound="gvNotes_RowDataBound"
                        OnSelectedIndexChanged="gvNotes_SelectedIndexChanged" AutoGenerateColumns="true"
                        >

                        <Columns>
                            <asp:CommandField ShowSelectButton="True" Visible="false"/>
                            <asp:ButtonField CommandName="Select" Visible="false" />
                        </Columns>

                        <HeaderStyle BackColor="#EDEEF0"  Font-Bold="True" />
                    </asp:GridView>
               
                      <asp:SqlDataSource ID="notes_SQL" runat="server"
                        ConnectionString="<%$ ConnectionStrings:ConnString %>"
                        SelectCommand="SELECT NoteId, [ContactId], Note,  ModifiedBy As [UpdatedBy], ModifiedOn As [Date Updated] FROM [tblNotes] where ContactId = @ContactID">
                        <SelectParameters>
                            <asp:ControlParameter Name="ContactID" ControlId="txtContactID" PropertyName="Text"  defaultvalue="5"/>    
                        </SelectParameters>
                    </asp:SqlDataSource>
                  </div>
            </div>

            </div>
        </div>
       
        <div id="col_right">
            <div class="sectionContent">
                <div class="sectionHeading">
                    <h3>My Investment Status</h3>
                </div>
                <div style="width: 95%; height: 200px; overflow-y:scroll; margin:10px auto 0 auto;">
                        <asp:GridView ID="gvMyInvestments" CssClass="gvMyInvestments" runat="server"
                        AllowSorting="True" DataSourceID="MyInvestments_sql"
                        AutoGenerateColumns="true"
                        >

                        <Columns>
                            <asp:CommandField ShowSelectButton="True" Visible="false"/>
                            <asp:ButtonField CommandName="Select" Visible="false" />
                        </Columns>

                        <HeaderStyle BackColor="#EDEEF0"  Font-Bold="True" />
                    </asp:GridView>
               
                      <asp:SqlDataSource ID="MyInvestments_sql" runat="server"
                        ConnectionString="<%$ ConnectionStrings:ConnString %>"
                        SelectCommand="SELECT Name, Investor FROM [viewMyInvestments]">
                       
                    </asp:SqlDataSource>
                  </div>
            </div>

            <div class="sectionContent">
                <div class="sectionHeading">
                    <h3>Active Investments</h3>
                </div>
                <div style="width: 95%; height: 200px; overflow-y:scroll; margin:10px auto 0 auto;">
                        <asp:GridView ID="gvActiveInvestments" CssClass="gvActiveInvestments" runat="server"
                        AllowSorting="True" DataSourceID="ActiveInvestments_sql"
                        AutoGenerateColumns="true"
                        >

                        <Columns>
                            <asp:CommandField ShowSelectButton="True" Visible="false"/>
                            <asp:ButtonField CommandName="Select" Visible="false" />
                        </Columns>

                        <HeaderStyle BackColor="#EDEEF0"  Font-Bold="True" />
                    </asp:GridView>
               
                      <asp:SqlDataSource ID="ActiveInvestments_sql" runat="server"
                        ConnectionString="<%$ ConnectionStrings:ConnString %>"
                        SelectCommand="SELECT Name, Type FROM [viewActiveInvestments]">
                       
                    </asp:SqlDataSource>
                  </div>
            </div>
        </div>
   
</asp:Content>

1
0
Comment
Question by:murbro
  • 3
4 Comments
 
LVL 30

Expert Comment

by:IanTh
ID: 37762628
0
 
LVL 30

Expert Comment

by:IanTh
ID: 37762629
see

<link href="/Styles/crm.css" rel="stylesheet" type="text/css" media="screen" />

thats will have the div parameters in it
0
 
LVL 30

Accepted Solution

by:
IanTh earned 500 total points
ID: 37762636
see the line
<h3 style="float:left">Contacts</h3><span class="label">Search: <input id="contact_search" /></span>
                </div>


try float:right
0
 

Author Closing Comment

by:murbro
ID: 37786447
thanks very much for all the help
0

Featured Post

Migrating Your Company's PCs

To keep pace with competitors, businesses must keep employees productive, and that means providing them with the latest technology. This document provides the tips and tricks you need to help you migrate an outdated PC fleet to new desktops, laptops, and tablets.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Question about JQuery and asp.net 3 31
Master DB with Masterkey 1 34
How can I run RAW complex query's with Entity Framework Core 1 38
TSQL convert date to string 4 37
Naughty Me. While I was changing the database name from DB1 to DB_PROD1 (yep it's not real database name ^v^), I changed the database name and notified my application fellows that I did it. They turn on the application, and everything is working. A …
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
This video shows how to quickly and easily add an email signature for all users on Exchange 2016. The resulting signature is applied on a server level by Exchange Online. The email signature template has been downloaded from: www.mail-signatures…
Email security requires an ever evolving service that stays up to date with counter-evolving threats. The Email Laundry perform Research and Development to ensure their email security service evolves faster than cyber criminals. We apply our Threat…

827 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question