yii2
Pjax

Stap 1 Structuur toevoegen

In views \ site \ form-submit.php

<?php Pjax::begin(['id'=>'id-pjax']); ?>
<?= Html::beginForm(['site/form-submission'], 'post', ['data-pjax' => '', 'class' => 'form-inline']); ?>
    <?= Html::input('text', 'string', Yii::$app->request->post('string'), ['class' => 'form-control']) ?>
    <?= Html::submitButton('Hash String', ['class' => 'btn btn-lg btn-primary', 'name' => 'hash-button']) ?>
<?= Html::endForm() ?>
<h3><?= $stringHash ?></h3>
<?php Pjax::end(); ?>

Stap 2 Server Side Code

public function actionFormSubmission()
{
    $security = new Security();
    $string = Yii::$app->request->post('string');
    $stringHash = '';
    if (!is_null($string)) {
        $stringHash = $security->generatePasswordHash($string);
    }
    return $this->render('form-submission', [
        'stringHash' => $stringHash,
    ]);
}

hoe pjax te gebruiken

Voeg deze regel toe aan het begin van uw weergave.

<?php
use yii\widgets\Pjax;
?>

Voeg de volgende twee regels toe rond de inhoud die gedeeltelijk moet worden bijgewerkt.

<?php Pjax::begin(['id'=>'id-pjax']); ?>
Content that needs to be updated
<?php Pjax::end(); ?>

pjax opnieuw laden

$.pjax.reload({container: '#id-pjax'});

gebruik time-out argument in pjax

<?php Pjax::begin(['id'=>'id-pjax', 'timeout' => false]); ?>

u kunt een geheel getal opgeven voor het time-outargument, wat het aantal te wachten milliseconden is (de standaardwaarde is 1000). Als de uitvoeringstijd op de server groter is dan deze time-outwaarde, wordt het laden van de volledige pagina geactiveerd.

Standaard verzendt pjax het formulier met de GET-methode. U kunt de methode voor het indienen van het formulier wijzigen in POST zoals in het volgende voorbeeld

<?php Pjax::begin(['id'=>'id-pjax', 'timeout' => false, 'clientOptions' => ['method' => 'POST']]); ?>

Pjax geavanceerd gebruik

Yii Framework 2.0 wordt geleverd met ingebouwde ondersteuning voor Pjax , een JavaScript-bibliotheek die de laadtijd van pagina's vermindert. Dit wordt bereikt door alleen het deel van de pagina bij te werken dat door Ajax is gewijzigd, wat zich kan vertalen in aanzienlijke besparingen als u veel andere middelen op uw pagina's heeft. Enkele van onze projecten gebruiken deze functionaliteit en we wilden wat geleerde lessen delen.

Probleem : pagina 1 is een eenvoudige statische pagina die weinig elementen bevat. Pagina 2 bevat een ActiveForm en andere widgets. De ActiveForm JavaScript-bronnen moeten worden geladen om de inline JavaScript te laten werken, maar omdat pagina 1 deze activa niet bevatte, liep er een JavaScript-fout op bij het uitvoeren van de activeform-regel: 'Uncaught TypeError: undefined is geen functie'.

Oplossing : neem ActiveForm-middelen op in een gedeelde activabundel die op alle pagina's wordt geladen, en zorg ervoor dat op elke invoerpagina de juiste scripts beschikbaar zijn.

class AppAsset extends AssetBundle
{
    ...
    public $depends = [
        'yii\widgets\ActiveFormAsset',
        'yii\validators\ValidationAsset',
    ];
    ...
}

Probleem : in hetzelfde voorbeeld hierboven, bevat pagina 1 enkele widgets (NavBar, enz.). Pagina 2 bevat dezelfde widgets plus een paar meer (ActiveForm, enz.). Bij het laden van de pagina via Pjax was er een aangepast inline JavaScript actief, maar het inline-script van de ActiveForm-widget leek niet te werken, omdat de validatiecode niet werkte. In debug hebben we geconstateerd dat de functie ActiveForm init actief was, maar de variabele 'this' leek niet overeen te komen met de ActiveForm. Het kwam eigenlijk overeen met de NavBar-div. Bij het onderzoeken van de div-ID's zagen we dat het ActiveForm verwachtte de ID van # w1 te hebben, maar de NavBar kreeg die ID al op de pagina 1 toegewezen, omdat dat de eerste widget was die op die pagina werd aangetroffen.

Oplossing : vertrouw niet op Yii om de widget-ID's automatisch voor u te genereren. Geef in plaats daarvan altijd een ID door wanneer u de widget maakt om de controle over die ID's te behouden.

Probleem : Pjax-verzoek werd exact 1000 ms geannuleerd nadat het verzoek was gestart.

Oplossing : verhoog de Pjax-time-outinstelling. De standaardwaarde is 1 seconde, wat acceptabel moet zijn voor productielocaties. Tijdens het ontwikkelen, terwijl we xdebug gebruiken, overschrijden onze pagina-laadtijden echter regelmatig deze limiet.

Probleem : webtoepassing implementeert het PRG- patroon (Post-Redirect-Get) . Pjax herlaadt de hele pagina in plaats van alleen de omleiding.

Oplossing : dit is het beoogde gedrag van Pjax. De omleiding dient zijn doel niet wanneer u Pjax gebruikt, dus u kunt bepalen of een verzoek Pjax is, en zo ja, de inhoud weergeven in plaats van omleiden. Een voorbeeld kan er als volgt uitzien:

$endURL = "main/endpoint";
if (Yii::$app->request->isPjax) {
    return $this->run($endURL);
} else {
    return $this->redirect([$endURL]);
}

Wat is je ervaring met Pjax en Yii? Reageer hieronder als je goten hebt gevonden of betere oplossingen hebt dan de onze!