Mobile Report JS Development Example-Get location

The last time I shared the Mobile Report JS development system concept, and then I went back to explore a number of cases. Previously contacted by the Finereport app client can be used to punch in the check-in, Curiosity studied the following, this time to talk about the report mobile development How to achieve the positioning function.

1. Solution Ideas

When you design a template with Finereport, add a button control, click the button, get the current location, and copy the location information to a cell, and finally the client to fill out the current template.

2. Example

To achieve the effect shown, click the Location button to get the current position and current time, and display it in the corresponding cell below:

650) this.width=650; "Src=" http://dl2.iteye.com/upload/attachment/0117/1911/ 02d47126-eb37-39d0-b923-39c8d6ca949a.png "style=" border:0px; "/>

2.1 Template Making

Open the designer, create a new template, design the template as shown in, where E2 is a button control, the control name is a geographic location, C5 is a drop-down box control, E5 is a Time control:

650) this.width=650; "Src=" http://dl2.iteye.com/upload/attachment/0117/1913/ 3e0adcb7-f8a7-321b-a8cb-49b8d9180302.png "style=" border:0px; "/>

2.2 Get Current Location

There are two ways to get the current location, one is to click the button to get a location, one is to open the template directly when the location is obtained, in the example, we want to achieve by clicking the button to obtain the geographical location.

Get a location by clicking the button

Open the control settings for the button and add a click event for the control, such as:

650) this.width=650; "Src=" http://dl2.iteye.com/upload/attachment/0117/1915/ D0a01efc-887e-36de-87ae-ab92997994e4.png "width=" 583 "height=" 423 "style=" border:0px; "/>

JS as follows:

Click ( here ) to collapse or open

2. 1. FR. Location (function(status, message){ //Get geo-location
   

4. 2. if (status=="Success") {
   

6. 3. //Location successful, message returns latitude and longitude value
   

8. 4. FR. MSG. Alert("current position is" + message);
   

10. 5. contentpane. Setcellvalue(2, 3, message);
    

12. 6. } else {
    

14. 7. //Location failed, message returned corresponding error message
    

16. 8. FR. MSG. Alert(message); //Location failed
    

18. 9. }
    

20. . });

Finereport gets the current position through the Fr.location method, or if the status value is success, it means that the location is successful or the location fails, and if the location is successful, the returned geo-location information is assigned to the C4 cell.

However, this method is only useful on the mobile side, if you click on the button event in the Web to obtain a geographic location, the direct prompt to locate failed.

Get the current location after loading ends

If you want to get to the current location after the template is loaded, simply add the above code to the post-load event, open the template, click Templates > Templates Web properties > Fill in the page settings, add a load end event such as:

650) this.width=650; "Src=" http://dl2.iteye.com/upload/attachment/0117/1917/ D525d9e2-cf3f-3ebc-a3d0-2d233ce201c2.png "width=" 565 "height=" 526 "style=" border:0px; "/>

2.3 Get current Time

The current check-in time in the template also needs to be assigned to the past, so you also need to get the current time in the button's click event, and assign the value to E4 cell, JS as follows:

var mydate = new Date (); 12. var mytime=mydate.getfullyear () + "-" +mydate.getmonth () +1+ "-" +mydate.getdate () + "" +mydate.gethours () + ":" + Mydate.getminutes () + ":" +mydate.getseconds (); Gets the current time of 13. Contentpane.setcellvalue (4, 3, mytime);

button click event All JS as follows:

2. . FR. Location (function(status, message){ //Get geo-location
   

4. A. if (status=="Success") {
   

6. . //Location successful, message returns latitude and longitude value
   

8. . FR. MSG. Alert("current position is" + message);
   

10. ContentPane . Setcellvalue(2, 3, message);
    

12. var mydate = new Date();
    

13. 20.var mytime=MyDate.getFullYear()+"-"+MyDate.GetMonth()+1+"-"+MyDate.getDate()+" "+MyDate.getHours()+":"+MyDate.getminutes()+":"+MyDate.getseconds();//Get current time
    

15. ContentPane . Setcellvalue(4, 3, mytime);
    

17. .
    

19. . } else {
    

21. A. //Location failed, message returned corresponding error message
    

23. . FR. MSG. Alert(message); //Location failed
    

25. . }
    

27. . });

2.4 Effect View

Add the template to the tree of nodes in your data decision system, and how to do this by looking at the Add template, where the template is previewed, such as:

According to the steps described in the Add Server section, log in to the system with the mobile side, access the template, click the Location button to get the current location and current time, such as: 650) this.width=650; "Src=" http://dl2.iteye.com/upload /attachment/0117/1921/a691be77-c78b-3239-be32-2627f93d2df0.png "style=" border:0px; "/>

However, the geographic location acquired by Finereport is longitude and latitude, and if you need to determine its exact location, you will need to convert it separately.

Mobile development is also ongoing learning, interested friends can join me to explore the study.

Mobile Report JS Development Example-Get location