?
Solved

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

Posted on 2012-03-25
4
Medium Priority
?
391 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:Murray Brown
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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 2000 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:Murray Brown
ID: 37786447
thanks very much for all the help
0

Featured Post

Ransomware-A Revenue Bonanza for Service Providers

Ransomware – malware that gets on your customers’ computers, encrypts their data, and extorts a hefty ransom for the decryption keys – is a surging new threat.  The purpose of this eBook is to educate the reader about ransomware attacks.

Question has a verified solution.

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

Occasionally there is a need to clean table columns, especially if you have inherited legacy data. There are obviously many ways to accomplish that, including elaborate UPDATE queries with anywhere from one to numerous REPLACE functions (even within…
The article shows the basic steps of integrating an HTML theme template into an ASP.NET MVC project
In this video we outline the Physical Segments view of NetCrunch network monitor. By following this brief how-to video, you will be able to learn how NetCrunch visualizes your network, how granular is the information collected, as well as where to f…
If you’ve ever visited a web page and noticed a cool font that you really liked the look of, but couldn’t figure out which font it was so that you could use it for your own work, then this video is for you! In this Micro Tutorial, you'll learn yo…

764 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