• Hallo liebe Userinnen und User,

    nach bereits längeren Planungen und Vorbereitungen sind wir nun von vBulletin auf Xenforo umgestiegen. Die Umstellung musste leider aufgrund der Serverprobleme der letzten Tage notgedrungen vorverlegt werden. Das neue Forum ist soweit voll funktionsfähig, allerdings sind noch nicht alle der gewohnten Funktionen vorhanden. Nach Möglichkeit werden wir sie in den nächsten Wochen nachrüsten. Dafür sollte es nun einige der Probleme lösen, die wir in den letzten Tagen, Wochen und Monaten hatten. Auch der Server ist nun potenter als bei unserem alten Hoster, wodurch wir nun langfristig den Tank mit Bytes vollgetankt haben.

    Anfangs mag die neue Boardsoftware etwas ungewohnt sein, aber man findet sich recht schnell ein. Wir wissen, dass ihr alle Gewohnheitstiere seid, aber gebt dem neuen Board eine Chance.
    Sollte etwas der neuen oder auch gewohnten Funktionen unklar sein, könnt ihr den "Wo issn da der Button zu"-Thread im Feedback nutzen. Bugs meldet ihr bitte im Bugtracker, es wird sicher welche geben die uns noch nicht aufgefallen sind. Ich werde das dann versuchen, halbwegs im Startbeitrag übersichtlich zu halten, was an Arbeit noch aussteht.

    Neu ist, dass die Boardsoftware deutlich besser für Mobiltelefone und diverse Endgeräte geeignet ist und nun auch im mobilen Style alle Funktionen verfügbar sind. Am Desktop findet ihr oben rechts sowohl den Umschalter zwischen hellem und dunklem Style. Am Handy ist der Hell-/Dunkelschalter am Ende der Seite. Damit sollte zukünftig jeder sein Board so konfigurieren können, wie es ihm am liebsten ist.


    Die restlichen Funktionen sollten eigentlich soweit wie gewohnt funktionieren. Einfach mal ein wenig damit spielen oder bei Unklarheiten im Thread nachfragen. Viel Spaß im ngb 2.0.

Jquery Tabelle TH on Klick

StandBy1

Neu angemeldet

Registriert
8 Sep. 2017
Beiträge
4
Hallo Leute,

ich habe eine einfache Tabelle:

[src=html4strict]
<table id="tblData">
<tr>
<th class="hidden">ID</th>
<th>Name</th>
<th>Age</th>
<th>Country</th>
</tr>
<tr>
<td class="hidden">ID</td>
<td>Maria Anders</td>
<td>30</td>
<td>Germany</td>
</tr>
<tr>
<td class="hidden">1</td>
<td contenteditable="false" onBlur="saveToDatabase(this);">Francisco Chang</td>
<td>24</td>
<td>Mexico</td>
</tr>
<tr>
<td class="hidden">2</td>
<td>Roland Mendel</td>
<td>100</td>
<td>Austria</td>
</tr>
<tr>
<td class="hidden">3</td>
<td contenteditable="true" onBlur="saveToDatabase(this);">Helen Bennett</td>
<td contenteditable="true" onBlur="saveToDatabase(this);">28</td>
<td contenteditable="true" onBlur="saveToDatabase(this);">UK</td>
</tr>
<tr>
<td class="hidden">4</td>
<td>Yoshi Tannamuri</td>
<td>35</td>
<td>Canada</td>
</tr>
<tr>
<td class="hidden">5</td>
<td>Giovanni Rovelli</td>
<td>46</td>
<td>Italy</td>
</tr>
<tr>
<td class="hidden">6</td>
<td>Alex Smith</td>
<td>59</td>
<td>USA</td>
</tr>
</table>
[/src]

mit diesem Script komme ich nach einem Klick an die Daten der Zelle und ihrer ID:

[src=javascript]
function saveToDatabase(editableObj)
{
if ($(editableObj).closest("td").attr('contenteditable') == 'true')
{
console.log($( editableObj ).text());

console.log($(editableObj).siblings(":first").text());

console.log(Name des TH von der Zelle) <-- das suche ich
}
};
[/src]

was ich suche und nicht hinbekomme ist das ich auch noch console.log(Zellen Head bekomme).

also das TH was zu der gedrückten Zelle gehört.

Kann mir wer sagen wie das geht?
 

Dr. M.

Weltmaschinenfahrer

Registriert
30 Juli 2018
Beiträge
188
Sowas:
[src=javascript]let td = $(editableObj).closest("td");
// Numerischer Index
console.log(td.index());
// Header
console.log($("th", td.closest("table"))[td.index()].innerText);[/src]
Insgesamt ist das aber recht fehleranfaellig, den Titel aus dem Tabellenheader zureuckzulesen.
Mindestens serverseitig musst du das noch einmal ueberpruefen.
 

StandBy1

Neu angemeldet

Registriert
8 Sep. 2017
Beiträge
4
  • Thread Starter Thread Starter
  • #3
Danke für deine Lösung.

Geprüft wird es sicherlich auf Serverseite.
Danke auch für den hinweiss.

Für alle die das mal finden, meine komplett Lösung:

[src=javascript]
$('tr td').each(function()
{
if ($(this).closest("td").attr('contenteditable') == 'true')
{
$(this).mouseover(function()
{
$(this).css("cursor", "pointer");
})

$(this).blur(function()
{
var id = $(this).closest('tr').find('td').eq(0).text();
var data = $(this).closest("td").text();
var head = $(this).closest('table').find('th').eq($(this).index()).text();

$.ajax
({
contentType: "application/x-www-form-urlencoded; charset=UTF-8",
type: 'POST',
url: 'index.php?GOTO=Controller_AJAX/mach_was/',
dataType: 'json',
data: {ID: id, HEADER: head, DATEN:data},
encode: true,
success: function (data)
{
if (data.ID === true)
{
//alert('Alles OK');
}
},
error: function(XMLHttpRequest, textStatus, errorThrown)
{
alert("Status: " + textStatus); alert("Error: " + errorThrown);
}
})
})
}
})
[/src]

Ob das die Beste oder eine saubere Lösung ist kann ich nicht sagen.
Aber es geht :-)
 
Oben