<form id="search">
        <fieldset>
            <label for="area">First digits of postal code:</label>
            <input name="area" type="text" maxlength="4" placeholder="AB12" required />
            <input type="submit" value="Search" name="search" />
        </fieldset>
    </form>



    <script type="text/javascript" src="jquery/jquery.min.js"></script>
    <script type="text/javascript" src="cordova-2.3.0.js"></script>
    <script type="text/javascript" src="js/index.js"></script>
    <script type="text/javascript">
    $(function(){
        $('#search').submit(function(event){
        event.preventDefault(); // <-- prevent form submission
                $.ajax({
                    url: 'http://www.entertainmentcocktail.com/cp/index.php?area=AB12',
                    dataType: 'jsonp',
                    jsonp: 'jsoncallback',
                    timeout: 5000,
                    success: function(data, status){
                        $.each(data, function(i,item){
                            var place = '<h1>'+item.location+'</h1>'
                            + '<p>'+item.id+'</br>';

                            output.append(place);
                        });
                    },
                    error: function(){
                        output.text('There was an error loading the data.');
                    }
                });
            });
    });

            </script>

            <div id="place">
            <h3>Places near your location</h3>
            </div>