Die Mathe-Redaktion - 31.03.2020 11:35 - Registrieren/Login
Auswahl
ListenpunktHome
ListenpunktAktuell und Interessant ai
ListenpunktArtikelübersicht/-suche
ListenpunktAlle Links / Mathe-Links
ListenpunktFach- & Sachbücher
ListenpunktMitglieder / Karte / Top 15
ListenpunktRegistrieren/Login
ListenpunktArbeitsgruppen
Listenpunkt? im neuen Schwätz
ListenpunktWerde Mathe-Millionär!
ListenpunktFormeleditor fedgeo
Schwarzes Brett
Aktion im Forum
Suche
Stichwortsuche in Artikeln und Links von Matheplanet
Suchen im Forum
Suchtipps für den MP

Werbung

Bücher zu Naturwissenschaft und Technik bei amazon.de
Kontakt
Mail an Matroid
[Keine Übungsaufgaben!]
Impressum

Bitte beachten Sie unsere Nutzungsbedingungen, die Distanzierung, unsere Datenschutzerklärung und
die Forumregeln.

Sie können Mitglied werden. Mitglieder können den Matheplanet-Newsletter bestellen, der etwa alle 2 Monate erscheint.

Der Newsletter Okt. 2017

Für Mitglieder
Mathematisch für Anfänger
Wer ist Online
Aktuell sind 702 Gäste und 26 Mitglieder online

Sie können Mitglied werden:
Klick hier.

Über Matheplanet
 

Antworte auf:  MathJax in HTML inputfield von knaggix
Forum:  Programmieren, moderiert von: matph

[Zur Forum-Gliederung] [Wie man Fragen beantwortet]

  Alle registrierten Mitglieder können Mitteilungen schreiben.
Benutzername:
Passwort:
Nachricht-Icon:                   
                  
              
Nachricht:


 

Erledigt J


Eingabehilfen (JavaScript): [Link extern intern] [MathML?] [$$?]
[fed-Bereich] [LaTeX-inline] [LaTeX-display] [Tikz] [hide-Bereich][show-Bereich] [Quelltext [num.]][?]
 Zeige Vorschau      Schreibe im fedgeoFormeleditor oder mit Latex.

Smilies für Deine Nachricht:
😃 😄 😁 🙂 🙃 😉 🤗 🤫 🤔 🙄 😴 🤒 😎 😮 😲 😂
🙁 😖 😒 😐 😡 👌 👍 👎 🤢 🤧 🥵 🥶 😵 🤯 😛 😷
Optionen: Deaktiviere HTML in dieser Nachricht
Deaktiviere MATHML in dieser Nachricht. Wenn Dein Text $-Zeichen enthält, die nicht LaTeX-Formeln begrenzen.
Deaktiviere Smilies in dieser Nachricht
Zeige die Signatur (Kann in 'Mein Profil' editiert werden.)
    [Abbrechen]
 
Beachte bitte die [Forumregeln]


Themenübersicht
knaggix
Aktiv
Dabei seit: 01.02.2008
Mitteilungen: 207
Herkunft: CH
 Beitrag No.10, eingetragen 2020-02-07 22:47    [Diesen Beitrag zitieren]

Hallo Primentus

Ja, da hast du einen guten Punkt bemerkt.
Danke.
Ich werde also umbauen auf Radiobuttons und dann testen.

Danke für Deine Hilfe.

herzliche Grüsse
Knaggix


Primentus
Senior
Dabei seit: 18.02.2016
Mitteilungen: 1143
Herkunft: Deutschland
 Beitrag No.9, eingetragen 2020-02-04 15:10    [Diesen Beitrag zitieren]

Hallo knaggix,

sieht prinzipiell gut aus Deine Lösung.
Aber wie ich sehe, hast Du allen Checkboxes den gleichen Namen gegeben. Die Frage ist, was passiert, wenn mehrere Checkboxen auf einmal vom Benutzer ausgewählt werden. Dann könnte es sein, dass Deine Ergebnis-Abfrage fehlschlägt.

Soll unterbunden werden, dass mehr als eine Checkbox ausgewählt werden kann, würde ich wie gesagt Radio-Buttons anstelle der Checkboxen empfehlen, also type="radio" anstelle von type="checkbox".

