Aipoの一覧画面で一括削除などをする場合にチェックボックスを一気に入れるスクリプトの解説

一覧のヘッダーにチェックボックスを置いて一気にチェックを入れるソースです。

https://github.com/aipocom/aipo/blob/d594285052a88f73a9d18278e2f7eda1e15150ca/portlets/account/src/main/webapp/WEB-INF/templates/vm/portlets/html/ajax-account-position-list.vm#L52

 

#ALtdheadAtt("#ALswitchCheckbox()" "class='auiMTCheck center'")

#ALswitchCheckbox()はGlobalMacroに書いてあります。

https://github.com/aipocom/aipo/blob/master/war/src/main/webapp/WEB-INF/templates/vm/GlobalMacros.vm#L502

 

#macro(ALswitchCheckbox)
<input name="switchCheckbox" type="checkbox" onclick="aimluck.io.switchCheckbox(this);" />
#end

一括でチェックを入れるJavascriptはこちら aimluck.io.switchCheckbox()

https://github.com/aipocom/aipo/blob/82f6d2c23379043ad41d68febfecb8d0fef4f50d/war/src/main/webapp/javascript/aimluck/io/form.js#L861

aimluck.io.switchCheckbox = function(checkbox) {
  var element;

  if (checkbox.checked) {
    for (i = 0; i < checkbox.form.elements.length; i++) {
      element = checkbox.form.elements[i];
      if (!element.disabled && element.type == "checkbox") {
        element.checked = true;
      }
    }
  } else {
    for (i = 0; i < checkbox.form.elements.length; i++) {
      element = checkbox.form.elements[i];
      if (!element.disabled && element.type == "checkbox") {
        element.checked = false;
      }
    }
  }
}

ハックノートをフォローして
最新情報をチェックしよう

AWS構築サービスの全てをまとめた資料を公開中

ハックノート(TOWN株式会社)では、AWSの導入や構築支援を行っています。AWS導入メニューやサービス詳細、構成例や費用を掲載した資料をダウンロードできます。

AWSの新規導入やAWSへの移行を検討の際は、ぜひご参考ください。


APNコンサルティングパートナー

TOWN株式会社はAmazon公認コンサルティングパートナーです。