javascript - JQuery - Get a error mesage if there is no value -
so have completed website wanted , i'm @ last point error message if movie isn't found. means have api returns json. if person writes invalid movie "ifeahaef" returns null , wonder if possible make in jquery error "no movies found!" right under search bar? right site looks
and how want it
i don't know if code necessary can post js in case, maybe easier see.
function callajax(input) { var url = "http://localhost:1337/search/" + input; $.ajax({ type:'get', url: url, success: function(data) { console.log('success'); $('#title').html("title: " + data.title); $('#release').html("release: " + data.release); $('#vote').html("vote: " + data.vote); $('#overview').html("overview: " + data.overview); $('#poster').html('<img src="' + data.poster + '" width=250 height=450 />'); $('#trailer').html("trailer: <iframe width='420' height='315' src='https://www.youtube.com/embed/" + data.trailer + "' frameborder='0' allowfullscreen>"); }, error: function(request, status, err) { console.log('error'); } }); } $(document).ready(function(){ $('#submitbutton').on('click', function(e){ e.preventdefault(); var input = $('#s').val(); callajax(input); }); }); html:
<!doctype html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>movietrailerbase</title> <link rel="stylesheet" type="text/css" href="styles.css" /> </head> <body> <div id="page"> <h1>the movietrailer search</h1> <form id="searchform" method="post"> <fieldset> <input id="s" type="text" /> <input type="submit" value="submit" id="submitbutton" /> <div id="searchincontainer"> <input type="radio" name="check" value="site" id="searchsite" checked /> <label for="searchsite" id="sitenamelabel">search movie</label> <input type="radio" name="check" value="web" id="searchweb" /> <label for="searchweb">search series</label> </div> </fieldset> </form> <aside> <div id="title"></div> <div id="release"></div> <div id="vote"></div> <div id="overview"></div> <br> <div id="trailer"></div> </aside> <div id="poster"></div> </div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script src="script.js"></script> </html>
as simple understanding, if api throwing error, considered success. can handle case like
function(response){ if(response){ // stuff $("#lblerror").addclass("hide"); // hide label if movie found } else{ $("#lblerror").text("no movie found"); $("#lblerror").removeclass("hide"); // show label if no movie found } } a simple way add error label in html
<label class="error hide" id="lblerror"></label> 
Comments
Post a Comment