How to use jquery or other javascript frame work in BIRT for client side scripting

Hi,

Is there any way of doing sorting or some other client side scripting using jquery or some other framework?
Any references or examples would of great help.

Find more posts tagged with

Comments

Mat

Hi RepBIRT, Did you get this working? I am also trying to do the same thing & was wondering if you or anyone else can help with some pointers. Thanks

kclark

mwilliams wrote up a good blog using jQuery to build a jVectorMap, take a look at <a data-ipb='nomediaparse' href='http://developer.actuate.com/community/forum/index.php?/blog/14/entry-496-using-external-javascript-libraries-with-birt-jquery-jvectormaps/'>this link</a> it should get you guys started with jQuery in BIRT. @RepBIRT what other frameworks were you thinking about using?

probs

Hi Clark,
 
I am trying to use jquery library as above example. But it is not working with the new ihub designer. Do i need to do anything else for IHUB.
Can you please help me out on this.
Thanks,
Prabal

spulapalli

What is the birt version you are using? Please provide me sample report if you have any

probs

Hi,
 
I am using Actuate Birt ihub 3.0.
I am not able to refer the Jquery library which is there in my resources.
So I am not able to create any working sample report.
 
please help me out on this.
 
Thanks,
Prabal

JFreeman

Are you wanting to use jQuery for the server side scripting within the report, eg in beforeFactory, or are you wanting to use it for client side scripting, such as within an HTML text element?

probs

Hi Jesse,
Sorry for the late reply. I was on a holiday for some time.
I want to use jquery for client side scripting within an HTML text element.
 
Can this be done?
 
Thanks,
Prabal

JFreeman

You will need to include the jquery js file from an application that is hosting it in the text box like you would on a standard web page.
For example, using the version hosted by Google:
<pre class="_prettyXprint _lang-js">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
</pre>

probs

Hi Jesse, 
 
I tried to include the jquery calender in a report but it is not working for me. 
I created a html file to include the jquery calender . Then i tried to create the same within a report. But i was not able to get it working. 
Please find the files attached. 
can you please help me on this. 
 
Thanks, 
Prabal

JFreeman

I had forgotten that within the newer iHub releases jQuery and jQuery UI are already bundled into the installation. Instead of working with them externally, you can use the bundled versions. I modified your code in the text element to use the internal jQuery UI call to get it working.
 
For example:
<pre class="_prettyXprint _lang-js">
Date: <input type="text" id="datepicker">

<script>
$(function() {
actuate.common.web.$("#datepicker").datepicker();
});
</script>
</pre>
I also had to modify the loading of the jQuery UI CSS file to use head.js in the clientInitalize of the client scripts for the report:
<pre class="_prettyXprint _lang-js">
head.js('http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/smoothness/jquery-ui.css');
</pre>
With both of these changes in place, the jQuery UI Date picker is working properly.
Take a look at the attached, modified version of your example report with these changes in place.

probs

Hi Jesse,
 
This is exactly what i needed to know.
Thank you very much for helping me on this.
 
Thanks
Prabal

JFreeman

You're welcome.
Let us know if you have additional questions.

SkyfireYogita

i am working on BIRT 4.6.0 , facing problem like same to use date filter with the use of HTML text element.
please help me out