Level Extreme platform
Subscription
Corporate profile
Products & Services
Support
Legal
Français
VPF Interface with a Calendar
Message
From
15/08/2011 00:27:07
Victor Chignes
Inteliventas
Peru
 
 
To
14/08/2011 09:52:41
Mike Sue-Ping
Cambridge, Ontario, Canada
General information
Forum:
Visual FoxPro
Category:
Coding, syntax & commands
Miscellaneous
Thread ID:
01478722
Message ID:
01520991
Views:
114
I have found the first approach better, for debugging and testing. Also, I can have the HTML and js files apart from the VFP program.
>The difference there is that Rick is calling the existing javascript functions that are on the page directly from VFP code, i.e. he's making a direct reference to it by name. I'm taking a slightly different approach and I'm passing the script code (source) to the execScript call.
>
>>I'm following advice from Rick Strahl in this article:
>>http://csharpfeeds.com/post/99103/Calling_JavaScript_functions_in_the_Web_Browser_Control.aspx
>>"
>>Function Names and Return Object Properties need to be lower case
>>After a bunch of experimenting and by accident creating a real simple function that had an all lower case name, I figure out that this is a bug/feature of the way FoxPro does COM interop with COM objects. Specifically it deals with casing and the fact that Visual FoxPro forces all COM functions called to lower case. Since JavaScript is case sensitive, the correct case is required in order for a function to be executed. This means effectively that FoxPro can only call lower case Javascript functions. The other issue is that you HAVE TO pass at least one parameter to the called JavaScript function even if that function does not take a parameter. Again this is an oddity in how VFP translates the COM interfaces to to call this dynamic function and passes it one parameter. This shouldn’t be a problem as you can just ignore the parameter in the JavaScript function.
>>"
>>>Really? I don't think that I've ever paid attention to those points and everything that I've done to date works. For example, the code below calls a fullCalendar function and does not seem to cause any troubles.
>>>
>>>Mike
>>>
>>>>Just remember, if you call javascript from VFP the function names should be all in lowercase and should take at least one parameter
>>>>>>>>I have a database with an events field and dates field.
>>>>>>>>I would like to interface this table with a "nice looking" calendar to populate those dates on the calendar with the events.
>>>>>>>>
>>>>>>>>I guess a web-base Calendar would be better, siince then I won't have to install additional app or ActiveX on the customer's machine. But that would be OK, if the ActiveX Calendar interface is superior.
>>>>>>>>
>>>>>>>>Suggestions would be very much appreciated.
>>>>>>>>(sample code would be nice too).
>>>>>>>>
>>>>>>>>Thanks
>>>>>>>
>>>>>>>What do you mean by "web-based calendar"???
>>>>>>>
>>>>>>>Here's a link to Craig Boyd's VFP calendar, http://www.sweetpotatosoftware.com/SPSBlog/PermaLink,guid,878c1b11-1770-405c-92ea-cdbe2c838dfa.aspx Not sure if it will suit your need though.
>>>>>>>
>>>>>>>I like the following jQuery plugin http://arshaw.com/fullcalendar/. Of course you'll need to use it in a browser control hosted in a VFP form to get it to work ;)
>>>>>>>
>>>>>>>Mike
>>>>>>
>>>>>>Mike,
>>>>>>
>>>>>>This looks great, but how exactly do you hook it up to open VFP forms when you click?
>>>>>>
>>>>>>E.g. if you have some sample app that uses this control and can share, it will be great.
>>>>>>
>>>>>>Thanks in advance.
>>>>>
>>>>>Well it was a bit of a trial and error process for me and unfortunately the application is so big that I can't give you any "simple" example from it. In essence, what you need to do is display the calendar using jQuery syntax. During that setup, you'd be hooking up click events to the days and events (if any exist). So, something like:
>>>>>
>>>>>	m.lcScript = ;
>>>>>	[$('#EventCal').fullCalendar({] + ;
>>>>>		[header: {left: ' ', center: 'title', right: 'month,agendaWeek,agendaDay'}] + ;
>>>>>		[,year:] + TRANSFORM(tiYear, "9999") + ;
>>>>>		[,month:] + TRANSFORM(tiMonth-1, "99") + ;
>>>>>		[,date:] + TRANSFORM(tiDay, "99") + ;
>>>>>		[,firstHour:9] + ;
>>>>>		[,defaultView: 'agendaDay' ,editable: true] + ;
>>>>>		",events: [" + this.GetEvents(tiMonth, tiYear) + "]" + ;
>>>>>		[,dayClick: function(date, allDay, jsEvent, view) {] + ;
>>>>>			[document.location='VFPS://GETEVENTS/<action>New</action>] + ;
>>>>>			[<sdate>{^' + date.getYear().toString() + '-' + date.getMonth().toString() + '-' + date.getDate().toString() + '}</sdate>] + ;
>>>>>			[<stime>' + date.toTimeString() + '</stime>'}] + ;
>>>>>		[,eventClick: function(event, jsEvent, view) {] + ;
>>>>>			[document.location='VFPS://GETEVENTS/<action>Edit</action><id>' + event.MyID.toString() + '</id>'}] + ;
>>>>>		[,eventDrop: function(event, dayDelta, minuteDelta, allDay, revertFunc, jsEvent, ui, view)] + ;
>>>>>			[{document.location='VFPS://GETEVENTS/<action>Move</action><id>' + event.MyID.toString() + '</id>] + ;
>>>>>			[<sdate>{^' + event.start.getYear().toString() + '-' + event.start.getMonth().toString() + '-' + event.start.getDate().toString() + '}</sdate>] + ;
>>>>>			[<stime>' + event.start.toTimeString() + '</stime>] + ;
>>>>>			[<edate>{^' + event.end.getYear().toString() + '-' + event.end.getMonth().toString() + '-' + event.end.getDate().toString() + '}</edate>] + ;
>>>>>			[<etime>' + event.end.toTimeString() + '</etime>] + ;
>>>>>			[<allday>' + event.allDay.toString() + '</allday>'] + ;
>>>>>			[}] + ;
>>>>>		[,eventResize: function( event, dayDelta, minuteDelta, revertFunc, jsEvent, ui, view ) {] + ;
>>>>>			[document.location='VFPS://GETEVENTS/<action>Move</action><id>' + event.MyID.toString() + '</id><sdate>{^' + ] + ;
>>>>>			[event.start.getYear().toString() + '-' + ] + ;
>>>>>			[event.start.getMonth().toString() + '-' + event.start.getDate().toString() + '}</sdate><stime>' + event.start.toTimeString() + ] + ;
>>>>>			['</stime><edate>{^' + event.end.getYear().toString() + '-' + event.end.getMonth().toString() + '-' + event.end.getDate().toString() + ] + ;
>>>>>			['}</edate><etime>' + event.end.toTimeString() + '</etime>'] + ;
>>>>>			[}] + ;
>>>>>		[});]
>>>>>ENDIF 
>>>>>
>>>>>THIS.Runjavascript( m.lcScript )
>>>>>
>>>>>
>>>>>It looks scary (and it was for me at the start), however, once you know how it works, it isn't so bad. I think that you may know what the "VFPS://..." part is all about if you've used the web browser control before. In the browser control's navigate2 method, I've got a check for "GETEVENTS" that takes the event information (id, start/end time, start/end date, etc.) that is passed as part of the URL and corresponding action (edit, move, new).
>>>>>
>>>>>"This" in the code refers to a non-visual VFP class and Runjavascript is just a custom method of it to execute, well, some javascript and looks like:
>>>>>
>>>>>LPARAMETERS tcJavaScript
>>>>>
>>>>>* In an attempt to make this code as fast as possible,
>>>>>* there is no error checking here so make sure that you pass a string!!!!
>>>>>IF !EMPTY(tcJavaScript)
>>>>>	this.oWB.document.parentwindow.execScript(tcJavaScript, 'javascript')
>>>>>ENDIF 
>>>>>
>>>>>
>>>>>I'll see if I can get you a stripped down example that can actually run.
>>>>>
>>>>>Mike
Previous
Next
Reply
Map
View

Click here to load this message in the networking platform