function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
thsrthsr 

★助けてください★=項目が非表示の場合に余計の線が表示されてしまう

以下のように項目2が非表示(rendered="false")となった場合、画面上に項目1と項目3の間に2本の線が表示されてしまうのです。理想は1本の線にしたいのですが、やり方をご存じの方がいらっしゃいましたら、ご教授いただけませんか?

<apex:page >
<apex:pageblock >
        <apex:tabPanel id="tab_panel" switchType="client" activeTabClass="tab__active" inactiveTabClass="tab__inactive" >
          <apex:tab name="tab0"  label="タブ1" >
            <table border="0" cellpadding="0" cellspacing="0" style="width: 100%;">
              <tr>
                <td class="td__section_group" style="width: 100%;">
                  <div class="div__section_decorate div__columns1">
                    <apex:pageBlockSection columns="1">
                      <apex:pageBlockSectionItem >
                      <apex:outputLabel value="項目1" />                                            
                      <apex:outputtext value="abcd1">
                      </apex:outputtext>
                      </apex:pageBlockSectionItem>      
                      <apex:pageBlockSectionItem >
                      <apex:outputLabel value="項目2" rendered="false"/>                                            
                      <apex:outputtext value="abcd2" rendered="false">
                      </apex:outputtext>
                      </apex:pageBlockSectionItem>   
                      <apex:pageBlockSectionItem >
                      <apex:outputLabel value="項目3" />                                            
                      <apex:outputtext value="abcd3">
                      </apex:outputtext>
                      </apex:pageBlockSectionItem>                                                                  
                    </apex:pageBlockSection>
                  </div>
                </td>
                
              </tr>
            </table>
          </apex:tab>
        </apex:tabPanel>
</apex:pageblock>
</apex:page>
Best Answer chosen by thsr
Taiki YoshikawaTaiki Yoshikawa
reRenderの対象にapex:pageBlockSectionItemのIDを直接指定していませんでしょうか。
対象にはpageBlockSectionやpageBlockなどの親要素を指定する必要があります。
(個人的にはapex:formがオススメです。)

これでYamazakiさんの方法で表示/非表示の切り替えができると思います。


一応簡単なサンプルコードを貼っておきます。
<apex:page controller="RenderedSampleController" tabStyle="Account">
    <apex:form id="form">
        <apex:pageBlock id="block">
            <apex:pageBlockButtons location="top">
                <apex:commandButton value=" Click " action="{!doClick}" reRender="form" />
            </apex:pageBlockButtons>
            <apex:pageBlockSection columns="1" id="section">
                <apex:pageBlockSectionItem >
                    <apex:outputLabel value="{!$ObjectType.Account.Fields.Name.Label}" />
                    <apex:outputText value="salesforce.com" />
                </apex:pageBlockSectionItem>
                <apex:pageBlockSectionItem rendered="{!isView}" id="accNumSectionItem">
                    <apex:outputLabel value="{!$ObjectType.Account.Fields.AccountNumber.Label}" />
                    <apex:outputText value="sforce-001" />
                </apex:pageBlockSectionItem>
                <apex:pageBlockSectionItem >
                    <apex:outputLabel value="{!$ObjectType.Account.Fields.Phone.Label}" />
                    <apex:outputText value="000-11111-22222" />
                </apex:pageBlockSectionItem>
            </apex:pageBlockSection>
        </apex:pageBlock>
    </apex:form>
</apex:page>
public with sharing class RenderedSampleController {
    
    public Boolean isView {get; set;}
    
    public RenderedSampleController() {
        this.isView = true;
    }

    public void doClick() {
        this.isView = !this.isView;
    }
}

 

All Answers

Shingo YamazakiShingo Yamazaki
thsrさん

以下のように、pageBlockSectionItem そのものにrendered="false" を指定する方法ではどうですか?

before
 
<apex:pageBlockSectionItem >
	<apex:outputLabel value="項目2" rendered="false"/>
	<apex:outputtext value="abcd2" rendered="false">
	</apex:outputtext>
</apex:pageBlockSectionItem>

after
 
<apex:pageBlockSectionItem rendered="false">
	<apex:outputLabel value="項目2" />
	<apex:outputtext value="abcd2" >
	</apex:outputtext>
</apex:pageBlockSectionItem>


 
thsrthsr
Shingo Yamazakiさん

ご回答ありがとうございます。
説明不足で申し訳ございません。

    <apex:outputLabel value="項目2" rendered="条件"/>
   <apex:outputtext value="abcd2" rendered="条件">

実は上記のように、項目2の表示・非表示の「条件」たとえば、{!account.fieldvalue=1}とします。このaccount.fieldvalueは最新の値を取得するため、再描画(redender)を利用しております。apex:pageBlockSectionItemに対して再描画してもうまくいかなかったのですが、apex:pageBlockSectionItemを使わないと表示が崩れますし、もしよい方法をご存じでしたら、是非ご教授ください。(javascriptでの方法でもかまいません)


 
Taiki YoshikawaTaiki Yoshikawa
reRenderの対象にapex:pageBlockSectionItemのIDを直接指定していませんでしょうか。
対象にはpageBlockSectionやpageBlockなどの親要素を指定する必要があります。
(個人的にはapex:formがオススメです。)

これでYamazakiさんの方法で表示/非表示の切り替えができると思います。


一応簡単なサンプルコードを貼っておきます。
<apex:page controller="RenderedSampleController" tabStyle="Account">
    <apex:form id="form">
        <apex:pageBlock id="block">
            <apex:pageBlockButtons location="top">
                <apex:commandButton value=" Click " action="{!doClick}" reRender="form" />
            </apex:pageBlockButtons>
            <apex:pageBlockSection columns="1" id="section">
                <apex:pageBlockSectionItem >
                    <apex:outputLabel value="{!$ObjectType.Account.Fields.Name.Label}" />
                    <apex:outputText value="salesforce.com" />
                </apex:pageBlockSectionItem>
                <apex:pageBlockSectionItem rendered="{!isView}" id="accNumSectionItem">
                    <apex:outputLabel value="{!$ObjectType.Account.Fields.AccountNumber.Label}" />
                    <apex:outputText value="sforce-001" />
                </apex:pageBlockSectionItem>
                <apex:pageBlockSectionItem >
                    <apex:outputLabel value="{!$ObjectType.Account.Fields.Phone.Label}" />
                    <apex:outputText value="000-11111-22222" />
                </apex:pageBlockSectionItem>
            </apex:pageBlockSection>
        </apex:pageBlock>
    </apex:form>
</apex:page>
public with sharing class RenderedSampleController {
    
    public Boolean isView {get; set;}
    
    public RenderedSampleController() {
        this.isView = true;
    }

    public void doClick() {
        this.isView = !this.isView;
    }
}

 
This was selected as the best answer
thsrthsr
Taiki Yoshikawaさん

ご回答ありがとうございます。
なるほど!とりあえず当面の課題が解決しました。
サンプルコードまで添付いただきありがとうございました。

残課題もありそうなので、、、また質問させてください。
よろしくお願い致します。