• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

[FRAGE] CSS Klasse zuweisen, PHP Request

mo

mo

Administrator
Teammitglied
moin,
kurze frage:
ich habe eine dynamisch generierte tabelle, alle zellen haben eindeutige IDs, z.B. ID_2014_11_2_10, wobei die "2014_11_2" das datum ist und die "10" eine eindeutige ID.
ich habe nun folgendes script gefunden: Edit fiddle - JSFiddle (kontext-menu) und will die klasse "context-menu-one box menu-1" per jquery allen zellen mit einer ID aus dem o.g. schema zuweisen.
das ist punkt 1.

punkt 2: nach der klick auf einen der kontext-menu-punkte soll im hintergrund ein php-script aufgerufen werden, das einen DB eintrag ändert. den php-teil hab ich im griff. wie mache ich das mit dem request?
 
Ich verstehe Punkt 1 nicht. Warum fügst du die CSS-Klasse nicht beim dynamischen Generieren der Zelle hinzu?
 
@punkt 1: momentan hab ich´s ja so, dass die klasse direkt in der php schleife dazugefügt wird. ich frage mich nur, ob´s performanter / eleganter ist, das mit jquery nachträglich zu machen..
@punkt 2: das ajax-dingen läuft auch, nur komme ich in dem script nicht an den wert des labels, in dem fall also Früh, Nacht, beides. Der muss mit übergeben werden.
 
mo schrieb:
@punkt 1: momentan hab ich´s ja so, dass die klasse direkt in der php schleife dazugefügt wird. ich frage mich nur, ob´s performanter / eleganter ist, das mit jquery nachträglich zu machen..
Zum Vergrößern anklicken....
Würde ich an der Anzahl der Zellen festmachen. Wenn es sehr viele sind hast du Traffic und Laufzeit. Bei wenigen ist wahrscheinlich der Traffic des Codes für die Zellen weniger als der Code für das nachträgliche Ändern.

mo schrieb:
@punkt 2: das ajax-dingen läuft auch, nur komme ich in dem script nicht an den wert des labels, in dem fall also Früh, Nacht, beides. Der muss mit übergeben werden.
Zum Vergrößern anklicken....
Im fiddle hast du da id: 'ID' und type: 'TYPE' stehen, das sind ja dann Konstanten. Was passiert, wenn du die Variablen einsetzt? Also id: id und type: type
 
die kommen ja unten in der fehlermeldung im alert (da die php-datei nicht gefunden werden kann):
alert("error\nID: " + id + "\nID2: " + id2 + "\ntype: " + type);
vars sind alle undefined...
 
Ich vermute, dass "this" bei $(this).attr('id'); nicht das ist, was es sein soll. Hast du da mal nachgeschaut?
 
