Keine Seite neu laden nach einem Formular

Sempervivum

Erfahrenes Mitglied
Das wäre schon möglich aber wenn der Link nicht aufgerufen werden soll, soll ja stattdessen das PHP-Skript aufgerufen werden. Und dafür brauchst Du dann Ajax, womit wir wieder am Anfang wären.
 

Dragosius

Erfahrenes Mitglied
Das wäre schon möglich aber wenn der Link nicht aufgerufen werden soll, soll ja stattdessen das PHP-Skript aufgerufen werden. Und dafür brauchst Du dann Ajax, womit wir wieder am Anfang wären.
Könntest du mir da eventuell (nochmal) etwas helfen?
Wir sind hier ja bisher nur die Möglichkeit über ein Formular durchgegangen oder habe ich was überlesen?
 

Sempervivum

Erfahrenes Mitglied
Heißt das, Du hast irgend wie diesen Link zur Verfügung und möchtest, anstatt ihn direkt aufzurufen, mit Ajax das PHP-Skript aufrufen? In welcher Form hast Du denn den Link vorliegen? In einer Variablen? In einem a-href-Tag? Oder ...?
 

Sempervivum

Erfahrenes Mitglied
PS: Ich hätte gleich genauer lesen sollen: Du hast den Link als a-Element. In dem Fall ist es ganz einfach wenn Du die Parameter einfach mit der get-Methode überträgst:
Code:
    <a href="testget.php?param1=value1&param2=value2">Link</a>
    <span id="out"></span>
    <script>
        document.querySelector('a').addEventListener('click', event => {
            // Default-Aktion für Klick auf den Link,
            // d. h. direktes Aufrufen der Seite,
            // verhindern, da wir das Linkziel mit Ajax aufrufen wollen:
            event.preventDefault();
            // Link aus dem href-Attribut holen:
            const link = event.target.href;
            fetch(link, {
                method: 'get'
            }).then(res => {
                return res.text();
            }).then(res => {
                console.log(res);
                document.getElementById('out').innerHTML = res;
            });
        })
    </script>
 

Dragosius

Erfahrenes Mitglied
Hallo,

also irgendwie wird die Seite trotzdem aufgerufen.

Ich habe es momentan folgendermaßen eingebunden:
PHP:
$trow = "<a href=\"schreibe.php?text=gag&nickname=$v[u_nick]\">G</a>&nbsp;";
$trow .= "<a href=\"schreibe.php?text=kick&nickname=$v[u_nick]\">K</a>&nbsp;";

$trow .= "<span id=\"out\"></span>\n";
$trow .= "<script>
document.querySelector('a').addEventListener('click', event => {
    // Default-Aktion für Klick auf den Link,
    // d. h. direktes Aufrufen der Seite,
    // verhindern, da wir das Linkziel mit Ajax aufrufen wollen:
    event.preventDefault();
    // Link aus dem href-Attribut holen:
    const link = event.target.href;
    fetch(link, {
        method: 'get'
    }).then(res => {
        return res.text();
    }).then(res => {
        console.log(res);
        document.getElementById('out').innerHTML = res;
    });
})
</script>";

echo $trow;

Kann der Link dann eventuell noch mit einer Klasse versehen werden, da dort auch noch andere Links eingebunden sind, welche normal aufgerufen werden.
 

Sempervivum

Erfahrenes Mitglied
Dieses document.querySelector('a') wirkt nur auf das erste a-Tag auf der Seite, alle anderen werden normal aufgerufen.
Selbstverständlich kannst Du das mit einer Klasse eingrenzen. Wenn es nur ein einziger Link ist, kannst Du bei querySelector bleiben, dann müsste das JS so aussehen:
document.querySelector('a.deine-klasse')
 

Sempervivum

Erfahrenes Mitglied
Auch kein Problem:
Code:
<script>
document.querySelectorAll('a.deine-klasse').forEach(item => {
    item.addEventListener('click', event => {
        // Default-Aktion für Klick auf den Link,
        // d. h. direktes Aufrufen der Seite,
        // verhindern, da wir das Linkziel mit Ajax aufrufen wollen:
        event.preventDefault();
        // Link aus dem href-Attribut holen:
        const link = event.target.href;
        fetch(link, {
            method: 'get'
        }).then(res => {
            return res.text();
        }).then(res => {
            console.log(res);
            document.getElementById('out').innerHTML = res;
        });
    });
})
</script>";
 
Zuletzt bearbeitet:

Dragosius

Erfahrenes Mitglied
Ich wollte kurz Bescheid geben, dass ich es soeben erfolgreich getestet habe.
Somit kann ich bei der Software wieder einen Frame einsparen. :)