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
VNVN 

Page getting refreshed on close of modal window.

Hi,

I have a modal window which has a few checkboxes displayed. When i select a few checkboxes and click 'ok' button i want the selected chekboxes to be displayed as tabs. But this is not happening because i believe the whole page is getting refreshed and the variable list storing the selected checkboxes is getting cleared. 

How do i stop the page from getting refreshed. I tried using action function but that is not helping either.

The code for tabs display
<div class="tabbable-line tabbable-tabdrop tabbable-custom-profile" id="showcaseTabs">
                            <ul class="nav nav-tabs">
                                <li class="active">
                                    <a href="#tabDashboard" data-toggle="tab"> Dashboard </a>
                                </li>
                                
                                <li>
                                   
                                    <apex:repeat value="{!selectedTabsList}" var="tabName" id="theRepeat">
                                        <apex:outputLink > {!tabName} </apex:outputLink>
                                     </apex:repeat>

                                </li>
                                <li>
                                    <apex:outputLink html-data-target="#displayShowcase" html-data-toggle="modal" > 
                                        <i class="fa fa-plus"></i>
                                    </apex:outputLink>
                                </li>
                                
                                
                            </ul>
</div>


The modal window code

<div id="displayShowcase" class="modal fade" role="dialog" aria-hidden="true">
                    <div class="modal-dialog">
                        <div class="modal-content">
                            <div class="modal-header">
                                <a class="pull-right" data-dismiss="modal" aria-hidden="true">
                                    <i class="fa fa-remove font-theme"></i>
                                </a>
                                <h4 class="modal-title font-theme">Select Tabs</h4>
                            </div>
                            <div class="modal-body">
                                <apex:pageBlock >
                                        <apex:pageBlockTable value="{!showcaseTabList}" var="showCaseTab" id="table" title="All Showcases">
                                            <apex:column >
                                                
                                                <apex:inputCheckbox value="{!showCaseTab.selected}" id="inputId"/>
                                            </apex:column>
                                            <apex:column value="{!showCaseTab.recType}" />
                                            
                                        </apex:pageBlockTable>
                                    </apex:pageBlock>
                            </div>
                            
                            <div class="modal-footer">
                                <button class="btn btn-outline btn-theme" data-dismiss="modal" aria-hidden="true">Cancel</button>
                                
                                <button id="btnConfirm" class="btn btn-outline btn-theme">OK</button>
                            </div>
                            
                        </div>
                    </div>  
                </div>
<apex:actionFunction name="chkSelectedTabs" action="{!allSelectedTabs}"  rerender="showcaseTabsContainer"/>

the javascript for button click
<script src="https://code.jquery.com/jquery-3.1.0.slim.min.js"  
                    integrity="sha256-cRpWjoSOw5KcyIOaZNo4i6fZ9tKPhYYb6i5T9RSVJG8=" 
                    crossorigin="anonymous">
                        </script>
                <script>
                    $(function() {
                        $("#btnConfirm").on("click", function() {
                            chkSelectedTabs();
                            return false;
                        });
                       
                    }); 
                   
            </script>

Please advice
Sure@DreamSure@Dream
Hi VN,

Do you have an element with Id - "showcaseTabsContainer"?

Thanks