CSS Drucken von select-Boxen

Popeye1979 · 1. Februar 2006

Moin!

Ich habe eine Frage zu nem print.css

Ich möchte ein Formular drucken. Dort sind select-Boxen vorhanden.

Auf dem Ausdruck sollen diese aber nicht erscheinen.

Im print.css steht:

select

{

border:0;

overflow:visible;

}

Damit erscheint auf dem Ausdruck aber noch dieser Pfeil zum aufklappen.

Jmd eine Idee wie ich auch diesen noch wegbekomme?

Gruss

Jo

geloescht_JesterDay · 1. Februar 2006

Ich möchte ein Formular drucken. Dort sind select-Boxen vorhanden.
Auf dem Ausdruck sollen diese aber nicht erscheinen.

...

Jmd eine Idee wie ich auch diesen noch wegbekomme?

select

{

display: none;

}

Popeye1979 · 1. Februar 2006

Okay, falsch ausgedrückt!

Ich will den Text sehen, die select-boxen nicht!

tobias-digital · 1. Februar 2006

Welchen Text? Codebeispiel?

Popeye1979 · 1. Februar 2006

Welchen Text? Codebeispiel?

<select name="prioritaet" disabled="disabled">

				<option value="1">niedrig</option>

				<option value="2">mittel</option>

				<option value="3" selected="selected">hoch</option>

			</select>

Auf dem Ausdruck soll jetzt nur stehen: hoch

und nicht hoch in ner select-box.

geloescht_JesterDay · 1. Februar 2006

Auf dem Ausdruck soll jetzt nur stehen: hoch
und nicht hoch in ner select-box.

IMHO bleibt dir da nur, eine eigene Seite fürs Drucken zu machen, in der du keine <select>... Tags drin hast. HTML beschreibt ein Dokument, und mit <select> gibst du an, dass da eine Select-Box drin ist. Die <option>Angaben sind dann innerhalb der Select-Box.

Wenn du die Auswahl ohne Box anzeigen wisst, hilft nur ein Dokument ohne <select>.

tobias-digital · 1. Februar 2006

Hallo!

Ich hab hier ne Lösung für Dich:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>

  <head>

    <title>select-test</title>

    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />

    <style type="text/css" media="screen">

    div {

      display: none;

    }

    select {

      display: block;

    }

    </style>

    <style type="text/css" media="print">

    div {

      display: block;

    }

    select {

      display: none;

    }

    </style>

    <script type="text/javascript">

    function changeDiv(id) {

      var theDiv = document.getElementById('field_' + id);

      var theSelect = document.getElementById(id);

      var newText = theSelect.options[theSelect.selectedIndex].firstChild.data;


      theDiv.firstChild.deleteData(0, theDiv.firstChild.data.length);

      theDiv.firstChild.appendData(newText);

    }

    </script>

  </head>

  <body>

    <div id="field_selectBox">hoch</div>

    <select id="selectBox" onchange="changeDiv(this.id)">

      <option value="1">niedrig</option>

      <option value="2">mittel</option>

      <option value="3" selected="selected">hoch</option>

    </select> 

  </body>

</html>

Gruß, Tobias

Popeye1979 · 1. Februar 2006

Hallo!

Ich hab hier ne Lösung für Dich:

Danke, aber was ist wenn Javascript deaktiviert ist?

Bei ner Textarea gehts auch das er nur den Inhalt der Textarea druckt mit

textarea {border:0; overflow:visible;}

Leider bleibt wenn mans so bei der select-box versucht, der pfeil über!

Vielleicht gehts ja doch noch irgendwie, ansonsten werde ich das mal deine Lösung versuchen...

PS: Irgendwie steht bei deiner lösung aber auch immer "hoch" aufm Ausdruck! :floet:

tobias-digital · 1. Februar 2006

Danke, aber was ist wenn Javascript deaktiviert ist?

Also, ich habe in meiner bisherigen Laufbahn noch keinen Endanwender gesehen, der Javascript in seinem Browser deaktiviert hat. Ich selber halte es auch für ziemlich sinnlos das zu tun, da sich IMHO Javascript einfach etabliert hat, und es für bestimmte Dinge auch essentiell ist.

Leider bleibt wenn mans so bei der select-box versucht, der pfeil über!

Ich habe Dein Problem durchaus verstanden.

PS: Irgendwie steht bei deiner lösung aber auch immer "hoch" aufm Ausdruck! :floet:

Also bei mir nicht, es sei denn Du hast "hoch" ausgewählt. Getestet im IE 6 und FF 1.5

Popeye1979 · 2. Februar 2006

Getestet im IE 6 und FF 1.5

Jo, da funzt es. Leider verwenden ca. 5000 Mitarbeiter den IE 5.5

Und da funktioniert es nicht!

tobias-digital · 2. Februar 2006

Ach herrje :eek sag mal Bescheid bei welcher Firma Du arbeitest, damit ich die demnächst wegen Rückständigkeit meiden kann

Pinhead · 2. Februar 2006

Also, ich habe in meiner bisherigen Laufbahn noch keinen Endanwender gesehen, der Javascript in seinem Browser deaktiviert hat. Ich selber halte es auch für ziemlich sinnlos das zu tun, da sich IMHO Javascript einfach etabliert hat, und es für bestimmte Dinge auch essentiell ist.

Es soll aber auch durchaus Benutzer geben die andere Hilfsmittel benutzen um sich im Internet bewegen zu können als ein Beispiel wären da die Sehbehinderten genannt die sich Inhalte vorlesen lassen oder ein Braille zeile benutzen. Diese Gruppe werden über den Gebrauch von JavaScript nicht erfreut sein :rolleyes:

tobias-digital · 2. Februar 2006

Stimmt. Die gibt es. Da mein Vorschlag aber durchaus die BITV einhält, sehe ich in obiger Lösung kein Problem.

EDIT: Und außerdem: Das vom Threadersteller vorgestellte Problem habe ich noch nie rgendwo gesehen, und ich wüßte auch nicht wofür das gut sein sollte. Ein Formular stellt IMHO einfach die Möglichkeit dar Daten einzugeben. Wenn also beim Ausdruck eines Formulars die Selectbox sichtbar ist, dann ist das IMHO auch richtig so. Was der Threadersteller damit bezwecken will erschließt sich mir nicht.

geloescht_JesterDay · 2. Februar 2006

Bei ner Textarea gehts auch das er nur den Inhalt der Textarea druckt mit
textarea {border:0; overflow:visible;}

Nein, das verstehst du falsch. Er druckt die Textarea ganz normal, nicht nur den Inhalt. Die gedruckte Textarea hat eben nur keinen Rahmen. Auch wenn es für dich aussieht, als wenn es nicht die Textarea wäre und nur der Inhalt, das ist nicht so. Das wäre ja so, als wenn ich sage:


.Kommentar { color: #ff0000; }

druckt den Kommentar nicht, wenn rotes Papier eingelegt ist.

Popeye1979 · 2. Februar 2006

@Pinhead:

Braillezeile und Ausdruck...nochmal kurz drüber nachdenken.

@tobias:

Du wirst uns nicht meiden können!

Wenn also beim Ausdruck eines Formulars die Selectbox sichtbar ist, dann ist das IMHO auch richtig so.

Nöhö. Es geht sich um einen Auftrag der verschiedene Status einnehmen kann, verschiedene Bearbeiter, verschiedene Prioritäten, etc. annehmen kann. Zum Ausdruck soll diese nur die aktuellen Texte ausdrucken, nicht die Steuerelemente die vorhanden sind. Quasi soll es eine momentane Detailansicht des Auftrages sein.

@jesterday:

Das hab ich schon verstanden.

Deshalb würd ich die select-box ja auch gerne "unsichtbar" mitdrucken!

Mit dem roten Papier ist ne spitzen Idee, ich besorg mir einfach ein "select-box-grau"-farbiges Papier! :rolleyes:

tobias-digital · 2. Februar 2006

Nöhö. Es geht sich um einen Auftrag der verschiedene Status einnehmen kann, verschiedene Bearbeiter, verschiedene Prioritäten, etc. annehmen kann. Zum Ausdruck soll diese nur die aktuellen Texte ausdrucken, nicht die Steuerelemente die vorhanden sind. Quasi soll es eine momentane Detailansicht des Auftrages sein.

Jaha. Normalerweise würde man die Daten aus einem solchen Formular dann in einer Datenbank speichern und eine übersichtliche Detailansicht generieren, die zum Ausdruck und zur Ansicht des Auftrages dient.

Popeye1979 · 2. Februar 2006

Jaha. Normalerweise würde man die Daten aus einem solchen Formular dann in einer Datenbank speichern und eine übersichtliche Detailansicht generieren, die zum Ausdruck und zur Ansicht des Auftrages dient.

Ja die Daten sind schön säuberlich in ner Datenbank.

Ich wollt ja das erstellen einer "Druckansicht" umgehen. In der Detailansicht gibts ja noch die Möglichkeit die Daten zu ändern, das ist nix finales.

Naja ich werd dann mal schauen.

Dank dir.

PS: Von Neuss könntest du uns sogar vielleicht sehen. Wir sind das riesen Gebäude in der Nähe des Fernseturms und des Glasturms...

Popeye1979 · 3. Februar 2006

Problem gelöst.

druck.css

.druck{

visibility:visible !important;

display:inline !important;

}

.screen{

visibility:hidden !important;

display:none !important;

}

standard.css

.druck{

visibility:hidden;

display:none;

}


.screen{

visibility:visible;

display:inline;

}

<span class="druck">hoch</span>

<select name="prioritaet" disabled="disabled" class="screen">

<option value="1">niedrig</option>

<option value="2">mittel</option>

<option value="3" selected="selected">hoch</option>

</select>

Der "Drucktext" wird dynamisch generiert.

Anmelden

CSS Drucken von select-Boxen

Empfohlene Beiträge

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Dein Kommentar

Fachinformatiker Jobs

Fachinformatiker.de, 2024 by SE Internet Services

Links

Fachinformatiker.de App

Kontakt

Social media u. feeds

Jobboard für Fachinformatiker und IT-Fachkräfte