用json數據打開新頁面而不刷新頁面

嗨，我有一個json的用戶，我從中獲取數據和用戶的填充列表..現在，這是調整當用戶點擊此列表od用戶，頁面（屏幕2 ）在沒有頁面刷新或重定向的同一窗口中打開，其中具有json中的詳細信息的該特定用戶的所有信息。用json數據打開新頁面而不刷新頁面

{ 
    "data": { 
     "show_dashboard_access_page": false, 
     "login_status": "signedin", 
     "new_io": true, 
     "bst_users": [{ 
      "userA": { 
       "user_logo": "image path", 
       "partner_since": "Jan 2013", 
       "status_now": "bronze", 
       "year_calculated": 2016, 
       "total": 300000, 
       "year_wise_usage": 123000, 
       "storage_wise_usage": 73000, 
       "server_wise_usage": 50000, 
       "order": 1 
      }, 
      "userB": { 
       "user_logo": "image path", 
       "partner_since": "Feb 2014", 
       "status_now": "silver", 
       "year_calculated": 2016, 
       "total": 300000, 
       "year_wise_usage": 160000, 
       "storage_wise_usage": 60000, 
       "server_wise_usage": 100000, 
       "order": 2 
      }, 
      "userC": { 
       "user_logo": "image path", 
       "partner_since": "Mar 2014", 
       "status_now": "silver", 
       "year_calculated": 2016, 
       "total": 300000, 
       "year_wise_usage": 180000, 
       "storage_wise_usage": 80000, 
       "server_wise_usage": 100000, 
       "order": 3 
      } 
      }] 
    }, 
    "success": true 
}

代碼，直到在屏幕上1獲取用戶列表：

$.getJSON("jsonpath", function(response) { 
    $.each(response.data.bst_users, function(idx,obj){ 
     $.each(obj, function(key, value){ 
      console.log(key + ": " + value); 
      var item = "<li> <a href=''> <small> <img src='" + value["user_logo"] + "' alt=''/></small>" + "<span>" + key + "</span>" + "</a> </li>" 
      $('ul').append(item); 
      }); 
    }); 
});

來源

2016-02-12 Deepak

考慮使用AngularJS。這是完美的這種事情。在鏈接的控制器中，只需將主div替換爲包含單個用戶信息的主div即可。你應該考慮有兩個不同的飼料;一個用於用戶列表，另一個用於個人用戶。

來源

2016-02-12 15:55:52 4thex

我試過，但我是新來它不知道在這之後該怎麼做： VAR對myApp = angular.module（ '對myApp'，[]）; （'mainCtrl'，function（$ scope，$ http）{http：// http.get（'jsonpath'）。success（function（data）{ $ scope.user = data; console.log（user ） }）}） – Deepak

下面是一個例子，顯示我的意思：

<!doctype html> 
<html ng-app="app"> 
    <head> 
     <script src="//code.jquery.com/jquery-1.12.0.min.js"></script> 
     <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script> 
     <script src="js/app.js"></script> 
    </head> 
    <body> 
     <div ng-controller="UsersController"> 
      <div id="users"> 
       <div ng-repeat="user in users"> 
        <a href ng-click="go(user.id)">{{user.name}}</a> 
       </div> 
      </div> 
      <div id="user"> 
       <div>{{current.name}}</div> 
       <div>{{current.age}}</div> 
       <a href ng-click="back()">back</a> 
      </div> 
     </div> 
    </body> 
</html>

的JavaScript文件; app.js：

(function(){ 
    var app = angular.module("app", []); 
    users = [ 
     {"id": 1, "name": "Palle", "age": "48"}, 
     {"id": 2, "name": "Peter", "age": "11"} 
    ]; 
    app.controller("UsersController", ["$scope", "$http", function($scope, $http) { 
     $("#user").hide(); 
     $scope.users = users; 
     $scope.go = function(id) { 
      console.log(id); 
      $("#users").hide(); 
      $("#user").show(); 
      $scope.current = $scope.users.find(function(element) { 
       return element.id === id; 
      }); 
     }; 
     $scope.back = function() { 
      $("#user").hide(); 
      $("#users").show(); 
     }; 
    }]); 
}());

來源

2016-02-12 18:28:48 4thex

謝謝你ü救了我......只是最後一個問題，如果你不介意看看我的JSON它有嵌套數據對象，它有bst_users然後有用戶我們如何訪問這個深JSON鏈接 – Deepak

用json數據打開新頁面而不刷新頁面

回答

相關問題