Support localization for docs.

README.md

@@ -16,7 +16,7 @@ The table displays data in a tabular format and offers rich support to radio, ch
 - [ ] Fix [#76](https://github.com/wenzhixin/bootstrap-table/issues/76): After refreshing table data, search no longer works.
 - [x] Fix [#77](https://github.com/wenzhixin/bootstrap-table/issues/76): After searching and then clearing the search field, table is no longer sortable.
 - [ ] Add `sortable` option, `false` to disable sortable of all columns.
-- [ ] Support localization for docs.
+- [x] Support localization for docs.
 
 ## Features
 

docs/common.js

@@ -19,15 +19,36 @@ $(function() {
             document.documentElement.scrollTop = 0;
             return false;
         });
+        initLocale();
+        initScrollspy();
+        showGotoTop();
+        showBaiduShare();
+        $('#bulletin').bulletin();
+    }
+
+    function initLocale() {
+        var $locale = $('#locale');
+
+        if (!localStorage) {
+            $locale.hide();
+            return;
+        }
         if (getLocale() === 'zh') {
+            $locale.find('.language').text('简体中文').end()
+                .find('[data-locale="en"]').removeClass('active').end()
+                .find('[data-locale="zh"]').addClass('active').end()
+                .find('.dropdown-toggle img').removeClass('flag-en').end()
+                .find('.dropdown-toggle img').addClass('flag-zh').end();
+
             $('[data-zh]').each(function () {
                 $(this).html($(this).data('zh'));
             });
         }
-        initScrollspy();
-        showGotoTop();
-        showBaiduShare();
-        $('#bulletin').bulletin();
+
+        $('[data-locale]').click(function () {
+            localStorage.locale = $(this).data('locale');
+            location.reload(true);
+        });
     }
 
     function initScrollspy() {

docs/docs.css

@@ -1225,4 +1225,17 @@ h1 .icon {
 }
 .ml10 {
     margin-left: 10px;
+}
+.flag {
+    width: 16px;
+    height: 11px;
+    background: url("flags.png") no-repeat;
+    margin-top: -0.18em;
+    display: inline-block;
+}
+.flag.flag-en {
+    background-position: -144px -154px;
+}
+.flag.flag-zh {
+    background-position: -208px -22px;
 }

docs/documentation.html

@@ -42,6 +42,24 @@
                 <li>
                     <a href="examples.html" data-zh="例子">Examples</a>
                 </li>
+                <!-- Localization -->
+                <li id="locale" class="">
+                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
+                        <img src="blank.gif" class="flag flag-en">
+                        <span class="language">English</span> <span class="caret"></span>
+                    </a>
+                    <ul class="dropdown-menu">
+                        <li class="active" data-locale="en">
+                            <a href="javascript:void(0)">
+                                <img src="blank.gif" class="flag flag-en" alt="United States"> English
+                            </a>
+                        <li data-locale="zh">
+                            <a href="javascript:void(0)">
+                                <img src="blank.gif" class="flag flag-zh" alt="China"> 简体中文
+                            </a>
+                        </li>
+                    </ul>
+                </li>
             </ul>
             <ul class="nav navbar-nav navbar-right">
                 <!-- GitHub buttons: see http://ghbtns.com -->

docs/examples.html

@@ -51,6 +51,24 @@
                 <li class="active">
                     <a href="examples.html" data-zh="例子">Examples</a>
                 </li>
+                <!-- Localization -->
+                <li id="locale" class="">
+                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
+                        <img src="blank.gif" class="flag flag-en">
+                        <span class="language">English</span> <span class="caret"></span>
+                    </a>
+                    <ul class="dropdown-menu">
+                        <li class="active" data-locale="en">
+                            <a href="javascript:void(0)">
+                                <img src="blank.gif" class="flag flag-en" alt="United States"> English
+                            </a>
+                        <li data-locale="zh">
+                            <a href="javascript:void(0)">
+                                <img src="blank.gif" class="flag flag-zh" alt="China"> 简体中文
+                            </a>
+                        </li>
+                    </ul>
+                </li>
             </ul>
             <ul class="nav navbar-nav navbar-right">
                 <!-- GitHub buttons: see http://ghbtns.com -->

docs/getting-started.html

@@ -43,6 +43,24 @@
                 <li>
                     <a href="examples.html" data-zh="例子">Examples</a>
                 </li>
+                <!-- Localization -->
+                <li id="locale" class="">
+                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
+                        <img src="blank.gif" class="flag flag-en">
+                        <span class="language">English</span> <span class="caret"></span>
+                    </a>
+                    <ul class="dropdown-menu">
+                        <li class="active" data-locale="en">
+                            <a href="javascript:void(0)">
+                                <img src="blank.gif" class="flag flag-en" alt="United States"> English
+                            </a>
+                        <li data-locale="zh">
+                            <a href="javascript:void(0)">
+                                <img src="blank.gif" class="flag flag-zh" alt="China"> 简体中文
+                            </a>
+                        </li>
+                    </ul>
+                </li>
             </ul>
             <ul class="nav navbar-nav navbar-right">
                 <!-- GitHub buttons: see http://ghbtns.com -->

docs/index.html

@@ -42,6 +42,24 @@
                 <li>
                     <a href="examples.html" data-zh="例子">Examples</a>
                 </li>
+                <!-- Localization -->
+                <li id="locale" class="">
+                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
+                        <img src="blank.gif" class="flag flag-en">
+                        <span class="language">English</span> <span class="caret"></span>
+                    </a>
+                    <ul class="dropdown-menu">
+                        <li class="active" data-locale="en">
+                            <a href="javascript:void(0)">
+                                <img src="blank.gif" class="flag flag-en" alt="United States"> English
+                            </a>
+                        <li data-locale="zh">
+                            <a href="javascript:void(0)">
+                                <img src="blank.gif" class="flag flag-zh" alt="China"> 简体中文
+                            </a>
+                        </li>
+                    </ul>
+                </li>
             </ul>
             <ul class="nav navbar-nav navbar-right">
                 <!-- GitHub buttons: see http://ghbtns.com -->