ScrollBars op panel verschijnen niet ASP.net C# - Softwareontwikkeling

vrijdag 20 januari 2006 09:11

Acties:

Verwijderd

Topicstarter

Hallo,

Ik heb hier een voor mij vreemd probleem.

Ik heb een aspx pagina die gebruikt maakt van framework 1.1. (aspo.net c#)
Hierbij heb ik 4 panels, met op een panel een tabel die via een placeholder wordt aangemaakt, dit werk allemaal correct.

Nu wil ik echter een scrollbar op mijn panel (panel wordt wel gewoon in de body aangemaakt en niet via de placeholder)

En gebruik hiervoor de regel
<asp:Panel ID="Panelinfo" runat="server" Height="310px" width="776px" style="left:21px; posistion absolute; top 25px;" ScrollBars=Both> de rest </asp:Panel>

Iemand een idee waarom de scrollbars in zowel firefox als IE niet verschijnen. In Visual studie zie ik ze trouwens wel.

maandag 23 januari 2006 11:14

Acties:

Verwijderd

Topicstarter

Als aanvulling hierop

Het is me inmiddels gelukt om een scrollbar te krijgen maar dan via de Style van het panel.

Ik maak dan gebruik van overflow:auto.

Echter volgens mij is dit niet volledig ondersteund het werkt nammelijk wel in IE maar niet in Firefox.

Is er bij iemand een andere manier die door beide browser ondersteund word?

maandag 23 januari 2006 12:40

Acties:

Cartman!

posistion = position, dat ten eerste even... misschien dat dit t al verhelpt ook... geef in je css ook even een width en height mee overigens.

maandag 23 januari 2006 12:56

Acties:

Verwijderd

code:

1	style="overflow:scroll;"

kun je gebruiken om scrollbars toe te voegen aan een panel.

edit: "overflow:auto" zou ook gewoon moeten werken in Firefox dacht ik.

[ Voor 71% gewijzigd door Verwijderd op 23-01-2006 12:57 ]

maandag 23 januari 2006 12:59

Acties:

Verwijderd

Topicstarter

Het foutje met Position en posistion is mijn hersen bug ;-)
Maar stond goed in de code, ik heb nu binnen de style ook een Height en een Width aan gegeven.

Maar ook nu komen ze er bij firefox nog niet te staan. Is het wel mogelijk om op een Panel met framework 1.1 een scrollbar te krijgen ?

maandag 23 januari 2006 13:02

Acties:

TeeDee

CQB 241

Kijk eens naar je HTML output en plaats die eens hier?
Voorzover ik weet scrollt Firefox pas als de content daadwerkelijk overflowed in de div.

Je panel kan je namelijk gewoon stylen met CSS.

[ Voor 12% gewijzigd door TeeDee op 23-01-2006 13:04 ]

Heart..pumps blood.Has nothing to do with emotion! Bored

maandag 23 januari 2006 13:07

Acties:

Verwijderd

TeeDee schreef op maandag 23 januari 2006 @ 13:02:
Kijk eens naar je HTML output en plaats die eens hier?
Voorzover ik weet scrollt Firefox pas als de content daadwerkelijk overflowed in de div.

Je panel kan je namelijk gewoon stylen met CSS.

Als je overflow op "auto" staat is dat de default behaviour ja. Als je overflow op "scroll" zet worden de scrollbars altijd weergegeven.

maandag 23 januari 2006 13:09

Acties:

TeeDee

CQB 241

Verwijderd schreef op maandag 23 januari 2006 @ 13:07:
[...]

Als je overflow op "auto" staat is dat de default behaviour ja. Als je overflow op "scroll" zet worden de scrollbars altijd weergegeven.

Daarom is dit dus ook meer geschikt voor de mensen van /13.
Verder heeft de TS ook nog niet gemeld of de overflow op scroll staat. (Althans, dat heb ik nog niet gelezen)

[ Voor 4% gewijzigd door TeeDee op 23-01-2006 13:09 ]

Heart..pumps blood.Has nothing to do with emotion! Bored

maandag 23 januari 2006 13:15

Acties:

Verwijderd

Topicstarter

Oke effe war meer duidelijkheid dan over de code.

De Default.aspx bestaat uit 3 frames, Left, Top, Main.

De pagina waar jullie nu de code van zien is geladen in het Mainframe. Deze pagina kent 4 buttons nammelijk

Customer information | Delivery Information | Invoice Information | Order information

