Demande de publication implémentée à l'aide de yii.js dans le framework YII2

Cet article présente principalement la demande de publication implémentée à l'aide de yii.js dans le framework YII2. Il a une certaine valeur de référence. Maintenant, je le partage avec vous. Les amis dans le besoin peuvent s'y référer

yii2 fournit beaucoup de choses. Les classes d'aide, telles que Html, Url, Json, etc., peuvent facilement implémenter certaines fonctions. Parlons brièvement de ce HTML. Je l'utilise souvent lors de l'écriture de vues dans yii2, et je l'ai réutilisé lors de la réécriture d'une page aujourd'hui. Ce qui le rend plus facile à utiliser, c'est qu'il génère non seulement une simple balise HTML, mais peut également facilement implémenter une demande de publication lorsqu'il est combiné avec le propre fichier de ressources statiques de yii2, yii.js.

yii2 a encapsulé ces fonctions. Il vous suffit d'appeler ses méthodes à l'endroit approprié. On peut dire que yii2 est un framework qui peut être utilisé directement. Vous pouvez l'utiliser pour implémenter rapidement un. Fonctions requises : par exemple, placez un bouton de suppression sur la page, cliquez sur le bouton pour envoyer une demande de publication et une boîte de dialogue de confirmation apparaîtra. S'il n'y a pas de classe yiihelpersHtml et yii.js, alors vous devez écrire beaucoup de js/jquery pour réaliser cette fonction. Si vous utilisez yii2, le code suivant peut être implémenté :

 // html代码
 <?= Html::a(
   &#39;删除&#39;,
   [
     &#39;delete&#39;,
     &#39;id&#39; => $id,
   ],
   [
     &#39;data&#39; => [
       &#39;confirm&#39; => &#39;你确定要删除吗？&#39;,
       &#39;method&#39; => &#39;post&#39;,
     ],
   ]
 )
 ?>
 // html代码

Il générera le code html suivant dans la page :

<a href="delete?id=1" rel="external nofollow" data-confirm="你确定要退出吗？" data-method="post">删除</a>

Cliquer sur ce bouton fera apparaître une boîte de dialogue pour confirmer Une demande de publication sera envoyée après suppression. Alors, comment est envoyée cette demande de publication ? Jusqu'à présent, je n'ai pas écrit un seul morceau de code js.

Le framework yii2 cache les détails de la mise en œuvre technique, et la demande de publication est implémentée dans yii.js. Dans yii.js, l'objet window.yii est défini et la méthode initModule de l'objet window.yii est initialisée :

window.yii = (function ($) {
  var pub = {
    // 定义了处理事件的方法，比如下面这个：
    confirm: function (message, ok, cancel) {
      if (window.confirm(message)) {
        !ok || ok();
      } else {
        !cancel || cancel();
      }
    },


    handleAction: function ($e, event) {
      var $form = $e.attr('data-form') ? $('#' + $e.attr('data-form')) : $e.closest('form'),
      method = !$e.data('method') && $form ? $form.attr('method') : $e.data('method'),

      // 其他省略

    },

    // 其他省略
  };
  // 初始化模块
  initModule: function (module) {
    if (module.isActive !== undefined && !module.isActive) {
      return;
    }
    if ($.isFunction(module.init)) {
      module.init();
    }
    $.each(module, function () {
      if ($.isPlainObject(this)) {
        pub.initModule(this);
      }
    });
  },

  // 初始化方法
  init: function () {
    initCsrfHandler();
    initRedirectHandler();
    initAssetFilters();
    initDataMethods();
  },

  return pub;
})(window.jQuery);

window.jQuery(function () {
  window.yii.initModule(window.yii);
});

Le initDataMethods() ci-dessus appellera la méthode pub.handleAction :

  function initDataMethods() {
    var handler = function (event) {
      var $this = $(this),
        method = $this.data('method'),
        message = $this.data('confirm'),
        form = $this.data('form');

      if (method === undefined && message === undefined && form === undefined) {
        return true;
      }

      if (message !== undefined) {
        $.proxy(pub.confirm, this)(message, function () {
          pub.handleAction($this, event);
        });
      } else {
        pub.handleAction($this, event);
      }
      event.stopImmediatePropagation();
      return false;
    };

    // handle data-confirm and data-method for clickable and changeable elements
    $(document).on('click.yii', pub.clickableSelector, handler)
      .on('change.yii', pub.changeableSelector, handler);
  }

Vous pouvez voir que cette méthode obtiendra la valeur de l'attribut de données de la balise a générée ci-dessus, puis la remettra à handlerAction pour traitement. handlerAction gère diverses requêtes en générant dynamiquement un formulaire, et enfin le soumet en déclenchant l'événement submit.

// 其他省略

$form = $(&#39;<form/>&#39;, {method: method, action: action});
var target = $e.attr(&#39;target&#39;);
if (target) {
  $form.attr(&#39;target&#39;, target);
}
if (!/(get|post)/i.test(method)) {
  $form.append($(&#39;<input/>&#39;, {name: &#39;_method&#39;, value: method, type: &#39;hidden&#39;}));
  method = &#39;post&#39;;
  $form.attr(&#39;method&#39;, method);
}
if (/post/i.test(method)) {
  var csrfParam = pub.getCsrfParam();
  if (csrfParam) {
    $form.append($(&#39;<input/>&#39;, {name: csrfParam, value: pub.getCsrfToken(), type: &#39;hidden&#39;}));
  }
}
$form.hide().appendTo(&#39;body&#39;);

// Autres omis

PS : Il est très pratique d'utiliser des frameworks pour des projets, mais après avoir utilisé le framework pendant une longue période, il est facile d'oublier la technologie de base. Encore faut-il poser de bonnes bases, pour que quel que soit le framework utilisé, il ne soit pas utilisé dans le brouillard.

Recommandations associées :

Méthode d'intégration du framework Yii2 du moteur de recherche Xunsearch

Méthode d'exportation de fichier Excel à partir de PHPExcel dans Yii2 cadre

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!