You are viewing a plain text version of this content. The canonical link for it is here.
Posted to user@ofbiz.apache.org by Foo Shyn Chung <ip...@gmail.com> on 2012/02/01 17:13:07 UTC
Using datepicker in FTL file
Hi guys,
I need to use datepicker in FTL within Ofbiz but i failed to find any
example of doing so. I manage to put in the codes that shows the field and
the datepicker image (which is a 'button') on the screen, however when i
click on the datepicker image, nothing happens.
Below is the code snippet i put into my FTL:
<span class="view-calendar">
<input type="text" id="CustomerForm_approvedDate_i18n" maxlength="10"
size="10" title="Format: yyyy-MM-dd" name="approvedDate_i18n">
<input type="text" id="CustomerForm_approvedDate" maxlength="10"
size="10" title="Format: yyyy-MM-dd" null="null"
style="height:1px;width:1px;border:none;background-color:transparent"
name="approvedDate" class="hasDatepicker">
<button type="button" class="ui-datepicker-trigger"></button>
<script type="text/javascript">
if (Date.CultureInfo != undefined) {
var initDate = "";
if (initDate != "") {
var dateFormat =
Date.CultureInfo.formatPatterns.shortDate;
if (initDate.indexOf('.') != -1) {
initDate = initDate.substring(0,
initDate.indexOf('.'));
}
var ofbizTime = "yyyy-MM-dd";
var dateObj = Date.parseExact(initDate, ofbizTime);
var formatedObj = dateObj.toString(dateFormat);
jQuery("#CustomerForm_approvedDate_i18n").val(formatedObj);
}
jQuery("#CustomerForm_approvedDate").change(function() {
var ofbizTime = "yyyy-MM-dd";
var newValue = ""
if (this.value != "") {
var dateObj = Date.parseExact(this.value,
ofbizTime);
var dateFormat =
Date.CultureInfo.formatPatterns.shortDate;
newValue = dateObj.toString(dateFormat);
}
jQuery("#CustomerForm_approvedDate_i18n").val(newValue);
});
jQuery("#CustomerForm_approvedDate_i18n").change(function() {
var dateFormat =
Date.CultureInfo.formatPatterns.shortDate;
var newValue = ""
if (this.value != "") {
var dateObj = Date.parseExact(this.value,
dateFormat);
var ofbizTime = "yyyy-MM-dd";
newValue = dateObj.toString(ofbizTime);
}
jQuery("#CustomerForm_approvedDate").val(newValue);
});
} else {
jQuery("#CustomerForm_approvedDate").change(function() {
jQuery("#CustomerForm_approvedDate_i18n").val(this.value);
});
jQuery("#CustomerForm_approvedDate_i18n").change(function() {
jQuery("#CustomerForm_approvedDate").val(this.value);
});
}
jQuery("#CustomerForm_approvedDate").datepicker({
showOn: 'button',
buttonImage: '',
buttonText: '',
buttonImageOnly: false,
dateFormat: 'yy-mm-dd',
changeMonth: true,
changeYear: true
})
;
</script>
<input type="hidden" value="Timestamp" name="">
</span>
Anyone has any idea on this? Or a pointer to an example where datepicker is
being use in a FTL file would be appreciated as well.
Thanx
FooShyn
Re: Using datepicker in FTL file
Posted by Bilgin Ibryam <bi...@gmail.com>.
Hi FooShyn,
Look at this file
/ofbiz/applications/order/webapp/ordermgr/entry/cart/showcart.ftl
and this tag <@htmlTemplate.renderDateTimeField
HTH
Bilgin
On 1 February 2012 16:13, Foo Shyn Chung <ip...@gmail.com> wrote:
> Hi guys,
>
> I need to use datepicker in FTL within Ofbiz but i failed to find any
> example of doing so. I manage to put in the codes that shows the field and
> the datepicker image (which is a 'button') on the screen, however when i
> click on the datepicker image, nothing happens.
>
> Below is the code snippet i put into my FTL:
>
> <span class="view-calendar">
> <input type="text" id="CustomerForm_approvedDate_i18n" maxlength="10"
> size="10" title="Format: yyyy-MM-dd" name="approvedDate_i18n">
> <input type="text" id="CustomerForm_approvedDate" maxlength="10"
> size="10" title="Format: yyyy-MM-dd" null="null"
> style="height:1px;width:1px;border:none;background-color:transparent"
> name="approvedDate" class="hasDatepicker">
> <button type="button" class="ui-datepicker-trigger"></button>
> <script type="text/javascript">
> if (Date.CultureInfo != undefined) {
> var initDate = "";
> if (initDate != "") {
> var dateFormat =
> Date.CultureInfo.formatPatterns.shortDate;
> if (initDate.indexOf('.') != -1) {
> initDate = initDate.substring(0,
> initDate.indexOf('.'));
> }
> var ofbizTime = "yyyy-MM-dd";
> var dateObj = Date.parseExact(initDate, ofbizTime);
> var formatedObj = dateObj.toString(dateFormat);
>
> jQuery("#CustomerForm_approvedDate_i18n").val(formatedObj);
> }
> jQuery("#CustomerForm_approvedDate").change(function() {
> var ofbizTime = "yyyy-MM-dd";
> var newValue = ""
> if (this.value != "") {
> var dateObj = Date.parseExact(this.value,
> ofbizTime);
> var dateFormat =
> Date.CultureInfo.formatPatterns.shortDate;
> newValue = dateObj.toString(dateFormat);
> }
>
> jQuery("#CustomerForm_approvedDate_i18n").val(newValue);
> });
>
> jQuery("#CustomerForm_approvedDate_i18n").change(function() {
> var dateFormat =
> Date.CultureInfo.formatPatterns.shortDate;
> var newValue = ""
> if (this.value != "") {
> var dateObj = Date.parseExact(this.value,
> dateFormat);
> var ofbizTime = "yyyy-MM-dd";
> newValue = dateObj.toString(ofbizTime);
> }
> jQuery("#CustomerForm_approvedDate").val(newValue);
> });
> } else {
> jQuery("#CustomerForm_approvedDate").change(function() {
>
> jQuery("#CustomerForm_approvedDate_i18n").val(this.value);
> });
>
> jQuery("#CustomerForm_approvedDate_i18n").change(function() {
> jQuery("#CustomerForm_approvedDate").val(this.value);
> });
> }
> jQuery("#CustomerForm_approvedDate").datepicker({
> showOn: 'button',
> buttonImage: '',
> buttonText: '',
> buttonImageOnly: false,
> dateFormat: 'yy-mm-dd',
> changeMonth: true,
> changeYear: true
> })
>
> ;
> </script>
> <input type="hidden" value="Timestamp" name="">
> </span>
>
> Anyone has any idea on this? Or a pointer to an example where datepicker is
> being use in a FTL file would be appreciated as well.
>
> Thanx
> FooShyn