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

@iwasaki 784views 更新:2014年2月7日

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

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;
      }
    }
  }
}

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません