JQuery and Netflix ODATA (mapping)

JQuery version

by shelbyz

HTML

<script src="https://github.com/downloads/SteveSanderson/knockout/knockout-2.1.0rc.js"></script>
<script src="https://raw.github.com/SteveSanderson/knockout.mapping/master/build/output/knockout.mapping-latest.js"></script>
<body> 
    <h2>Search Netflix for Movies</h2> 
    
    <input id="searchString" />
    <button id="searchClick">Search</button>
    <br/><br/>
    <textarea id="searchQuery" cols="75" rows="6"></textarea>
    <br/><br/>
    <b>Movies found <label id="movieCount"/></b>
    <br/><br/>
    
    <table>
        <thead>
            <tr>
                <th>Name</th>
                <th>Release Year</th>
                <th>Runtime</th>
            </tr>
        </thead>
        <tbody data-bind="foreach: movie">
            <tr>
                <td data-bind="text: Name" />
                <td data-bind="text: ReleaseYear" />
                <td data-bind="text: Runtime" />
            </tr>
        </tbody>
    </table>
</body>

CSS

table th { text-align:left; padding-right: 3em; font-style:italic }body { font-family: Helvetica, Arial }
input:not([type]), input[type=text], input[type=password], select { background-color: #FFFFCC; border: 1px solid gray; padding: 2px; }

JavaScript

//debugger;
    
callback = function(result) {
    var movies = result["d"]["results"];

    if (movies === null || movies === 0) {
        alert("no movie results, try again");
    }
    else {
        $("#movieCount").text(movies.length);
        //_self.movieCount(movies.length);
        //_self.movie(ko.mapping.fromJS(movies));
    }
};
    
$("#searchClick").click(function() {
    $("#searchQuery").text("http://odata.netflix.com/v2/Catalog/Titles?$select=Name,Runtime,ReleaseYear&$filter=substringof('" + $("#searchString").val() + "',Name)&$orderby=Name&$callback=?&$format=json");
    
    $.ajax({
        dataType: "jsonp",
        url: $("#searchQuery").text(),
        success: callback,
        error: function(XHR, textStatus, errorThrown) {
            alert(textStatus + ":" + errorThrown);
        }
    });
});