Ever since I read Rich Manalang's post Adding Live Search to PeopleSoft Enterprise, I have been trying to figure out how to apply AJAX to PeopleSoft components. I have been able to benefit from AJAX in PeopleSoft by sending parameters to IScripts and displaying the results on a page. However, I have not been able to figure out how to update a component's data buffer using AJAX.
I think most of us would agree that the full page refresh required for a FieldChange event is too expensive. Yes, we do have deferred processing available. However, deferred processing can be just as user un-friendly as the page "flicker" of a post-back. AJAX frameworks provide the infrastructure required to post data to the server without requiring a full page refresh. Furthermore, AJAX frameworks can update a portion of a page with the results of a server operation. But how can we leverage the power of AJAX to update the component data model in PeopleSoft?
It seems the answer to this question is in the post. To update the component's data model, you would need to post the form values. Since the web server will return the full page content, you will next need to parse the returned page and update your page accordingly. Is it worth it? Anyone have any better ideas?
42 comments:
Hi Jim,
Just stumbled across your blog as I am researching some stuff like AJAX and Monkeygrease. Have you tried implementing/testing out Rich's Live Search? I am trying to get it to work in my environment (FIN 8.8, 8.46 tools) but it doesn't seem to work. Just curious if you gave it a shot.
Thanks!
Derek
Derek,
No, I haven't tested Rich's live search because our organization isn't using the PeopleSoft search capabilities. Have you been able to determine if the problem is related to the IScript, the JavaScript, or the Monkeygrease rules? If you need an example of using Monkeygrease, then you can look at http://jjmpsj.blogspot.com/2006/09/where-am-i.html. If you are getting an error message, then you can send the details to jim.marion@gmail.com and I'll do my best to see if I can find the problem. You can also ask your question on the Monkeygrease Google Group.
If you suspect the IScript, then you may want to add some debug statements to your PeopleCode so you can check for error conditions, print variable values, etc. You can take a look at http://jjmpsj.blogspot.com/2006/09/logging-peoplecode_15.html for an example of debugging PeopleCode without a User Interface.
Did you see Rich's presentation at Oracle OpenWorld last month? I'm planning to implement the Ajax suggests style prompts. I'll be sure to post details on my blog after I implement it.
Thanks for the response Jim!
I tried troubleshooting in FireFox using FireBug and was getting an error in the live-search.js file.
I'll post it out on the Google Group.
I did go to Rich's session at OOW and enjoyed it a lot. I had been looking forward to it for a while. I would really like to look into implementing the example he showed with the lookup/prompts. That would be really helpful.
Thanks again for the reply.
Derek
Derek,
Can you post the error you are getting (line number, etc)? I would like to see it. Maybe I can help solve the problem.
Thanks,
Jim
Hi Jim,
I actually resolved my issue and have the live search working. Rich gave me a couple of pointers that you can find on the Google Group. Basically my issues was that the live-search.js code wasn't resolving the URL to the iScript correctly.
Jim,
I agree with you - Ajax would really be beneficial to PeopleSoft if there is a way to make it useful for PeopleSoft components.
Yes, perhaps by using XHR or a hidden iframe, we could submit the current page data silently. However, the response we'll receive from the application server will still be the full peoplesoft page. This doesn't give us an advantage at all. In fact, this just adds an overhead for parsing and processing the response to update the page.
I think this needs to be supported on the PeopleTools level. There should be a mechanism to tell the component processor that we're sending partial data only and it should be be able to respond with only portion(s) of the page that are updated.
This need not be too elaborate. For example, when a field is changed, ajax could tell the component the page field name and the new value. The component in turn could respond with a list of div id's and the corresponding updated HTML snippets. JavaScript could then update the innerHTML of these divs with the updated HTML. Simplicity is key, innerHTML may not be a W3C standard, but it is widely supported by modern browsers; it frees us from worrying what type of elements were updated.
It will be supported, eventually. At the time of 8.4x, partial-page refresh (as we called it) was not cross-browser compatible. AJAX did not exist, and therefore in favor of browser compatibility and the same UE over browsers, full page refresh was maintained. But the conversations happened, and I'm sure Fusion will implement some form of partial-page refresh considering AJAX is now a standard.
Hi Jim,
I want to implement simple Peoplesoft - AJAX functionality.I want to have a page with an image on it.Whenever I do mouseover on that image show some message using HOVER [i.e a small window] to the user.
Can you guide me on how to move ahead?
Thanks in Advance.
@Atul, steps:
* Add your image to your database using app designer.
* Add an HTML Area to your page and set its source to a derived/work field.
* Create an HTML definition that contains the HTML and JavaScript required to show your image and menu. Use %Bind(:n) for your image's URL.
* Add RowInit or PageActivate PeopleCode to your component/page to populate the HTML Area by setting the value of your derived/work field. Use GetHTMLText to get the HTML and %Response.GetImageURL to get the URL for your image.
* If your menu options are static, then hard code them into your HTML.
If any of your HTML is static, enter it into the HTML definition. If some of it comes from the database and is static throughout the duration of the page, then load it in your PeopleCode event and concatenate your HTML or use %Bind(:n) in your HTML Definition. If your HTML contains components that must be loaded from the database based on other options chosen by the user, then you can use Ajax to retrieve data from your database prior to displaying your menu. To use Ajax, I suggest you find a good JavaScript library like jQuery. If you need an Ajax approach, then you will also need to create an IScript to serve data to your page.
If you don't have a JavaScript menu script, take a look at the jQuery menu plugins.
Adding DHTML to a PeopleSoft page is pretty simple. Hopefully these steps provide you with the foundation to create your own usability enhancements.
Hi All,
I would like to add Tool Tip feature to the PeopleSoft pages.
Means I would like to show the purpose of the each field on the page. As part of this initiative I tried the following steps
1. Modified PS page by adding to HTML area.
2. Wrote the peopleCode on the Page Activate using GetHTMLText
3. Wrote the following JavaScript on the HTML object
script language='javascript'
function Testing()
{
alert("I am here");
}
window.onload = Testing;
/script
when I tried to open the page it showed the alert, but the page status still showing blinking Processing message continuosly.
Please help to complete this initial step.
Thanks in advance
Hi Jim,
I have a requirement, Can we call 2 webservices as parllel in peoplesoft. If Yes, Can you provide the details how to do it?
If you post some sample code, it it will be helpful for me.
Thanks,
Shiva.
@shivakumar, can you post a use case? Integration Broker is asynchronous, meaning it can execute in parallel. Do you want synchronous, but parallel? Are you also asking about client side Ajax or web services?
Hi Jim,
Presently we have a synchronous message for which we want to split that message call into 2 messages and we want to execute those messages as parallel(independent).
I dont know We can make that with peoplecode.
If we can do with peoplecode please mention how to do it. Or else how to make that with Ajax.
Thanks,
Shiva.
Hi Jim
Please help me in adding tooltip to fields on peoplesoft pages
kvr
@kvr, PeopleSoft automatically uses the label text to create a tool tip. If you want something more elaborate, then take a look at the jQuery Plugins list.
@shivakumar, "synchronous message... execute those messages as parallel..." Yes, you can do this in PeopleCode. Take a look at IntBroker.SyncRequest.
Hi Jim,
i tried to implement AJAX in Peoplesoft by following the steps mentioned on ur blog.
But it did not work. Actually i want to develop mousemove over functionality.
The hover text will be dynamic.
i also need to develop a functionality wherein a particular key would be disabled for
editbox.
Thanks in advance for your help and guidance.
script language='javascript'
function Testing()
{
alert("I am here");
}
window.onload = Testing;
/script
when I tried to open the page it showed the alert, but the page status still showing blinking Processing message continuosly.
Please help to complete this initial step.
Thanks in advance
@Hemant, rather than setting window.onload, which may overwrite any PeopleTools page load handler, use the addEvent/attachEvent technique. Chris Heller wrote about using this with PeopleSoft in his post Enhancing the Usability of PeopleSoft Applications. Rather than use Chris's addEvent routine, I prefer to use jQuery to attach event handlers because it allows me to do it with one line of code. To add an onload handler with jQuery, you just write $(document).ready(function() {...}); If you are just trying to see custom JavaScript execute, then you don't need to wait for the entire document to load.
Unfortunately, there isn't a lot of "HOWTO" information out there on PeopleSoft and Ajax. I'm hoping to change this by writing a couple hundred pages about PeopleTools, JavaScript, and Ajax in my new book PeopleSoft PeopleTools Tips & Techniques
thanks again for your response jim.
it really would be great if u can send some sample code with an example which i can try out. Earlier i even tried to use other event handlers without much success.
Really appreciate ur help & guidance.
@Hemant, I show how to do something very similar in chapter 6 of my PeopleSoft PeopleTools Tips and Techniques book. Unfortunately, I'm not finished writing and it isn't scheduled to hit the shelves until July, 2010. While you wait, take a look at http://campus-codemonkeys.blogspot.com/search?q=jquery.
Can we update asynchronous inbound response to component buffer ?
@Raj, Asynchronous implies a callback mechanism. You can send a message from a component, but there is no callback into the component from subscription PeopleCode. Using Ajax, you can make asynchronous calls to integration broker and process the response, but it won't directly update the component buffer. On response, you can update values on the page.
Hi Jim,
We want to display the peoplesoft pages in one of the Website via Iframe. The problem is whenever we try to open the webpage, the peoplesoft page inside the iframe displays correctly but none of the link on the iframe works.
Could you please suggest
@Unknown, are you using the PSP or the PSC URL? Are you saying the transactions don't work when in an iframe? Are you using Firefox or IE? If firefox, then download firebug and open the console before trying a link. I suspect that the PeopleSoft pages are trying to call the checkAnyFrameChanged, etc save functions before following a link. This can either throw an undefined or a cross domain error.
Hi Jim,
I also have the same problem with peoplesoft page transaction does not work in iframe.
I use PSC URL and it does not work only in Firefox.
The issue that I was getting is permission denied to get property Window.document and it was referring to PS_ISCROSSDOMAIN_1.js.
Any clue or lead how to solve this problem is very appreciated.
Thanks in advance :)
Hi Jim,
I also have the same problem with peoplesoft page transaction does not work in iframe.
I use PSC URL and it does not work only in Firefox.
The issue that I was getting is permission denied to get property Window.document and it was referring to PS_ISCROSSDOMAIN_1.js.
Any clue or lead how to solve this problem is very appreciated.
Thanks in advance :)
@Eliando, @Unknown,
There is another possible cause for this. I haven't tested your exact scenario, but I have another scenario involving PT_ISCROSSDOMAIN. PT_ISCROSSDOMAIN was written for IE. PT_ISCROSSDOMAIN_NS6 was written for Mozilla. It appears that the panel processor inserts PT_ISCROSSDOMAIN into IE, but both into mozilla browsers. The result is that the IE version often gets processed last, resulting in IE code trying to run on mozilla based browsers. I put in a bug for this when I discovered it. I am not sure the current status. My work-around was to modify PT_ISCROSSDOMAIN to merge both the NS6 and the IE versions into the same file. I don't recommend customers try this, but you have to do what you have to do, and I'll leave that decision up to you.
I suggest you open a case with support. I suspect there is a patch available for this issue. I didn't find anything in support.oracle.com, but a support technician should be able to point you in the right direction.
Hi Jim,
I need to work on a solution, where a chart for seating arrangement of students in a classroom, has to be done for Campus Solutions Project. Can you please suggest me as to how should I progress in this.
links as to how the seating chart should look
1).http://www.asyluminc.com/mb_manual/MK-seat.htm
2).http://www.thecanadianteacher.com/tools2/seating%20plan/seatingplan.html
Thanks,
Poornima
@Poornima, I do not have much to offer you. It should be relatively painless. Will you allow instructors/administrators to configure the seating arrangement online? I would probably use jquery-ui sortables in a grid with a list of students on either the right or left, and then allow the instructor/administrator to drop the students from the list onto the grid. I would use Ajax and an iScript for persistence.
Hi Jim,
We have an issue with out page on the same line. We are displaying a HTML link using iframe in a HTML area which is located in the peoplesoft page. The HTML area is getting refreshed on all the fieldchage i do in the peoplesoft page. Is there a way to avoid this. Basically once i load the HTML page into the PS page, It should get refreshed.
Thanks,
Arul.
@Arul, the behavior you are seeing is unfortunate, but accurate. That is the way it works. If you look at the HTTP response for each Ajax request, you will see that all field values are included in the response -- even fields that didn't change. This is how PeopleTools is able to update related display fields and other fields based on FieldChange PeopleCode, etc.
If your page HTML Area is static rather than bound to a derived/work record, then I don't know if it will update on every event. If you can make it static, then try that. If the data has to come from the database and be related to the current transaction, then can it come from outside the component buffer? For example, could you use Ajax and an iScript to load it in from a static HTML Area? Test the static HTML area first, though just to make sure it doesn't reload. This isn't the best solution, but it might be a solution.
Jim,
I am trying to post XML data on an external site and that site would send a response back in form of XML.
How do I do it. I can post the XML using Iscript & AJAX, Not sure how to get the XML response back. Any help is appreciated.
Thanks
Manish
@Manish, there are a couple of ways. If this is all client side, then yes, you can use Ajax, but then I would think there would be cross domain problems. The "recommended" approach is to use Integration Broker. You can use %IntBroker.ConnectorRequestURL if you don't want to create all the service operation metadata.
As I will be posting XML(to third party) and will get a XML response(from third party). I don't think ConnectorRequestURL will work. As far as Integration Broker goes. Do you have any pointers or some documentation where it is explained ?
@Manish, is this synchronous or asynchronous? If it is Synchronous, then ConnectorRequestURL or standard service operation metadata will allow you to send a request and read the response. If it is asynchronous, however, then the 3rd party is actually calling a PeopleSoft web service to send you a response. That is different. Asynchronous requires metadata for the inbound service operation as well as potential network configurations to allow the 3rd party to connect to PeopleSoft (if outside the network).
Thank you for your response Jim. This is a synchronous post.
I want to post the following XML string
Manish
Satija
on to http://saltlake.testing.com:8080/spf/register (this is non Peoplesoft system)
and the response that I get by Posting(used SOAPUI to get the response) is
saltlake.testing.com
/spf/validate-token/df3f2739e33e3b3e6d37a43ebf9d088b
8080
true
df3f2739e33e3b3e6d37a43ebf9d088b
How do I post this XML using ConnectorRequestURL function? Please advice .
@Manish, I missed the requirement for POST instead of GET. In this case, you would define a synchronous Service Operation with request and response message definitions. You can use the Documents module to model your data shape or use IB_GENERIC if you just want raw XML without regard for structure. Then you can populate the outbound request message and read the synchronous inbound response.
Hi Jim,
I have a requirement to capture page load time of peoplesoft pages. So, I use a html area on a page and Javascript with some functions to calculate the page load time. The javascript depends on OnLoad event of a page so as to invoke the javascript functions. But when you sign in for the first time, OnLoad event gets fired and javascript function works. When you traverse to other peoplesoft pages and navigate back to original page, the OnLoad event does not get fired. I think this may be due to Partial refresh methodology which peoplesoft uses. Is there any alternative to achieve this or force OnLoad event on a page?
Thanks
Ramky
@Ramky, monkey patch net2.ContentLoader to implement you custom logging. Just be sure to pass everything through to the delivered net2.ContentLoader.
Hi Jim,
I am trying to get the response values from a third party url using AJAX. The return value will the status of 0 for success and 1 for failure. Based on the code, i need to redirect to another PS page.
Steps followed.
1. Created a HTML Area
2. Created a HTML object and wrote the code as below.However, I am unable to get the url.
3. And in the page activate, wrote code to assign the value of html object to HTML area using a field.
html
script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"
$(document).ready(function(){
$.ajax({
url : "thirdpartyurl will be passed here",
type: "POST",
data :"the query string for the url",
success:function(response){
alert(response);
},
error:function(e){
alert(e);
}
});//ajax end
});//function end
script
html
Please provide your advise how to proceed further. Is it the right approach to follow?
@Giridharan,
If your code were in an iScript instead of an HTML Area and you were on 8.5+ PeopleTools, then I would say your code looks reasonable. I would put some console.log statements in there to see what parts are or are NOT executing. Since you have an HTML Area, however, I'm suspecting this code is in a PeopleSoft page. In that case, the $(document).ready may be a problem, since the JavaScript itself is ajax'd into 8.5+ pages, it may never execute. Try putting some console.log statements in your script to see if you can see what is and isn't executing.
Another problem could be CORS and cross site scripting. If your target doesn't support CORS, then your browser will block the cross domain Ajax request.
Post a Comment