1

I have a VF page which gets the folder name from the user and creates a folder in one library. The page has a button & the folders existing the library is shown using a repeater. when the button is clicked, a modal is opened to get the folder name from the user.

     <div class="slds-text-align--center slds-p-top--small">
           <button id="btnNewFolder" class="slds-button slds-button--neutral" >New Folder</button>
        </div>
        <div class="slds" style="margin-left:40% !important;">
           <div aria-hidden="true" role="dialog" hidden="true" class="slds slds-modal slds-fade-in-open" id="modal-new">
              <div class="slds slds-modal__container">
                 <div class="slds slds-modal__header">
                    <button class="slds-button slds-modal__close slds-button--icon-inverse" title="Close" id="cancel">
                       <svg aria-hidden="true" class="slds-button__icon slds-button__icon--large">
                          <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="{!URLFOR($Resource.SLDS0102,'assets/icons/utility-sprite/svg/symbols.svg#close')}"></use>
                       </svg>
                       <span class="slds-assistive-text">Close</span>
                    </button>
                    <h1 class="slds slds-text-heading--medium"> Enter The New Folder Name</h1>
                 </div>
                 <!---------content box---->
                 <div class="slds slds slds-modal__content">
                    <div  class="slds slds slds-form-element__control">
                       <div  class="slds-form">
                          <div class="slds-form-element">
                              <h2 style="text-align:center;font-weight:bold;color:red;display:none" id="Notification"></h2>
                              <div class="slds-m-bottom--xxx-small"></div>
                             <div class="slds-is-required"><label class="slds-form-element__label slds-is-required">Folder Name</label></div>
                             <div class="slds-form-element__control">
                                <apex:inputText value="{!newFolderName}"  styleClass="slds slds-input slds-is-required" id="txtFolderName" style="width:72%" onchange="showCreateBtn();"
                                   onkeyup="this.onchange();" />
                             </div>
                          </div>
                       </div>
                    </div>
                 </div>
                 <!------Footer------->
                 <div class="slds slds-modal__footer">
                    <button class="slds slds-button slds-button--neutral" id="cancelnew" style="margin-right:5px">Cancel</button> 
                    <apex:commandButton styleClass="slds-button slds-button--brand btnCreate"  action="{!CreateNewFolder}"  value="Save" id="btnCreate" style="display:none" onclick="return ValidateFolderName();"/>                        
                 </div>
              </div>
           </div>
           <div class="slds slds-modal-backdrop " id="backdrop"></div>
        </div>
        <!-----------------------------Modal for New End--------------------------->
        <apex:outputPanel id="FolderList">
           <apex:repeat value="{!AssetFolderList}" var="i">
               <div>{!i}</div>
           </apex:repeat>
        </apex:outputPanel>

The below code successfully creates folder as expected. the problem is when I try to rerender the list of folders when the commandbutton btnCreate is clicked. Nothing happens when this button clicked if I add the rerender="FolderList" attribute. The modal popup does not close, the page is not rerendered. If delete just this attribute things starts to work, but the page is getting submitted which I dont want. Please suggest what I am missing

0

Your close button should call an ActionFunction which will allow you to target VF that can be re-rendered.

<apex:actionFunction name="RerenderList" action="{!RerenderList}" rerender="FolderList">
</apex:actionFunction>

<button onClick="RerenderList();">Close</button>

<apex:outputpanel id="FolderList">
</apex:outputpanel>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.