A responsive, AngularJS "movie picker"

This is an interface for letting the user select a specific movie, based upon an arbitrary title. The save button simply dumps the selection to the console.

HTML

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<script src="http://code.jquery.com/jquery-2.1.3.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<!-- 
Joe Steinbring 
http://steinbring.net 
-->
<body ng-app="MyApp">
    <div ng-controller="MainController" class="container-fluid">
        <div class="col-md-12">
            <input type="text" class="form-control" placeholder="Search for a movie" ng-model="movie" ng-change="refreshMovies(movie);">
        </div>
        <div class="col-md-12 MovieInfo" ng-if="movies !== undefined">
            <!-- Poster -->
            <div class="col-sm-5 MoviePoster">
                <img ng-src="{{movies.Poster}}" height="50%">
            </div>
            <!-- The Info -->
            <div class="col-sm-7">
                <div class="col-xs-2 TableHeader">Title</div>
                <div class="col-xs-10">{{movies.Title}}</div>
                <div class="col-xs-2 TableHeader">Genre</div>
                <div class="col-xs-10">{{movies.Genre}}</div>
                <div class="col-xs-2 TableHeader">Rated</div>
                <div class="col-xs-10">{{movies.Rated}}</div>
                <div class="col-xs-2 TableHeader">Year</div>
                <div class="col-xs-10">{{movies.Year}}</div>
                <div class="col-xs-2 TableHeader">Actors</div>
                <div class="col-xs-10">{{movies.Actors}}</div>
                <div class="col-xs-12 ButtonBox">
                    <button class="btn btn-default" ng-click="submitMovie();">Save</button>
                </div>
            </div>
        </div>
    </div>
</body>

CSS

.TableHeader {
    font-weight: bold;
}
.MoviePoster img {
    width: 150px;
}
.MoviePoster {
    text-align: center;
}
.MovieInfo, .ButtonBox {
    padding-top: 10px;
    padding-bottom: 10px;
}
.ButtonBox {
    text-align: center;
}

JavaScript

angular.module('MyApp', [])

    .controller('MainController', function ($scope, $rootScope, $http) {

    $scope.refreshMovies = function (movie) {
        var params = {
            t: movie
        };
        return $http.get(
            'http://imdbapi.com/', {
            params: params
        }).then(function (response) {
            $scope.movies = response.data;
        });
    };
    $scope.submitMovie = function () {
        console.table($scope.movies);
    };
});