Multiview control

**aspfun** · Sep 28th, 2010, 08:48 AM

I am learning MultiView control.
Here are question:
I added 5 views in the MultiView but all views are tight together.
I can not drag and drop another control such as text boxes or labels into view area.
How to fix it?

**gep13** · Sep 28th, 2010, 09:27 AM

Hello there,

Can you help us by providing screen shots of what you are seeing, and also the code that you are using?

That is the best way for us to provide assistance.

Gary

**aspfun** · Sep 28th, 2010, 10:01 AM

Here is code:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>

<!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 runat="server">
<title></title>
</head>
<title>MultiView</title>
<body>
<form id="form1" runat="server">

<asp:MultiView ID="MultiView1" runat="server" ActiveViewIndex="0">
<asp:View ID="View1" runat="server">

</asp:View>
<asp:View ID="View2" runat="server">

</asp:View>
<asp:View ID="View3" runat="server">

</asp:View>
</asp:MultiView>

</form>
</body>
</html>

**gep13** · Sep 28th, 2010, 10:44 AM

Hey,

And what about a screen shot?

A picture can say a 1000 words.

Gary

**aspfun** · Sep 28th, 2010, 10:53 AM

I attached screen shot

**gep13** · Sep 28th, 2010, 12:10 PM

So, what exactly is the problem?

What you are showing is the designer for the MultiView. This shows you a design time view of each view, meaning that you can drag and drop controls into the View, or you can add this in directly in the ASPX markup as well.

If you run the page as is, you will only see the contents of the first view. You will need to add additional controls to toggle the current view.

I would suggest that you have a look here:

http://quickstarts.asp.net/QuickStar...multiview.aspx

This shows how to use a DropDownList to toggle between the views.

Gary

**avrail** · Sep 28th, 2010, 12:39 PM

hay aspfun,
could you please use the code tags when you post codes or markup
thanks

**avrail** · Sep 28th, 2010, 12:43 PM

hay again,
could you do such a thing and try to see what will happen in the Design mode for your page ?

Code:

<&#37;@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>

<!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 runat="server">
<title></title>
</head>
<title>MultiView</title>
<body>
<form id="form1" runat="server">

<asp:MultiView ID="MultiView1" runat="server" ActiveViewIndex="0">
<asp:View ID="View1" runat="server">
<asp:TextBox ID="text1" runat="server" />
</asp:View>
<asp:View ID="View2" runat="server">

</asp:View>
<asp:View ID="View3" runat="server">

</asp:View>
</asp:MultiView>


</form>
</body>
</html>

maybe you drag and drop in the wrong way, i mean maybe you try to drop the control inside the MultiView tags not in the View tags

**aspfun** · Sep 28th, 2010, 01:05 PM

The problem is from the sample
http://quickstarts.asp.net/QuickStar...multiview.aspx

It is very dificulty to add another text box under (not next to the button) textbox1 in view1. The code like below only add textbox2 next to the button1.

<asp:View ID="View1" runat="server">
Now showing View #1<br />
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox><strong> </strong>
<asp:Button ID="Button1" runat="server" Text="Button" />
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>

</asp:View>

**gep13** · Sep 28th, 2010, 01:08 PM

Hey,

This isn't a problem with the MultiView, but rather a problem with the way that you are doing it.

By default, controls are going to want to flow, one after the other. Just because you put the text that is the control on a new line, doesn't mean that it will appear on a new line.

As a simple example try this:

Code:

<asp:View ID="View1" runat="server">
Now showing View #1<br />
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> <br />
<asp:Button ID="Button1" runat="server" Text="Button" /> <br />
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>

</asp:View>

All three textboxes should now be on separate "lines".

I would encourage you to read up about using CSS to control the layout of your pages.

Gary

**avrail** · Sep 28th, 2010, 01:37 PM

hay,
you can use html table to help you in the layout of the page

**aspfun** · Sep 28th, 2010, 01:41 PM

avrail, I just think of using html table.
Do you have a link for a sample?

**gep13** · Sep 28th, 2010, 01:48 PM

I would really suggest that you stay away from using a table to control your layout.

Although this might seem like an obvious solution, you WILL run into problems down the line. I would highly recommend that you use CSS to control the layout of the controls on your page.

Gary

**avrail** · Sep 28th, 2010, 01:50 PM

hay,
use this

Code:

    <asp:View ID="View1" runat="server">
        <table>
            <tr>
                <td colspan="3">
                    Now showing View #1
                </td>
            </tr>
            <tr>
            <td>
                <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>    
            </td>
            <td>
            <asp:Button ID="Button1" runat="server" Text="Button" />
            </td>
            <td>
                <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
            </td>
            </tr>
        </table>
    </asp:View>

but really i don't know exactly what the layout you want to do

**gep13** · Sep 28th, 2010, 01:54 PM

http://www.hotdesign.com/seybold/

Gary

**aspfun** · Sep 28th, 2010, 03:05 PM

I found that real problem is adding a control which has style. For example, if I add the label below in view1, the layout is fine but if adding in view3, I need to ajust top value. It does not follow "drag and drop".

<asp:Label ID="order" runat="server" Font-Size="Small" ForeColor="DarkBlue" Style="z-index: 1;
left: 9px; width: 830px; position: absolute; text-align: center; height: 30px;
top: 183px;"></asp:Label>

Thread: Multiview control

Thread Tools

Display

Multiview control

Re: Multiview control

Re: Multiview control

Re: Multiview control

Re: Multiview control

Re: Multiview control

Re: Multiview control

Re: Multiview control

Re: Multiview control

Re: Multiview control

Re: Multiview control

Re: Multiview control

Re: Multiview control

Re: Multiview control

Re: Multiview control

Re: Multiview control

Posting Permissions