i have created new blog project using angular-js. here have 1 page listing blogs , if click on edit button or delete button, want move next page , show data in form updated blog.
my blog list page: listblog.html
<!doctype html> <html lang="en"> <head> <title>my first angularjs blog</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script> <!-- bootstrap core css --> <link href="css/bootstrap.min.css" rel="stylesheet"> <!-- custom css --> <link href="css/blog-home.css" rel="stylesheet"> <!-- html5 shim , respond.js ie8 support of html5 elements , media queries --> <!-- warning: respond.js doesn't work if view page via file:// --> <!--[if lt ie 9]> <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script> <![endif]--> </head> <body ng-app="blogapp"> <!-- navigation --> <div ng-include="'includes/header.html'"> </div> <!-- page content --> <div class="container"> <div ng-controller="blogcontroller"> <h2>blog list</h2> <p>here awsome blog list</p> <table class="table"> <thead> <tr> <th>title</th> <th>blog</th> <th>posted on</th> <th>action</th> </tr> </thead> <tbody> <tr ng-repeat="blg in allblog"> <td>{{blg.title}}</td> <td>{{blg.description}}</td> <td>{{blg.created_on }}</td> <td><a href="">edit</a> || <a href="">delete</a></td> </tr> </tbody> </table> </div> </div> <hr> <!-- footer --> <div ng-include="'includes/footer.html'"> </div> <!-- /.container --> <!-- jquery --> <script src="js/jquery.js"></script> <!-- bootstrap core javascript --> <script src="js/bootstrap.min.js"></script> <script src="controller.js"></script> </body> </html> i want create controller edit. controller file: controller.js
var myapp = angular.module("blogapp", []); myapp.controller('blogcontroller',function ($scope,$http){ $http({method: 'get' , url: 'getallblog.php'}).success(function(data){ $scope.allblog = data; }); $scope.new_post =function(){ $http.post("addblog.php" ,{'title' : $scope.title ,'description' : $scope.description }).success(function(data,status,headers,config){ window.location='index.html'; console.log("inserted successfully"); }); } ; $scope.editpost = function(index){ $http.post('allscript.php?action=edit_post', { 'id' : index}) .success(function (data, status, headers, config){ }) .error(function (data, status, headers, config){ console.log(status); }); } }); and php script page operations performed allscript.php
<?php $user ="root"; $pass ="m2n1shlko"; $dbh = new pdo('mysql:host=localhost;dbname=blog_db', $user, $pass); switch($_get['action']){ case 'edit_post': edit_post(); break; function edit_post(){ $data = json_decode(file_get_contents("php://input")); $index = $data->id; $query = $dbh->prepare("select * blog_list id='$index'") ; $da = $query->execute(); $getre = $da->fetch(pdo::fetch_assoc); print_r(json_encode($getre)); return $getre; } } ?> i new in angular-js. don't know how id of record , take next page edit/update/delete.
any appreciated. thanks.
actually @jeremy thille right... please check angular ngroute module more info https://docs.angularjs.org/tutorial/step_07.
practice refactor of connections/post/get in factories/services, , inject them directly on controllers (where needs of them) http://viralpatel.net/blogs/angularjs-service-factory-tutorial/
good luck.
Comments
Post a Comment