Why are js files in my rails asset pipeline not being compiled? - javascript

I am experiencing a problem similar to this question:
Rails asset pipeline not including required files in application.js manifest However, that question was closed, so I am re-asking it, but with the specifics of my situation.)
Environment:
Ruby 2.0.0, Rails 3.2.8, OSX 10.7.5, Chrome 28.0.1500.95
The main problem I am experiencing
Files placed in "/app/assets/javascripts" do not appear to be compiling to or appearing in "/public/assets"
An Example
If I place a file such as this test.js file in app/assets/javascripts:
alert("Hello!");
and then reload a page in my app, this alert should appear. (I am replicating what Ryan Bates does in his Railscast on the Asset Pipeline at ~6:30 into the video) However, no alert appears.
Debugging attempts
Some tests I did to try to debug this.
(As recommended by #Aidan below) If I "rm -rf public/assets", then
add "javascript_include_tag 'test'" to my layout, the alert does
appear. However, maybe because I'm a n00b, I don't know how that
helps me debug the problem.
If I add //= require_test to app/javascripts/application.js to my
manifest file, this does not result in the alert appearing.
My manifest file (app/javascripts/application.js)
// This is a manifest file that'll be compiled into application.js, which will include all the files
// listed below.
//
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
// or vendor/assets/javascripts of plugins, if any, can be referenced here using a relative path.
//
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// the compiled file.
// removed /sitewide from require_tree
//
// WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD
// GO AFTER THE REQUIRES BELOW.
//
//= require jquery
//= require jquery_ujs
//= require_tree .
My application.rb file
# Enable the asset pipeline
config.assets.enabled = true
Rails console output for "y Rails.application.config.assets.paths"
"/Users/Anders/Dropbox/dev/suggestion-box-app/app/assets/images",
"/Users/Anders/Dropbox/dev/suggestion-box-app/app/assets/javascripts",
"/Users/Anders/Dropbox/dev/suggestion-box-app/app/assets/stylesheets",
"/Users/Anders/.rvm/gems/ruby-2.0.0-p195#suggestion-box-app/gems/coffee-rails-3.2.2/lib/assets/javascripts",
"/Users/Anders/.rvm/gems/ruby-2.0.0-p195#suggestion-box-app/gems/jquery-rails-3.0.4/vendor/assets/javascripts"
My views/layouts/application.html.haml file
!!! 5
%html
%head
%meta{:charset => "utf-8"}/
%meta{:content => "width=device-width", :name => "viewport"}/
%meta{:content => "yes", :name => "apple-mobile-web-app-capable"}/
%title My App
%script{:type=>"text/javascript", :src=>"//use.typekit.net/wjb6ybj.js"}
:javascript
try{Typekit.load();}catch(e){}
= stylesheet_link_tag "screen", :media => "all"
= csrf_meta_tags
= javascript_include_tag "application"
%body
#container
= render "layouts/flashes"
= yield
= render "layouts/footer"
Source from an app page viewed in localhost:3000
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<meta content='width=device-width' name='viewport'>
<meta content='yes' name='apple-mobile-web-app-capable'>
<title>My app</title>
<script src='//use.typekit.net/wjb6ybj.js' type='text/javascript'></script>
<script>
try{Typekit.load();}catch(e){}
</script>
<link href="/assets/screen.css?body=1" media="all" rel="stylesheet" type="text/css" />
<meta content="authenticity_token" name="csrf-param" />
<meta content="FqMtH+rs6or9HRx+RL4bWpQyLTNPM8BKLrcf/xZknP8=" name="csrf-token" />
<script src="/assets/application.js?body=1" type="text/javascript"></script>
</head>
<body>
<div id='container'>
....
</div>
</body>
</html>
What I see when viewing "localhost:3000/assets/application.js"
/*!
* jQuery JavaScript Library v1.9.1
* http://jquery.com/
*
* Includes Sizzle.js
* http://sizzlejs.com/
*
* Copyright 2005, 2012 jQuery Foundation, Inc. and other contributors
* Released under the MIT license
* http://jquery.org/license
*
* Date: 2013-2-4
*/
(function(e,t){function P(e){var t=e.length,n=b.type(e);return b.isWindow(e)?!1:e.nodeType===1&&t?!0:n==="array"||n!=="function"&&(t===0||typeof t=="number"&&t>0&&t-1 in e)}function B(e){var t=H[e]={};return b.each(e.match(E)||[],function(e,n){t[n]=!0}),t}function I(e,n,r,i){if(!b.acceptData(e))return;var s,o,u=b.expando,a=typeof n=="string",f=e.nodeType,c=f?
[...remainder of jquery excluded]
Should I not see the test.js file here?
Any suggestions as to what the problem might be? Is there any additional info I can provide to help debug this issue? Thanks for any help!

The problem appears to have been related to my rails/gem versions. After updating from Rails 3.2.8 to Rails 3.2.14 (which also required updating the rack gem from 1.4.1 to 1.4.5) the issue was resolved and items in assets/javascripts are now being compiled/added to public/assets. Note that I created a completely new gemset as part doing this, so the issue may have had nothing to do with the Rails version and simply was a questions of a "corrupted" gem set that needed to be re-created.

Rails will compile all the targets listed in config.assets.precompile. These targets will be compiled to public/assets/. That config item already includes "application.js" and other some targets, so you need to add any other targets you want to be precompiled to public/assets/. The source file to be compiled for any particular target are automatically computed based on the name of the target; e.g., a target of test.js would be compiled from app/assets/javascripts/test.js or from app/assets/javascripts/test.js.coffee, whichever exists.

Related

TypeError: dart.global.firebase.firestore is not a function

I have been dealing with this issue for ever and none of the past posts on the problem proved helpful.
Here is my index.html
<!DOCTYPE html>
<html>
<head>
<!--
If you are serving your web app in a path other than the root, change the
href value below to reflect the base path you are serving from.
The path provided below has to start and end with a slash "/" in order for
it to work correctly.
Fore more details:
* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base
-->
<base href="/">
<meta charset="UTF-8">
<meta content="IE=Edge" http-equiv="X-UA-Compatible">
<meta name="description" content="A new Flutter project.">
<!-- iOS meta tags & icons -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-title" content="flutter_4paul">
<link rel="apple-touch-icon" href="icons/Icon-192.png">
<!-- Favicon -->
<link rel="icon" type="image/png" href="favicon.png"/>
<title>flutter_4paul</title>
<link rel="manifest" href="manifest.json">
<!-- This script installs service_worker.js to provide PWA functionality to
application. For more information, see:
https://developers.google.com/web/fundamentals/primers/service-workers -->
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-app.js"></script>
<!-- TODO: Add SDKs for Firebase products that you want to use
https://firebase.google.com/docs/web/setup#available-libraries -->
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-firestore.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-database.js"></script>
<script>
// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
var firebaseConfig = {
my config stuff here
};
// Initialize Firebase
firebase.initializeApp(firebaseConfig);
</script>
</head>
<body>
<script>
if ('serviceWorker' in navigator) {
window.addEventListener('flutter-first-frame', function () {
navigator.serviceWorker.register('flutter_service_worker.js');
});
}
</script>
<script src="main.dart.js" type="application/javascript"></script>
</body>
</html>
and here is my pubspec.yaml
name: flutter_4paul
description: A new Flutter project.
# The following line prevents the package from being accidentally published to
# pub.dev using `pub publish`. This is preferred for private packages.
publish_to: 'none' # Remove this line if you wish to publish to pub.dev
# The following defines the version and build number for your application.
# A version number is three numbers separated by dots, like 1.2.43
# followed by an optional build number separated by a +.
# Both the version and the builder number may be overridden in flutter
# build by specifying --build-name and --build-number, respectively.
# In Android, build-name is used as versionName while build-number used as versionCode.
# Read more about Android versioning at https://developer.android.com/studio/publish/versioning
# In iOS, build-name is used as CFBundleShortVersionString while build-number used as CFBundleVersion.
# Read more about iOS versioning at
# https://developer.apple.com/library/archive/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html
version: 1.0.0+1
environment:
sdk: ">=2.7.0 <3.0.0"
dependencies:
flutter:
sdk: flutter
cupertino_icons: ^1.0.2
firebase: ^9.0.1
firebase_core: ^1.2.0
firebase_auth: ^1.2.0
cloud_firestore: "^2.2.0"
firebase_storage: ^8.1.0
flutter_login: ^1.0.10
dev_dependencies:
flutter_test:
sdk: flutter
# For information on the generic Dart part of this file, see the
# following page: https://dart.dev/tools/pub/pubspec
# The following section is specific to Flutter.
flutter:
# The following line ensures that the Material Icons font is
# included with your application, so that you can use the icons in
# the material Icons class.
uses-material-design: true
# To add assets to your application, add an assets section, like this:
assets:
- assets/logo.gif
Previous posts show this bug usually happens when missing
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-firestore.js"></script>
however as you can see that is present in my index.html so I am not sure what is the issue here.
Thank You!
You should add ALL the CDNs your project needs from Firebase, I don’t recommend you to add the ones you find in other examples.
To start, in case you didn't do it yet, you should:
Go to your Firebase Console
Create a new Web App for your project (if you didn't) Project settings Web App (The one you created)
Select CDN and copy and paste it in your index.html inside body, before the tag containing the main.dart.js
If you did it, and it is still not working it is because you need to add the CDN for the other services you are using.
In your case, I see you have added the next CDNs:
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-firestore.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-database.js"></script>
I see in your pubspec.yaml you are using firebase-storage.js as well, but it is not added. Could you try to add it in your index.html?
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-storage.js"></script>
Maybe it's the same way. If you haven't solved it yet, check out the major version!
https://stackoverflow.com/a/70921671/13329045

Icons not showing with summernote rails

I followed Summernote-rails official to add rich text editor in my Rails project.
Then in my edit.html.erb I added class place_editor to my text_area:
<%= f.text_area :text, class: "place_editor form-control col-md-7 col-xs-12", rows: "15j ,placeholder: "Text", required: "required"%>
and then JavaScript as:
<script type="text/javascript">
$(function() {
$('.place_editor').summernote();
var edit = function () {
$('.click2edit').summernote({ focus: true });
};
$("#edit").click(function () {
$('.click2edit').summernote({ focus: true });
});
$("#save").click(function () {
var aHTML = $('.click2edit').code(); //save HTML If you need(aHTML: array).
$('.click2edit').destroy();
});
// Adding Css to give border to text editor
$(".note-editor").css("border", "solid 1px #e7eaec");
});
</script>
Everything works fine except ICONS.
It's Simple
Just Download summernote compile zip file click here.
Unzip the file. Copy font folder. Paste it you summernote.css root. Be sure your summernote.css file stay with font folder. Now Refresh your Browser using Ctrl + F5.
Folder Location demo:
Demo Output:
I searched for hours and finally solved it.
Actually, summernote doesn't save icons locally, instead it download it
I added this links in header
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css" rel="stylesheet">
<link href="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.1/summernote.css" rel="stylesheet">
And it did the job
I 'll welcome if someone can elaborate it further
Import the font files, it will work.
I tried import through CSS #font-face rule. You can import in javascript also.
#font-face {
font-family: summernote;
src : url('/fonts/summernote.ttf');
src : url('/fonts/summernote.eot'),
url('/fonts/summernote.woff');
}
After unzipping the Summernote distribution download, you must copy the Font folder to the same place you put the summernote.css file.
In this example, Elmer is the root folder of the website, and both summernote.css and the Font folder are copied to the /assets/css folder.
Similarly, the summernote.js file is copied to the /assets/js folder. If you're not using plugins or languages, that's all you need to install.
Here's the code to put in the header to load those files as shown:
<!-- include summernote css/js-->
<link rel="stylesheet" type="text/css" charset="utf-8" href="/assets/css/summernote.css">
<script type="text/javascript" charset="utf-8" src="/assets/js/summernote.js"></script>
Note: Including the charset="utf-8" attribute is important.
Though an answer is already accepted, still I would like to post a better answer for people seeking a solution to the problem in question.
Of course this will work:
<link rel="stylesheet" type="text/css" href="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.1/summernote.css">
But I prefer to STORE ASSETS LOCALLY. It eliminates the need of CDN which affects the loading time of the page its embedded in.
By default "summernote" looks for font-awesome icons (and some other summernote fonts) in the directory /css/font/:
//=================== The style-sheets stacking
<link type="text/css" rel="stylesheet" href="css/font-awesome.min.css">
<link type="text/css" rel="stylesheet" href="css/summernote.css">
//=================== The font goes here
/css/font/
So what u need to do is:
Download fontawesome,
Take out the fonts folder from the downloaded archive and rename it to font
Place the directory font inside the css directory of the project.
And this should work.
Considering your assets are available like this http://localhost:1337/css/font/summernote.ttf
//summernote.ttf is just an example
I hope this will help.
Thanks
Copy the font folder in your project css.
just like YourProject/css/font
that should work.
It's work with my project.
Do you have font-awesome included in your project? I believe that plugin uses font-awesome. If not, trying including this in your application.html.erb file as the src for a script tag: https://www.bootstrapcdn.com/fontawesome/
Also read this: https://github.com/summernote/summernote/issues/505
For anyone that may be having trouble with icons in MVC, it seems as though summernote looks at the base folder (in my case, Content) and the font folder needs to go in there. Here's a screenshot of my project's layout:
For whatever reason, summernote looks in the /summernote/font/ folder in Content rather than where summernote-lite.css is.
Hope this helps!
I found the same problem. The solution was I deleted the 'toolbar' key from the summernote config:
$(".summernote").summernote({
lang: 'hu-HU',
height: 300,
minHeight: null,
maxHeight: null,
toolbar: [
['font', ['roboto',]],
]
});
version: summernote v.0.8.12.

Including Google Analytics Embed API third party dashboard example javascript in my Rails app

I am following this example here for the Google Analytics Embed API to implement a GA third party dashboard via Chart.js in my app and I am having trouble on Step 3 where we are including all the javascript libraries.
I was able to load the Embed API in my application.js as so
(function(w,d,s,g,js,fs){
g=w.gapi||(w.gapi={});g.analytics={q:[],ready:function(f){this.q.push(f);}};
js=d.createElement(s);fs=d.getElementsByTagName(s)[0];
js.src='https://apis.google.com/js/platform.js';
fs.parentNode.insertBefore(js,fs);js.onload=function(){g.load('analytics');};
}(window,document,'script'));
//= require /public/javascript/Chart.min.j
//= require /public/javascript/moment.min.js
//= require /public/javascript/embed-api/date-range-selector.js
//= require /public/javascript/embed-api/active-users.js
It shows in Networks section in the dev tools that the cb=gapi.loaded_0 is getting loaded. However, the other libraries are not. Charts.min.js and moments.min.js are available online but I wan't sure where I can find embed-api/date-range-selector.js or embed-api/active-users.js to retrieve into my app?
EDIT1
Found the files here: https://github.com/googleanalytics/ga-dev-tools
I could be wrong, but I believe the Rails asset pipeline needs to have some sort of //= require_self or something like that to ensure the code in the current file is included. It looks to me like the loading snippet in that file isn't being run or is being run in the wrong order.
It's probably easier and simpler to just save it into a separate file so you can ensure the order is correct.
// File: /public/javascript/embed-api-snippet.js
(function(w,d,s,g,js,fs){
g=w.gapi||(w.gapi={});g.analytics={q:[],ready:function(f){this.q.push(f);}};
js=d.createElement(s);fs=d.getElementsByTagName(s)[0];
js.src='https://apis.google.com/js/platform.js';
fs.parentNode.insertBefore(js,fs);js.onload=function(){g.load('analytics');};
}(window,document,'script'));
Then put the rest of your code in a setup file like so:
// File: /public/javascript/embed-api-setup.js
gapi.analytics.ready(function() {
gapi.analytics.auth.authorize({
container: 'embed-api-auth-container',
clientid: 'REPLACE WITH YOUR CLIENT ID',
});
// the rest of the setup code...
});
Now your manifest should look like this:
//= require /public/javascript/embed-api-snippet.js
//= require /public/javascript/Chart.min.js
//= require /public/javascript/moment.min.js
//= require /public/javascript/embed-api/date-range-selector.js
//= require /public/javascript/embed-api/active-users.js
//= require /public/javascript/embed-api-setup.js
Also, you said:
This is talking about the gapi.analytics.auth.authorize section which I believe is part of the embed-api/active-user.js
Actually, the gapi.analytics.auth.authorize part is not in the ActiveUsers component, the auth part is something you have to write yourself (because the client ID needs to be specific to you), and it should go in the embed-api-setup.js file as I've described above.
The setup code for the example you're referencing can be found here.
I did about the same thing in Rails Admin.
First of all I did this Rails Admin Customization: embed html view into dashboard but I think it can be any view you like.
In this .html.erb file I have inserted the GA code from their website:
<!doctype html>
<html>
<head>
<title>Embed API Demos — Pure HTML Dashboards</title>
<link rel="stylesheet" href="../assets/main.css">
<script src="../assets/platform.js"></script>
<link rel="import" href="../assets/ga-auth.html">
<link rel="import" href="../assets/ga-dashboard.html">
<link rel="import" href="../assets/ga-chart.html">
<link rel="import" href="../assets/ga-viewpicker.html">
<link rel="import" href="../assets/ga-datepicker.html">
</head>
<body>
<header class="Banner">
<h1 class="Banner-title">
Embed API Demos
<em>Pure HTML Dashboards</em>
</h1>
<ga-auth clientid="INSERTYOURIDHERE"></gauth>
</header>
<ga-dashboard>
<section id="controls">
<ga-viewpicker></ga-viewpicker>
<ga-datepicker
startDate="30daysAgo"
endDate="14daysAgo">
</ga-datepicker>
</section>
<section id="charts">
<ga-chart
title="Timeline"
type="LINE"
metrics="ga:sessions"
dimensions="ga:date">
</ga-chart>
<ga-chart
title="Sessions (by country)"
type="GEO"
metrics="ga:sessions"
dimensions="ga:country">
</ga-chart>
<ga-chart
title="Top Browsers"
type="COLUMN"
metrics="ga:sessions"
dimensions="ga:browser"
sort="-ga:sessions"
maxResults="5">
</ga-chart>
<ga-chart
title="Top pages"
type="TABLE"
metrics="ga:sessions"
dimensions="ga:pagePath"
sort="-ga:sessions"
maxResults="8">
</ga-chart>
</section>
</ga-dashboard>
<footer class="SourceLink">
<a
href="https://github.com/googleanalytics/embed-api-demos/blob/master/site/6-pure-html-dashboards.html">
View source on Github</a>
→
</footer>
</body>
</html>
Next I added all the GA JS and CSS and HTML to Vendor:
I hope this helps :)
EDIT1: More information about GA Dashboarding is found here: https://ga-dev-tools.appspot.com/embed-api/

The right way to include page-specific JavaScript in Rails

I want to include this, for example:
jQuery(document).ready(function($) {
$('#my-modal').modal(options)
});
In one specific place in a rails app. In my case the file is called views/modals/mymodal.html.erb. There and only there.
I can't figure out how to do that without getting it on all pages as would happen if I put it in assets.
These are some useful tricks
#1 with file js
Create file your.js for your javascript
call file your.js on specific your layout
remove //= require_tree . on application.js
add your.js to asset percompile on config/application.rb : config.assets.precompile += %w( your.js )
#2 put into specific file non layout (not recommended)
put your js script with javascript tag on mymodal.html.erb
#3 use if..else..
put your js script into layout/yourlayout.html.erb and use if.. else.. logic.
example :
<% if current_page?(yourspecific_path) %>
<script language="text/javascript">
your javascript here ..
</script>
<% end %>
Read more here about current_page?
Or use request.fullpath to get current full path
example :
<% if request.fullpath == yourspecific_path %>
<script language="text/javascript">
your javascript here ..
</script>
<% end %>
Read more here about request.fullpath
Also you can combine #1 and #3 if you want script put into file .js
cheers
Given the JS file you want to include is named my_modal.js:
Place your JS files placed in assets/javascripts in some directory inside of
assets/javascripts, for example application.
Change line //= require_tree . to //= require_tree application in your application.js (it prevents loading my_modal.js on every page).
Place your my_modal.js in assets/javasctripts
Add my_modal.js to config.assets.precompile array (config assets.precompile += ['my_modal.js']) in your application.rb.
Put javascript_include_tag 'my_modal' in the view you want this file included
You can go to Rails guides for reference.
One of the solution is to insert our javascript in to its own file: Reference Link
For example :
// app/assets/javascripts/alert.js
alert("My example alert box.");
And including this file only in the view we want it to execute:
<%# app/views/page/contact.html.erb %>
<%= javascript_include_tag "alert" %>
<h1>Contact</h1>
<p>This is the contact page</p>
And don’t forget to include your new file in the list of files to be compiled:
# config/environments/production.rb
config.assets.precompile += %w( alert.js )
Late to the party, but for anyone viewing this today I think I've come up with something better.
Punchbox Gem for Rails
With this, you can write code like:
class Post {
controller() {
// Runs on every action
}
index() {
// Runs on just the index action
}
}
Punchbox.on('Posts', Post);
(You can also create an object instead of a class. See the docs)
I've written about this much more in depth here: https://kierancodes.com/blog/page-specific-javascript-in-rails-4
jquery-readyselector is a plugin that "Extends $().ready() to provide a convenient syntax for page-specific script"
Install jquery-readyselector
Create some CSS classes
<body class="<%= controller_name %> <%= action_name %>">
Scope your javascript to your page
$("#my-modal").ready(function() {
$('#my-modal').modal(options)
});
More info in this answer How to load page specific rails 4 js files?

Adding date picker as parameter in BIRT

I am having some challenges adding a date picker for my date parameter in an Eclipse report. I have little or no knowledge of Javascript ... I would appreciate some detailed instruction on how to accomplish this. Thanks.
There is a way to achieve this, but it is not straight forward.
Here is how,
First you need to download the jscal2 project files.You will find the required files in the below mentioned Github project.
https://github.com/captainhcg/GFW/tree/master/js/JSCal2-1.9
In your project find "FramesetFragment.jsp" file located in the location
birt/webcontent/birt/pages/layout/FramesetFragment.jsp
This file should be readily available in your current project setup, if you already have birt report up and running.
(I am not going to explain birt report configuration in a JAVAEE web project here, because this is only about
how to add the datepicker for existing birt report date parameter field.)
Add the following lines of code after line number 130(before the </HEAD> tag) of "FramesetFragment.jsp" file. Replace the context root path with your
project context root.
<script src="${pageContext.request.contextPath}/js/jscal2.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/js/lang/en.js" type="text/javascript"></script>
<link rel="stylesheet" href="${pageContext.request.contextPath}/css/border-radius.css" meda="screen" type="text/css"/>
<link rel="stylesheet" href="${pageContext.request.contextPath}/css/jscal2.css" meda="screen" type="text/css"/>
Add the relevant files(4 files) into specified locations in your project
4.1 Add both jscal2.js and en.js files into javascript file location in your project.
yourwebcontextroot/js/jscal2.js
yourwebcontextroot/js/lang/en.js (* At least one language file is required)
4.2 Add both style sheets to relevant locations.
yourwebcontextroot/css/border-radius.css
yourwebcontextroot/css/jscal2.css
Find "TextBoxParameterFragment.jsp" file located in
"birt/webcontent/birt/pages/parameter/TextBoxParameterFragment.jsp"
Add the following code just before the last table data and table row end tags of "TextBoxParameterFragment.jsp" file.
<%
if (parameterBean.getParameter().getDataType()==7|| parameterBean.getParameter().getDataType()==4) {
%>
<button id="<%=parameterBean.getName()%>_button">...</button>
<script type="text/javascript">
Calendar.setup({
trigger : '<%=parameterBean.getName()%>_button',
inputField : '<%=parameterBean.getName()%>',
onSelect : function() { this.hide() }
});
</script>
<%
}
%>
</TD>`<!-- Last table data end tag -->`
</TR>`<!-- Last table row end tag -->`
Thats all. Redeploy your project.Open a new browser window and go to one of your reports.
You should see a button next to date fields and once you clicked on it, you will get a datepicker window.
Note:
Both "FramesetFragment.jsp" and "TextBoxParameterFragment.jsp" files could be in different locations in your project.

Categories

Resources