Checkboxes (mit verschiedenen Namen) sind eigentlich Optionen, von denen auch mehrere ausgewählt werden können, wohingegen Radio-Buttons (gleichen Namens) dafür gedacht sind, nur eines der Felder auswählbar zu machen. Was Du jedoch gemacht hast, ist ein Mischmasch aus beidem, nämlich Checkboxes mit gleichem Namen.

Des Weiteren wünsche ich Dir natürlich einen erfolgreichen Einsatz Deines Tools.

LG Primentus


knaggix
Aktiv
Dabei seit: 01.02.2008
Mitteilungen: 207
Herkunft: CH
 Beitrag No.8, eingetragen 2020-02-03 22:01    [Diesen Beitrag zitieren]

Hallo zusammen und
Hallo Primentus

So, das Projekt klappt nun mit checkboxen und Deine Anregungen waren wertvoll. Danke nochmals.
Der Kern meiner Lösung war ein checkboxauswahl- Form :
html / php
<table><tr><td>		
<input type="checkbox" name="L" value=<?php print($checkL[0][0]) ?> > <?php print$checkL[0][1] ?> <br><br>
<input type="checkbox" name="L" value=<?php print($checkL[1][0]) ?> > <?php print$checkL[1][1] ?> <br><br>
<input type="checkbox" name="L" value=<?php print($checkL[2][0]) ?> > <?php print$checkL[2][1] ?> <br><br>
<input type="checkbox" name="L" value=<?php print($checkL[3][0]) ?> > <?php print$checkL[3][1] ?> <br>
</td><td width="100"></td><td>		
<input type="checkbox" name="L" value=<?php print($checkL[4][0]) ?> > <?php print$checkL[4][1] ?> <br><br>
<input type="checkbox" name="L" value=<?php print($checkL[5][0]) ?> > <?php print$checkL[5][1] ?> <br><br>
<input type="checkbox" name="L" value=<?php print($checkL[6][0]) ?> > <?php print$checkL[6][1] ?> <br><br>
<input type="checkbox" name="L" value=<?php print($checkL[7][0]) ?> > <?php print$checkL[7][1] ?> <br>
</td></tr></table>
 

