Breaking News: Grepper is joining You.com. Read the official announcement!

cordys ajax example

Defiant Deer answered on December 5, 2022 Popularity 1/10 Helpfulness 1/10

answer cordys ajax example

cordys ajax example

Comment

<html>
    <head>
        <title>REST Sample</title>
        <meta content="width=device-width, initial-scale=1" name="viewport"/>
        <link href="/cordys/thirdparty/jquery/cordys.min.css"
            rel="stylesheet" type="text/css"/>
        <link
            href="/cordys/thirdparty/jquery/jquery.mobile.structure.min.css"
            rel="stylesheet" type="text/css"/>
        <style> .ui-input-text { vertical-align: middle; } </style>
    </head>
    <body>
        <div data-role="page" id="detailsPage">
            <div data-role="header" data-theme="b">
                <h1>GeoIP Locator</h1>
            </div>
            <div data-role="content" data-theme="c">
                <ul data-role="listview" id="detailView">
                    <li data-role="fieldcontain">
                        <div>
                            <div>
                                <label class="ui-input-text" for="ipAddress">IP address or Host Name</label>
                                <input id="ipAddress"
                                    placeholder="173.194.38.169 or google.com" type="text"/>
                                <a data-inline="true" data-role="button"
                                    href="#" id="showLocation">Show Location</a>
                            </div>
                        </div>
                    </li>
                    <li data-role="fieldcontain">
                        <div>
                            <div>
                                <label class="ui-input-text" for="map_canvas">GeoIP Locator</label>
                            </div>
                            <div>
                                <div id="map_canvas" style="width:100%; height:300px"/>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
        <script src="/cordys/thirdparty/jquery/jquery.js" type="text/javascript"/>
        <script src="/cordys/thirdparty/jquery/jquery.mobile.min.js" type="text/javascript"/>
        <script src="/cordys/html5/cordys.html5sdk.js" type="text/javascript"/>
        <script src="https://maps.google.com/maps/api/js?sensor=false" type="text/javascript"/>
        <script type="text/javascript"> $(function() { // Show the location on click of showLocation $("#showLocation").on("click", function() { var $address = $("#ipAddress").val(); if($address) { var url = "http://freegeoip.net/json/" + $address + '?callback=initializeMap'; $.cordys.ajax({ url: url, type: "GET", dataType: "jsonp" }); } }) }); function initializeMap(data) { var latitude = data.latitude, longitude = data.longitude; var latlng = new google.maps.LatLng(latitude, longitude); // some initial values to the map var myOptions = { zoom: 10, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; // the map is created with all the information var map = new google.maps.Map(document.getElementById("map_canvas"),myOptions); // an extra step is needed to add the mark pointing to the place selected. var marker = new google.maps.Marker({position:latlng,map:map,title:'title'}); } </script>
    </body>
</html>

Popularity 1/10 Helpfulness 1/10 Language javascript

Source: 43.242.214.197

Tags: ajax javascript

Link to this answer
Share Copy Link

Contributed on Dec 05 2022

Defiant Deer

0 Answers Avg Quality 2/10

cordys ajax example

Contents

More Related Answers

cordys ajax example

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.