Elke van deze buttons heeft zijn eigen panel wat geladen moet worden. Op dit panel wil ik dan ook de scrollbar krijgen, dus een scroll moet dan de buttons laten staan en alleen de gegeven op de panel laten scrollen. Dit werkt in IE.

De output code van deze pagina ziet er als volgt uit:

code:

<!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>
    <title>Order Form</title>
    <link href="StyleSheet.css" rel="stylesheet" type="text/css" />
    <link href="/aspnet_client/System_Web/2_0_50727/CrystalReportWebFormViewer3/css/default.css"
        rel="stylesheet" type="text/css" />

</head>
<body style="font-family: Arial;">
    <form name="form1" method="post" action="order.aspx" id="form1">
<input type="hidden" name="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" value="dDwtMTUyMTExNDYxMTt0PDtsPGk8ND47PjtsPHQ8O2w8aTw5PjtpPDExPjtpPDEzPjtpPDE1Pjs+O2w8dDxwPHA8bDxWaXNpYmxlOz47bDxvPGY+Oz4+Oz47bDxpPDM+O2k8Nz47aTwxMT47aTwxNT47aTwxOT47aTwyMz47aTwyNT47aTwyOT47aTwzMz47aTw0Mz47PjtsPHQ8cDxwPGw8VGV4dDs+O2w8Sm9ycnl0Oz4+Oz47Oz47dDxwPHA8bDxUZXh0Oz47bDxLbGVpYmVyZyA3Mzs+Pjs+Ozs+O3Q8cDxwPGw8VGV4dDs+O2w8TGVub2lyOz4+Oz47Oz47dDxwPHA8bDxUZXh0Oz47bDw0OTk1YWI7Pj47Pjs7Pjt0PHA8cDxsPFRleHQ7PjtsPFRlc3Q7Pj47Pjs7Pjt0PHA8cDxsPFRleHQ7PjtsPFRob3JuIGNpdHk7Pj47Pjs7Pjt0PHA8cDxsPFRleHQ7PjtsPEZhdXJlY2lhOz4+Oz47Oz47dDxwPHA8bDxUZXh0Oz47bDxOZXRoZXJsYW5kczs+Pjs+Ozs+O3Q8cDxwPGw8VGV4dDs+O2w8NjM0NTY3ODQ0NTs+Pjs+Ozs+O3Q8cDxwPGw8VGV4dDs+O2w8akxFTk9JUkBob3RtYWlsLmNvbTs+Pjs+Ozs+Oz4+O3Q8cDxwPGw8VmlzaWJsZTs+O2w8bzxmPjs+Pjs+O2w8aTwzPjtpPDExPjtpPDEzPjtpPDE3PjtpPDIxPjtpPDI1Pjs+O2w8dDxwPHA8bDxUZXh0Oz47bDxKb3JyeXQgIExlbm9pcjs+Pjs+Ozs+O3Q8cDxwPGw8VGV4dDs+O2w8S2xlaWJlcmcgNzs+Pjs+Ozs+O3Q8dDw7cDxsPGk8MD47PjtsPHA8O0V4IFdvcmtzPjs+PjtsPGk8MD47Pj47Oz47dDxwPHA8bDxUZXh0Oz47bDw0OTk1YWI7Pj47Pjs7Pjt0PHA8cDxsPFRleHQ7PjtsPFRlc3REZWxpdmVyeTs+Pjs+Ozs+O3Q8cDxwPGw8VGV4dDs+O2w8TmV0aGVybGFuZHM7Pj47Pjs7Pjs+Pjt0PHA8cDxsPFZpc2libGU7PjtsPG88Zj47Pj47PjtsPGk8Mz47aTwxMz47aTwxNz47aTwyMT47aTwyNT47PjtsPHQ8cDxwPGw8VGV4dDs+O2w8Sm9ycnR0IExlbm9pcjs+Pjs+Ozs+O3Q8cDxwPGw8VGV4dDs+O2w8IEtsZWliZXJnIDc7Pj47Pjs7Pjt0PHA8cDxsPFRleHQ7PjtsPDQ5OTVhYjs+Pjs+Ozs+O3Q8cDxwPGw8VGV4dDs+O2w8VGVzdCBpbnZvaWNlOz4+Oz47Oz47dDxwPHA8bDxUZXh0Oz47bDxOZXRoZXJsYW5kczs+Pjs+Ozs+Oz4+O3Q8cDxwPGw8VmlzaWJsZTs+O2w8bzx0Pjs+Pjs+Ozs+Oz4+Oz4+Oz7hlNPBJfkNJxw60vUKdWadHC50KA==" />

<script language="javascript" type="text/javascript">
<!--
    function __doPostBack(eventTarget, eventArgument) {
        var theform;
        if (window.navigator.appName.toLowerCase().indexOf("microsoft") > -1) {
            theform = document.form1;
        }
        else {
            theform = document.forms["form1"];
        }
        theform.__EVENTTARGET.value = eventTarget.split("$").join(":");
        theform.__EVENTARGUMENT.value = eventArgument;
        theform.submit();
    }
// -->
</script>

    <div style="font-size: 12pt; font-family: Arial">
        <div id="SelectedTop" style="width: 880px; height: 57px; position: absolute; left: 20px; top: 7px; text-align: center; border-bottom: gray thin outset;">
            <input type="submit" name="btCustomer" value="Customer Information" onclick="if (typeof(Page_ClientValidate) == 'function') Page_ClientValidate(); " language="javascript" id="btCustomer" style="left : 5px; width: 150px; position: absolute; top: 26px" />

            <input type="submit" name="btOrderlist" value="Order Information" onclick="if (typeof(Page_ClientValidate) == 'function') Page_ClientValidate(); " language="javascript" id="btOrderlist" style="left: 481px; width: 150px; position: absolute; top: 26px" />
            <input type="submit" name="btDelivery" value="Delivery Information" onclick="if (typeof(Page_ClientValidate) == 'function') Page_ClientValidate(); " language="javascript" id="btDelivery" style="left: 163px; width: 150px; position: absolute; top: 26px" />
            <input type="submit" name="btInvoice" value="Invoice Information" onclick="if (typeof(Page_ClientValidate) == 'function') Page_ClientValidate(); " language="javascript" id="btInvoice" style="left: 321px; width: 150px; position: absolute; top: 26px" /></div>
        &nbsp;
        <div id="orderMain" style="left: 20px; width: 880px; position: absolute; top: 65px;
            height: 400px">
            <br />
            &nbsp;
            
              
                    
           <table id="PanelOrder" ScrollBars="Vertical" cellpadding="0" cellspacing="0" border="0" height="310" width="776" style="left: 21px; height:310px; width:770px; position: absolute; top: 25px; overflow:auto "><tr><td>
                  Order Information
                   <br />
                  <br />
                  <table border="1" style="width: 730px; text-align: left; font-size: 10pt; font-family: Arial">
                       <tr>
                            <td bgcolor="#ece9d8" bordercolor="#000000" style="width: 92px; height: 23px">
                                <div align="center">
                                    <strong>Order Info</strong>
                                </div>

                            </td>
                            <td bgcolor="#ece9d8" bordercolor="#000000" style="width: 384px; height: 23px">
                                <div align="center">
                                    <strong>Products</strong>
                                </div>
                            </td>
                             <td bgcolor="#ece9d8" bordercolor="#000000" style="width: 103px; height: 23px">
                                 <div align="center">

                                    <strong>Remark</strong>
                                 </div>
                            </td>
                        </tr>
                        <tr><td nowrap> OrderID: 72<br>Number: 1<br>Price: ????<br> One Way Pallet<br><br><a id="0" href="javascript:{if (typeof(Page_ClientValidate) != 'function' ||  Page_ClientValidate()) __doPostBack('0','')} ">Remove</a></td><td nowrap>MR916167  8314487  EE, FRONT SEAT CUSHION FRAME FIX RH<br>6911A006  8338212  PAD ,F/SEAT CUSHION ZM TURBO LH/RH<br></td><td> No Remark</td></tr><tr><td nowrap> OrderID: 73<br>Number: 1<br>Price: ????<br> One Way Pallet<br><br><a id="1" href="javascript:{if (typeof(Page_ClientValidate) != 'function' ||  Page_ClientValidate()) __doPostBack('1','')} ">Remove</a></td><td nowrap>MR916167  8314487  EE, FRONT SEAT CUSHION FRAME FIX RH<br>6911A006  8338212  PAD ,F/SEAT CUSHION ZM TURBO LH/RH<br>6980A001  8333114  UNDERTRAY SUPPORT<br></td><td> No Remark</td></tr><tr><td nowrap> OrderID: 74<br>Number: 1<br>Price: ????<br> One Way Pallet<br><br><a id="2" href="javascript:{if (typeof(Page_ClientValidate) != 'function' ||  Page_ClientValidate()) __doPostBack('2','')} ">Remove</a></td><td nowrap>MR916167  8314487  EE, FRONT SEAT CUSHION FRAME FIX RH<br>6911A006  8338212  PAD ,F/SEAT CUSHION ZM TURBO LH/RH<br>6980A001  8333114  UNDERTRAY SUPPORT<br>7000A109XA  8328575030  Electric Buckle Passenger RHD<br></td><td> No Remark</td></tr><tr><td nowrap> OrderID: 75<br>Number: 1<br>Price: ????<br> One Way Pallet<br><br><a id="3" href="javascript:{if (typeof(Page_ClientValidate) != 'function' ||  Page_ClientValidate()) __doPostBack('3','')} ">Remove</a></td><td nowrap>MR916189  8317658  PAD ,F/SEAT BACK SAB ZM LH<br></td><td> No Remark</td></tr><tr><td nowrap> OrderID: 76<br>Number: 1<br>Price: ????<br> One Way Pallet<br><br><a id="4" href="javascript:{if (typeof(Page_ClientValidate) != 'function' ||  Page_ClientValidate()) __doPostBack('4','')} ">Remove</a></td><td nowrap>MR916189  8317658  PAD ,F/SEAT BACK SAB ZM LH<br>MR916180  8331542  HEATER, UNIT FR SEAT<br></td><td> No Remark</td></tr><tr><td></td><td></td><td><input type="submit" name="_ctl1" value="Send Order" onclick="if (typeof(Page_ClientValidate) == 'function') Page_ClientValidate(); " language="javascript" /></td></tr>

                </table>
                <br />
                
</td></tr></table>
            <br />
            
            
        </div>
    
    </div>
    </form>
</body>
</html>

Ohja ik plaats de code op verzoek, niet omdat ik wil dat jullie hem voor mij gaan zitten debuggen. het stuk je waar het om gaat heb ik ook effe hieronder geplaatst zodat jullie niet de hele code hoeven door te lopen

code:

        <table id="PanelOrder" ScrollBars="Vertical" cellpadding="0" cellspacing="0" border="0" height="310" width="776" style="left: 21px; height:310px; width:770px; position: absolute; top: 25px; overflow:auto "><tr><td>

maandag 23 januari 2006 13:21

Acties:

TeeDee

CQB 241

Zou je de overflow:auto niet op je div id="orderMain" zetten in plaats van op de table "PanelOrder"?
Of op tbody, welke je nog wel in je table moet zetten.

bigbeng schreef op maandag 23 januari 2006 @ 13:22:
Waarom kies je hier voor een table? Je gebruikt overal netjes divjes en hier ineens een table met 1 cel.

Is default VS.net output afaik. Je zou in de properties het e.e.a. nog op "flow" kunnen zetten, alleen krijg je dan allemaal <span> tags.

[ Voor 55% gewijzigd door TeeDee op 23-01-2006 13:24 ]

Heart..pumps blood.Has nothing to do with emotion! Bored

maandag 23 januari 2006 13:22

Acties:

bigbeng

Waarom kies je hier voor een table? Je gebruikt overal netjes divjes en hier ineens een table met 1 cel.

maandag 23 januari 2006 13:39

Acties:

Verwijderd

Topicstarter

TeeDee schreef op maandag 23 januari 2006 @ 13:21:
Zou je de overflow:auto niet op je div id="orderMain" zetten in plaats van op de table "PanelOrder"?
Of op tbody, welke je nog wel in je table moet zetten.
.

Thanks, ik heb het volgende in de div gezet overflow-y=auto en nu werkt het in zowel Firefox als in IE

$_/-\o_$ $_/-\o_$ $_/-\o_$

maandag 23 januari 2006 13:40

Acties:

cowgirl

En hoe wordt het gerendered in Firefox? Wordt daar geen HTML 3.2 gegenereerd?

edit:
te laat

[ Voor 14% gewijzigd door cowgirl op 23-01-2006 13:40 ]

maandag 23 januari 2006 13:44

Acties:

TeeDee

CQB 241

cowgirl schreef op maandag 23 januari 2006 @ 13:40:
En hoe wordt het gerendered in Firefox? Wordt daar geen HTML 3.2 gegenereerd?

edit:
te laat

Als ik zo de html output bekijk, denk ik dat TS gebruik maakt van .net 2.0, in tegenstelling tot wat er in de OP staat. .Net 2.0 rendert de meuk beter dan 1.1

Heart..pumps blood.Has nothing to do with emotion! Bored