In den values habe ich einen Eintrag aus einem  2 dim array mitgegeben, quasi eine ID  der verschiedenen angebotenen Lösungen.
php
$checkL = array( 	 
array("L0", '\(  '.$a.' \cdot e^{ \frac{'.$d1.'}{'.$f1.'} \cdot x^{'.$g.'} } \cdot [ \frac{'.$k2.'}{'.$f2.'} \cdot x^{'.$g.'} '.$operation2.'  \frac{'.$_k3.'}{'.$f3.'} \cdot x^{'.($g-1).'} '.$operation3.$_b.' ]   \)', 1),  
etc . . . etc . . . 
etc . . . 


Somit konnte ich später aus den $_Requests die gewählte Lösung wiederherstellen und mit der korrekten Lösung vergleichen.

Die Checkbox Darstellung hat nun den Vorteil, dass man alle Lösungen gut miteinander vergleichen kann. Dies ist praktischer als in meiner ursprünglichen Idee mit dem Dropdown Menue.

Bin nun gespannt, ob dieses Tool sich im Alltag bewährt, mal sehen.

Danke nochmals
herzliche Grüsse,
knaggix

 


 


Primentus
Senior
Dabei seit: 18.02.2016
Mitteilungen: 1143
Herkunft: Deutschland
 Beitrag No.7, eingetragen 2020-01-28 21:28    [Diesen Beitrag zitieren]

Hallo knaggix,

gern geschehen.
Ja, die eigentlichen Dropdownfelder sind erstmal versteckt und müssen durch Klicken auf das Dropdownfeld mit dem Pfeil erstmal aufgeklappt werden. Bei Klick auf einen aufgeklappten Eintrag schreibe ich den gänzlichen HTML-Ausdruck innerhalb des DIVs dieses Dropdowneintrages in das oberste permanent sichtbare Dropdownfeld. Und die id des Dropdownfeldes wird in das Hidden-Feld namens formel geschrieben. So weiß man nachher, was ausgewählt wurde.

Die Checkbox-Lösung funktioniert natürlich etwas einfacher, wobei Du aber wahrscheinlich eher Radio-Buttons verwenden müsstest, falls man nicht mehrere Formeln gleichzeitig anklicken können soll.

Ok, ich wünsche Dir erstmal viel Spaß beim weiterprogrammieren. Melde Dich einfach wieder, wenn Du nochmal eine Frage hast oder sobald das Projekt fertig ist. Gutes Gelingen!

LG Primentus


knaggix
Aktiv
Dabei seit: 01.02.2008
Mitteilungen: 207
Herkunft: CH
 Beitrag No.6, eingetragen 2020-01-28 20:32    [Diesen Beitrag zitieren]

Wow

Vielen Dank Primentus


Ich habe es vermutet, dass es via dropdownmenue nicht geht.

Deine Idee ist cool gelöst.
So wie ich dies verstehe, zeigst und versteckst du die Dropdownfelder und nimmst per getElementById() die innerValue vom Feldelement.
Das ist (zwar aufwändig, aber )cool und funktioniert wahrscheinlich für mich.


Ich bin inzwischen soweit, dass ich den Mathjax output hinter checkboxen habe. Den Value (zur Überprüfung, was angeklickt wurde) will ich dann über das Value Field der checkboxen mitgeben.
Die Darstellung von bis zu 8 alternativen Checkboxen ist bis jetzt ok auf dem Bildschirm, evtl. sogar übersichtlicher als mit dem Dropdowns.
Mal sehen.

Auf Deine "Luxuslösung" komme ich gerne zurück, wenn meine Experimente mit den Checkboxen am Ende doch nicht funktionieren.

vielen herzlchen Dank soweit,
ich melde mich, wenn das Projekt abgeschlossen ist, oder wenn ich wieder am Anschlag bin.

lieber Gruss,
knaggix  😛




Primentus
Senior
Dabei seit: 18.02.2016
Mitteilungen: 1143
Herkunft: Deutschland
 Beitrag No.5, eingetragen 2020-01-27 20:20    [Diesen Beitrag zitieren]

Hallo knaggix,

MathJax-Formeln können nicht innerhalb einer Select-Option korrekt angezeigt werden, da hierfür das HTML-Format erforderlich ist. In einer Select-Option können allerdings nur Plain Text Inhalte angezeigt werden, daher kommt es hier zu fehlerhaften Darstellungen im Dropdown.

Die einzige Möglichkeit sehe ich darin, sich händisch selbst ein Dropdownfeld zu basteln. Das könnte in etwa so aussehen:
HTML
<html>
<head>
	<title>Meine Formel</title>
	<script type="text/javascript" src="mathjax/MathJax.js?config=default"></script>
	<script type="text/javascript">
	<!--
	function openSel() {
		if (document.getElementById("wrapper").style.visibility == "hidden") {
			document.getElementById("wrapper").style.visibility = "visible";
			document.getElementById("Bike").style.visibility = "visible";
			document.getElementById("Car1").style.visibility = "visible";
			document.getElementById("Car2").style.visibility = "visible";
		} else {
			document.getElementById("wrapper").style.visibility = "hidden";
			document.getElementById("Bike").style.visibility = "hidden";
			document.getElementById("Car1").style.visibility = "hidden";
			document.getElementById("Car2").style.visibility = "hidden";
		}
	}
	function takeValue(obj) {
		document.getElementById("seldiv").innerHTML = obj.innerHTML;
		document.getElementById("wrapper").style.visibility = "hidden";
		document.getElementById("Bike").style.visibility = "hidden";
		document.getElementById("Car1").style.visibility = "hidden";
		document.getElementById("Car2").style.visibility = "hidden";
		document.getElementById("formel").value = obj.id;
	}
	//-->
	</script>
	<style type="text/css">
	.seldiv {
		height: 36px;
		width: 300px;
		border: 1px solid #000000;
		background-image: url('images/selarrow3.png');   /* add custom arrow */
	}	
	.wrapperdiv {
		width: 300px;
		border: 1px solid #000000;
	}	
	.selopt {
		width: 300px;
		background: #F1F1F1;
	}	
	</style>
</head>
 
<body>
 
<form name="myform">
<!--
<input type="checkbox" name="l1" value="Bike"> 
\( \frac{1}{2} \cdot x + \sqrt[3]{8x} + 2  \)<br><br>
<input type="checkbox" name="l2" value="Car"> 
\( 7 \cdot x - e^{2x+1} + 2 \)<br><br>
<input type="checkbox" name="l3" value="Car"> 
\( \frac{-3}{2} \cdot x - \int_{a}^{b} (x+2) \ dx \)<br>
-->
 
Das ist nur Deko-Text. Das ist nur Deko-Text. Das ist nur Deko-Text. Das ist nur Deko-Text.
Das ist nur Deko-Text. Das ist nur Deko-Text. Das ist nur Deko-Text. Das ist nur Deko-Text.
Das ist nur Deko-Text. Das ist nur Deko-Text. Das ist nur Deko-Text. Das ist nur Deko-Text.
Das ist nur Deko-Text. Das ist nur Deko-Text. Das ist nur Deko-Text. Das ist nur Deko-Text.
<div id="seldiv" class="seldiv" style="visibility:visible" onclick="openSel()">Bitte Formel wählen</div>
<div id="wrapper" class="wrapperdiv" style="visibility:hidden">
<div id="Bike" style="visibility:hidden" onmouseover="this.style.background='#C6D4E2'" onmouseout="this.style.background='#ffffff'" onclick="takeValue(this)">\( \frac{1}{2} \cdot x + \sqrt[3]{8x} + 2  \)</div>
<div id="Car1" style="visibility:hidden" onmouseover="this.style.background='#C6D4E2'" onmouseout="this.style.background='#ffffff'" onclick="takeValue(this)">\( 7 \cdot x - e^{2x+1} + 2 \)</div>
<div id="Car2" style="visibility:hidden" onmouseover="this.style.background='#C6D4E2'" onmouseout="this.style.background='#ffffff'" onclick="takeValue(this)">\( \frac{-3}{2} \cdot x - \int_{a}^{b} (x+2) \ dx \)</div>
</div>
Das ist nur Deko-Text. Das ist nur Deko-Text. Das ist nur Deko-Text. Das ist nur Deko-Text.
Das ist nur Deko-Text. Das ist nur Deko-Text. Das ist nur Deko-Text. Das ist nur Deko-Text.
Das ist nur Deko-Text. Das ist nur Deko-Text. Das ist nur Deko-Text. Das ist nur Deko-Text.
Das ist nur Deko-Text. Das ist nur Deko-Text. Das ist nur Deko-Text. Das ist nur Deko-Text.
<input type="hidden" id="formel" name="formel" value=""/>
 
</form> 
</body>
</html>

Kurz zur Erklärung:
Der DIV seldiv ist das eigentliche Dropdownfeld. Der DIV wrapper enthält die einzelnen Dropdowneinträge und zeichnet den Rahmen, wenn das Dropdown aufgeklappt wird. Die Dropdowneinträge selbst befinden sich dann nochmals in eigenen DIV-Feldern.

Die Dropdown-Einträge haben einen onmouseover und onmouseout Event, um die Hintergrundfarbe beim Drüberfahren mit der Maus zu simulieren. Bei onclick eines Dropdown-Eintrages wird die Funktion takeValue(this) ausgelöst, welche die Formel in die seldiv-Box schreibt und im Hidden-Formularfeld formel den Wert der ausgewählten Formel setzt (Bike, Car1 oder Car2). Wenn das Formular verschickt wird, kann also über den Namen formel das Ergebnis abgefragt werden.

Ach ja, da auch der Dropdown-Pfeil händisch nachgebildet werden muss, benötigt man noch eine Grafik ungefähr wie diese (das ist in meinem Code die Grafik selarrow3.png, siehe .seldiv-Klasse):



Ich hoffe, dies hilft Dir weiter.

LG Primentus


knaggix
Aktiv
Dabei seit: 01.02.2008
Mitteilungen: 207
Herkunft: CH
 Beitrag No.4, eingetragen 2020-01-27 16:41    [Diesen Beitrag zitieren]

Zwischenstand:
ok,  meine Tests mit dem Dropdown Menue sind nicht wirklich ermutigend.

Eine Variante mit checkboxen, die Mathjax liefert ist mir gelungen:
html / Mathjax
<form>
<input type="checkbox" name="l1" value="Bike"> 
\( \frac{1}{2} \cdot x + \sqrt[3]{8x} + 2  \)<br><br>
<input type="checkbox" name="l2" value="Car"> 
\( 7 \cdot x - e^{2x+1} + 2 \)<br><br>
<input type="checkbox" name="l3" value="Car"> 
\( \frac{-3}{2} \cdot x - \int_{a}^{b} (x+2) \ dx \)<br>
</form> 

Vielleicht kann ich über die Values in den Form Fields die angeklickten Lösungen überprüfen, mal sehen.

Falls jemand weitere Ideen hat, (z.B. wie dies im Dropdown Menue ginge) nur zu.
Danke fürs Mitdenken.

lg,
Knaggix


knaggix
Aktiv
Dabei seit: 01.02.2008
Mitteilungen: 207
Herkunft: CH
 Beitrag No.3, eingetragen 2020-01-27 15:35    [Diesen Beitrag zitieren]

Hallo Wally

Danke für Dein Mitdenken.
Ja, das ist mir klar.
Ich erstelle diese HTML Seiten mit einer php Datei, die auf dem Server die Mathjax Bibliothek hat.
Ich wollte nur sagen, dass die Bibliothek vorhanden ist und die php Seite Zugriff hat.

In eine normale HTML Seite kann ich Mathjax Formeln ausgeben.
Dies funktioniert.

Meine Frage ist im Moment, wie ich eine Auswahlliste mit Formeln generieren kann, so dass ein Benutzer eine Variante anklicken kann.

Ich hoffe , es wird verständlich, was ich probiere.

Danke für eure Hilfen,
lg, knaggix


Wally
Senior
Dabei seit: 02.11.2004
Mitteilungen: 8685
Herkunft: Dortmund, Old Europe
 Beitrag No.2, eingetragen 2020-01-27 15:17    [Diesen Beitrag zitieren]

Hallo,

ich weiß nicht, ob ich dich richtig verstehe: der Server braucht keinen Zugriff auf die Mathjax-Bibliothek, sondern der Browser, der die Seite darstellt  - eben per Javascript-Einbindung wie diese Seiten hier, wie du im Quelltext sehen kannst.

Eigentlich sollte das gar kein Problem sein. Eine serverseitige Lösung kann man mit mimetex erstellen.

Wally



knaggix
Aktiv
Dabei seit: 01.02.2008
Mitteilungen: 207
Herkunft: CH
 Beitrag No.1, eingetragen 2020-01-27 15:10    [Diesen Beitrag zitieren]

Nochmals hallo

Meine Tests waren bisher erfolglos.
Ich habe nun die Idee mit php eine Checkboxliste auszugeben und hinter die checkboxes die mathematischen Mathjax Ausdrücke zu generieren.
Könnte dies gehen?

Danke für Hinweise jeder Art

lg
knaggix  


knaggix
Aktiv
Dabei seit: 01.02.2008
Mitteilungen: 207
Herkunft: CH
 Themenstart: 2020-01-27 12:01    [Diesen Beitrag zitieren]

Hallo zusammen

Ich möchte gerne in einem html Dropdown Menue eine Mathematische Formel eigeben, die mit MathJax dargestellt wird.

Zum Beispiel soll der Befehl
MathJax
\( \frac{a}{b)  - t \cdot x \)
 
 als Ausdruck dargestellt werden können.

Der Benutzer erhält dann in einem Dropdown Menue verschiedene Ausdrücke zur Auswahl.

Die HTML / php Seite, die dieses Dropdownmenue generiert hat lokal auf dem Server Zugriff zu der MathJax Bibliothek.

Ist dies möglich?

Danke für euren Anregungen
knaggix


 
All logos and trademarks in this site are property of their respective owner. The comments are property of their posters, all the rest © 2001-2020 by Matroids Matheplanet
This web site was made with PHP-Nuke, a web portal system written in PHP. PHP-Nuke is Free Software released under the GNU/GPL license.
Ich distanziere mich von rechtswidrigen oder anstößigen Inhalten, die sich trotz aufmerksamer Prüfung hinter hier verwendeten Links verbergen mögen.
Lesen Sie die Nutzungsbedingungen, die Distanzierung, die Datenschutzerklärung und das Impressum.
[Seitenanfang]