+ Start a Discussion
k_ogawak_ogawa 

チェックボックスリストのテーブル化

お世話になっております。

表題の件なのですが、現行ではチェックボックス付のリストが縦に並んでいるだけなのですが、
これをテーブルの形に変更したいです。
いろいろ調べるとラッパークラスを作成して・・・という風に出ているのですが、現行のロジックでは
ラッパークラスは使用しておらず、どのように対応させたらよいかがわかりません。

わかる方いらっしゃいましたらよろしくお願いいたします。
なるべく今のロジック(apex)を変えずにできたらな、と思います。


以下、ロジックです。
<apex>

<apex:pageBlockSection title="ブランド選択"/>
<apex:inputCheckbox value="{!CheckChange}" onchange="return allChecked();" id="checkChange" style="position: relative; left: 0px; top: 0px;"/>
<apex:outputText value=" 一括選択/解除" style="font-weight:900;" />
<apex:selectCheckboxes value="{!brands}" id="checkBoxes" layout="pageDirection" style="position: relative; left: 15px; top: 0px;">
<apex:selectOptions value="{!items}"/>
</apex:selectCheckboxes><br/>
<script type="text/javascript">
function allChecked() {
  /* 一括チェックボックスのID取得 */
  var targetCheckId = '{!$Component.theForm.checkChange}';
  var targetCheck = document.getElementById(targetCheckId);
  var itemCnt = '{!items.size}';
  var checkId = '{!$Component.theForm.checkBoxes}';
  for (var i = 0; i < itemCnt; i++) {
   / 一括チェックボックスと同じ値をセット */
   document.getElementById(checkId + ':' + i).checked = targetCheck.checked;
  }
  return false;  
}
</script>
<br/>




<visualforce>

public List<String> brands {get; set;}
public Boolean CheckChange {get; set;}
public List<SelectOption> items {get; set;}

public BrandInsertController () {
  this.id = Apexpages.currentPage().getParameters().get('id');
  this.StartDate = Datetime.now().format('yyyy/MM/dd', 'JST');
  this.EndDate = Datetime.now().format('yyyy/MM/dd', 'JST');
  this.items = getSelOptions();
  this.brands = new List<String>();
}
   
public List<SelectOption> seloptions;

/** ブランド一覧取得 */
public List<SelectOption> getSelOptions() {
  List<SelectOption> seloptions = new list<SelectOption>();
  Schema.DescribeFieldResult fieldResult = Event__c.brand__c.getDescribe();
  List<Schema.PicklistEntry> pickListEntry = fieldResult.getPicklistValues();
  for (Schema.PicklistEntry pick: pickListEntry) {
    seloptions.add(new selectOption(pick.getValue(), pick.getLabel()));
  }
  return seloptions;
}


完成イメージは以下になります。

User-added image
Best Answer chosen by k_ogawa
Taiki YoshikawaTaiki Yoshikawa
こんな感じになると思います。
<apex:page controller="CheckboxTableViewController">
    <apex:form >
        <apex:pageBlock >
            <apex:pageBlockSection columns="1">
                <apex:pageBlockTable value="{!wrappers}" var="item">
                    <apex:column style="width: 20px;">
                        <apex:inputCheckbox value="{!item.isChecked}" />
                    </apex:column>
                    <apex:column headerValue="Name">
                        <apex:outputText value="{!item.name}" />
                    </apex:column>
                </apex:pageBlockTable>
            </apex:pageBlockSection>
        </apex:pageBlock>
    </apex:form>
</apex:page>
public with sharing class CheckboxTableViewController {
    
    public List<CheckboxTableViewWrapper> wrappers {get; set;}
    
    public CheckboxTableViewController() {
        this.wrappers = getWrappers();
    }
    
    private List<CheckboxTableViewWrapper> getWrappers() {
        
        List<CheckboxTableViewWrapper> lists = new List<CheckboxTableViewWrapper>();
        
        Schema.DescribeFieldResult fieldResult = Account.Industry.getDescribe();
        List<Schema.PicklistEntry> pickListEntry = fieldResult.getPicklistValues();
        for (Schema.PicklistEntry pick: pickListEntry) {
            lists.add(new CheckboxTableViewWrapper(pick.getLabel()));
        }
        
        return lists;
    }
}
public with sharing class CheckboxTableViewWrapper {
    
    public Boolean isChecked {get; set;}
    public String name {get; set;}
    
    public CheckboxTableViewWrapper() {
        this.isChecked = false;
        this.name = '';
    }
    
    public CheckboxTableViewWrapper(String prmName) {
        this.isChecked = false;
        this.name = prmName;
    }
}




All Answers

Taiki YoshikawaTaiki Yoshikawa
レコード毎にチェックボックスが付いているイメージですね。
これは「apex:selectCheckboxes」ではなくラッパークラスを用意する必要があると思います。

ラッパークラスで対応すればチェックのついているレコード情報を取得するということも簡単に行うことができます。
現行のロジックを変更する必要がありますが、そちらの方法に切り替える方がいいかもしれません。
k_ogawak_ogawa
Taiki 様
いつもお世話になっております。

やはりラッパークラスを用意しないとダメなんですね。

ただ、下記の部分をどのようにラッパークラスで表現すればよいかがわかっておりません。

public List<SelectOption> getSelOptions() {
  List<SelectOption> seloptions = new list<SelectOption>();
  Schema.DescribeFieldResult fieldResult = Event__c.brand__c.getDescribe();
  List<Schema.PicklistEntry> pickListEntry = fieldResult.getPicklistValues();
  for (Schema.PicklistEntry pick: pickListEntry) {
    seloptions.add(new selectOption(pick.getValue(), pick.getLabel()));
  }
  return seloptions;
}


よろしければ助言をお願いいたします。
Taiki YoshikawaTaiki Yoshikawa
こんな感じになると思います。
<apex:page controller="CheckboxTableViewController">
    <apex:form >
        <apex:pageBlock >
            <apex:pageBlockSection columns="1">
                <apex:pageBlockTable value="{!wrappers}" var="item">
                    <apex:column style="width: 20px;">
                        <apex:inputCheckbox value="{!item.isChecked}" />
                    </apex:column>
                    <apex:column headerValue="Name">
                        <apex:outputText value="{!item.name}" />
                    </apex:column>
                </apex:pageBlockTable>
            </apex:pageBlockSection>
        </apex:pageBlock>
    </apex:form>
</apex:page>
public with sharing class CheckboxTableViewController {
    
    public List<CheckboxTableViewWrapper> wrappers {get; set;}
    
    public CheckboxTableViewController() {
        this.wrappers = getWrappers();
    }
    
    private List<CheckboxTableViewWrapper> getWrappers() {
        
        List<CheckboxTableViewWrapper> lists = new List<CheckboxTableViewWrapper>();
        
        Schema.DescribeFieldResult fieldResult = Account.Industry.getDescribe();
        List<Schema.PicklistEntry> pickListEntry = fieldResult.getPicklistValues();
        for (Schema.PicklistEntry pick: pickListEntry) {
            lists.add(new CheckboxTableViewWrapper(pick.getLabel()));
        }
        
        return lists;
    }
}
public with sharing class CheckboxTableViewWrapper {
    
    public Boolean isChecked {get; set;}
    public String name {get; set;}
    
    public CheckboxTableViewWrapper() {
        this.isChecked = false;
        this.name = '';
    }
    
    public CheckboxTableViewWrapper(String prmName) {
        this.isChecked = false;
        this.name = prmName;
    }
}




This was selected as the best answer
Taiki YoshikawaTaiki Yoshikawa
User-added image
k_ogawak_ogawa
有難うございます。
早速サンプルを基に作り直してみたいと思います。

何かあればまた質問させて頂きます。
k_ogawak_ogawa
Taiki 様
お返事遅くなりまして申し訳ございません。

サンプルコードを基にテーブルを作成したところ無事思ったとおりの動きになりました。
ありがとうございます。
またよろしくお願い致します。
Taiki YoshikawaTaiki Yoshikawa

お力になれて良かったです(^^)