Ach stimmt, ich hatte nicht auf Run geklickt. Dann bezieht sich das this auf die <td>. Und beim oberen kommt undefined, weil dort die <td> keine ID hat.
Hab mir jetzt 2 Stunden die Doku reingepfiffen und 25 neue fiddle Versionen gebaut. Und was ich nicht verstehe:
Wieso liefert folgender Code auch bei beiden undefined?
HTML: 
$(function () {
$(function () {
	$.contextMenu({
		selector: '.context-menu-custom',
		items: {
			one:	{
				name: "one",
				callback: function(key,opt){ console.log("Clicked on '" + key + "' on element '" + opt.$menu.id+"'"); }
			}
		}
	});
});
Laut jQuery contextMenu Plugin müsste der Callback doch zwei Parameter bekommen. Das heisst, wenigstens bei dem unteren müsste doch dann die ID geliefert werden.
Oder ist das ein anders Plugin?
Tut mir leid mo, ich weiss es nicht.
 
doof, gell :)
wobei´s mir ja inzwischen egal wäre, ob´s das script macht oder ein anderes.
ich will halt nen rechtsklick und 3 optionen auswählen können. und das am besten dynamisch zuweisen und einen ajax-request..
 
hesst schrieb:
zeig mal den ganzen code
Zum Vergrößern anklicken....
HTML: 
<!DOCTYPE html>
<head>
	<meta charset="utf-8">
	<title>für mo</title>
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
	<script src="http://medialize.github.io/jQuery-contextMenu/src/jquery.contextMenu.js"></script>
	<script src="http://medialize.github.io/jQuery-contextMenu/src/jquery.ui.position.js"></script>
	<link rel="stylesheet" type="text/css" href="http://medialize.github.io/jQuery-contextMenu/src/jquery.contextMenu.css">
	<style type="text/css">
.labels > ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: block;
    float: none;
}
.labels > ul > li {
    //display: inline-block;
    width: 60px;
    height: 20px;
    border: 1px solid #CCC;
    overflow: hidden;
    //text-indent: -2000px;
}
.labels > ul > li.selected, .labels > ul > li:hover {
    border: 1px solid #000;
}
.labels > ul > li + li {
    margin-left: 0px;
}
.labels > ul > li.label1 {
    background: orange;
}
.labels > ul > li.label2 {
    background: blue;
    color:#fff
}
.labels > ul > li.label3 {
    background: green;
}
.labels > ul > li.label4 {
    background: yellow;
}
	</style>
</head>
<body>
<div class="context-menu-custom box menu-1"><strong>right click me</strong></div>

<table>
    <tr>
        <td class="context-menu-custom box menu-1" id="ID_2014_11_1_10">click me too</td>
    </tr>
</table>
<br><br>

<script>
$(function () {
	$.contextMenu({
		selector: '.context-menu-custom',
		items: {
			one:	{
				name: "one",
				callback: function(key,opt){ console.log("Clicked on '" + key + "' on element '" + opt.$menu.attr('id')+"'"); }
			}
		}
	});
});
</script>
</body>
</html>
 
und was genau ist jetzt das ziel? $menu wird generiert und hat deswegen keine id.
$trigger ist einmal das viv und hat auch keine und einmal das td, mit $trigger kannst du dir für das td die id anzeigen lassen:
HTML: 
<!DOCTYPE html>
<head>
	<meta charset="utf-8">
	<title>für mo</title>
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
	<script src="http://medialize.github.io/jQuery-contextMenu/src/jquery.contextMenu.js"></script>
	<script src="http://medialize.github.io/jQuery-contextMenu/src/jquery.ui.position.js"></script>
	<link rel="stylesheet" type="text/css" href="http://medialize.github.io/jQuery-contextMenu/src/jquery.contextMenu.css">
	<style type="text/css">
.labels > ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: block;
    float: none;
}
.labels > ul > li {
    //display: inline-block;
    width: 60px;
    height: 20px;
    border: 1px solid #CCC;
    overflow: hidden;
    //text-indent: -2000px;
}
.labels > ul > li.selected, .labels > ul > li:hover {
    border: 1px solid #000;
}
.labels > ul > li + li {
    margin-left: 0px;
}
.labels > ul > li.label1 {
    background: orange;
}
.labels > ul > li.label2 {
    background: blue;
    color:#fff
}
.labels > ul > li.label3 {
    background: green;
}
.labels > ul > li.label4 {
    background: yellow;
}
	</style>
</head>
<body>
<div class="context-menu-custom box menu-1"><strong>right click me</strong></div>

<table>
    <tr>
        <td class="context-menu-custom box menu-1" id="ID_2014_11_1_10">click me too</td>
    </tr>
</table>
<br><br>

<script>
$(function () {
	$.contextMenu({
		selector: '.context-menu-custom',
		items: {
			one:	{
				name: "one",
				callback: function(key,opt){ console.log("Clicked on '" + key + "' on element '" + opt.$trigger.attr('id')+"'"); }
			}
		}
	});
});
</script>
</body>
</html>
 
hooray! wenn´s das forum nicht schon gäbe, müsste ich´s erfinden :)
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben