better handling of save/saving message, error dialog support

[plstackapi.git] / planetstack / templates / admin / dashboard / customize.html

diff --git a/planetstack/templates/admin/dashboard/customize.html b/planetstack/templates/admin/dashboard/customize.html
index 274040e..d2e8a20 100644 (file)
--- a/planetstack/templates/admin/dashboard/customize.html
+++ b/planetstack/templates/admin/dashboard/customize.html
@@ -10,8 +10,8 @@
     </div>\r
     <div class="customize_column">\r
     <br>\r
-    <div class="btn btn-success" id="btn-add">Add &raquo;</div><br><br>\r
-    <div class="btn btn-success" id="btn-remove">&laquo; Remove</div>\r
+    <div class="btn btn-success" id="customize-btn-add">Add &raquo;</div><br><br>\r
+    <div class="btn btn-success" id="customize-btn-remove">&laquo; Remove</div>\r
     </div>\r
     <div class="customize_column">\r
     <div>Selected Dashboard Views</div>\r
@@ -21,31 +21,32 @@
         {% endfor %}\r
     </select>\r
     <br>\r
-    <div class="btn btn-high btn-info" id="btn-save">Save</div>\r
+    <div class="btn btn-high btn-info" id="customize-btn-save">Save</div>\r
+    <div style="display: none" id="customize-msg-saving">Saving...</div>\r
     </div>\r
     <div class="customize_column">\r
     <br>\r
-    <div class="btn btn-success" id="btn-up">Up</div><br><br>\r
-    <div class="btn btn-success" id="btn-down">Down</div>\r
+    <div class="btn btn-success" id="customize-btn-up">Up</div><br><br>\r
+    <div class="btn btn-success" id="customize-btn-down">Down</div>\r
     </div>\r
     </div>\r
 </form>\r
 
 <script>
 $(document).ready(function() {
-    $('#btn-add').click(function(){\r
+    $('#customize-btn-add').click(function(){\r
         $('#select-from option:selected').each( function() {\r
                 $('#select-to').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>");\r
             $(this).remove();\r
         });\r
     });\r
-    $('#btn-remove').click(function(){\r
+    $('#customize-btn-remove').click(function(){\r
         $('#select-to option:selected').each( function() {\r
             $('#select-from').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>");\r
             $(this).remove();\r
         });\r
     });\r
-    $('#btn-up').bind('click', function() {\r
+    $('#customize-btn-up').bind('click', function() {\r
         $('#select-to option:selected').each( function() {\r
             var newPos = $('#select-to option').index(this) - 1;\r
             if (newPos > -1) {\r
@@ -54,7 +55,7 @@ $(document).ready(function() {
             }\r
         });\r
     });\r
-    $('#btn-down').bind('click', function() {\r
+    $('#customize-btn-down').bind('click', function() {\r
         var countOptions = $('#select-to option').size();\r
         $('#select-to option:selected').each( function() {\r
             var newPos = $('#select-to option').index(this) + 1;\r
@@ -64,9 +65,9 @@ $(document).ready(function() {
             }\r
         });\r
     });\r
-    $('#btn-save').bind('click', function() {\r
-         $( "#btn-save").unbind()\r
-         $( "#btn-save" ).html("<div class='loading'>Saving ...</div>");\r
+    $('#customize-btn-save').bind('click', function() {\r
+         $("#customize-btn-save").hide();\r
+         $("#customize-msg-saving").show();\r
          var items=[];\r
          $("#select-to option").each(function() { items.push($(this).val()); });\r
          $.ajax({\r
@@ -77,7 +78,12 @@ $(document).ready(function() {
                        csrfmiddlewaretoken: "{{ csrf_token }}" // < here
                 },
                 type: 'POST',
-                complete: function () {
+                error: function (jqXHR, textStatus, errorThrown) {
+                    errorDialog("Error", textStatus + " " + jqXHR.responseText);
+                    $("#customize-btn-save").show();
+                    $("#customize-msg-saving").hide();
+                },
+                success: function () {
                         location.reload();
                 }
         });\r