简体   繁体   中英

Get variable from JS

I have following code in <head> which has variables ( emp.longitude and emp.longitude ) which I need to get:

<script type="text/javascript">          
        $(document).ready(function () {  
            $.ajax({  
                async: false,
                url: 'GetRecords.asmx/GetValues',  
                dataType: "json",  
                method: 'post',  
                success: function (data) {  
                    var employeeTable = $('#tblEmployee tbody');                     
                    employeeTable.empty();  
                    $(data).each(function (index, emp) {                        
                        employeeTable.append('</td><td>'
                            + emp.latitude + '</td><td>' + emp.longitude + '</td><td>');                        
                    });  
                },  
                error: function (err) {  
                    alert(err +" fail");  
                }  
            });  
        });  
    </script>

In a <body> a have another script where I need to use those variables:

<script>        
    var mymap = L.map('mapid').setView([38.8, -94.8], 5);
    // need to use them below (longitude and latitude)
    L.marker([longitude,latitude], { icon: truckIcon }).addTo(mymap).bindPopup("I am here!");

    var popup = L.popup();
    function onMapClick(e) {
      popup
         .setLatLng(e.latlng)
          .setContent("You clicked the map at " + e.latlng.toString())
          .openOn(mymap);
     }

    mymap.on('click', onMapClick);
    </script>

I already have a table which outputs those values in a <body>

<form id="form1" runat="server">  
        <div class="container">  
            <h3 class="text-uppercase text-center">How to retrive data using ajax in asp.net</h3>  
            <table id="tblEmployee" class="table table-bordered">  
                <thead class="bg-primary text-white">  
                    <tr>                            
                        <th>latitude</th>  
                        <th>longitude</th>                         
                    </tr>  
                </thead>  
                <tbody></tbody>  
            </table>  
        </div>  
    </form>

Any ideas how can I get those variables from function in a head and use them in another script in a body. Thanks.

You just have to put them somewhere accessible by both code parts.

The higher scope is the global scope. if you just put 2 vars above $(document).ready(function () they will be accessible in the later part of the code. Yet this is frowned upon. It's never a good practice to pollute the global scope due to possible interference in other js codes that may be run.

The proper way is to find a convenient object that can be accessed by both parts. The most obvious answer is document object.

just do

document.latitute = emp.latitude;
document.longitude = emp.longitude;

or even better

document.myProject = { lat: emp.latitude, lon: emp.longitude}; 

in the success part of your code and that vars will be accessable in the later part. You can also use any DOM's node to store and access the variables.

Assign the values to var and they will be hoisted.

var latitude = 0;
var longitude = 0;

later in your fetch,

latitude = emp.latitude;
longitude = emp.longtitude;

If you do not you have to do as the comments say and create a special function to get the values. You can use hoisting here, and as long as you are not doing this "a lot" you'll be fine, regardless of the polluting the namespace.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM