Jump to content

Jalali Calendar


patmap

Recommended Posts

  • 3 weeks later...

OK I will look at it. We will not implement this as a new component. I will try to show you how to integrate it into your application.

 

Hi Mr. Farshad

 

Can you make a sample for this pluging?

 

Or how can i use this plugin in my project ?

 

 

Best Regards

Link to comment
Share on other sites

  • Administrators

To MainForm.Scrpits add:

 

Ext.override(Ext.DatePicker, {
 initComponent: Ext.DatePicker.prototype.initComponent.createInterceptor(function() {
this.plugins = [Ext.ux.JalaliDatePlugin];
 	return(true);
}) 
});

 

To ServerModule.CustomFiles add

 

files\Jalali\Jalali.js
files\Jalali\JalaliDate.js
files\Jalali\JalaliDatePlugin.js
files\Jalali\JalaliDatePlugin-fa_IR.js

 

This will change all DatePicker instances in your app to jalali calendar.

Link to comment
Share on other sites

To MainForm.Scrpits add:

 

Ext.override(Ext.DatePicker, {
 initComponent: Ext.DatePicker.prototype.initComponent.createInterceptor(function() {
this.plugins = [Ext.ux.JalaliDatePlugin];
 	return(true);
}) 
});

 

To ServerModule.CustomFiles add

 

files\Jalali\Jalali.js
files\Jalali\JalaliDate.js
files\Jalali\JalaliDatePlugin.js
files\Jalali\JalaliDatePlugin-fa_IR.js

 

This will change all DatePicker instances in your app to jalali calendar.

 

 

Hi, Mr. Farshad

 

Thank you for your reply.

This work very good and DateTimePicker show Jalali Calendar Panel.

But have a litle problem, in the DatetTimePicker text box not show jalali Date !!! This shown a gregorian date. Event a select a jalali date and close the Jalali Panel in the text box not show Jalali Date !!!

 

Please help me.

 

Thank you and Best Regards

Link to comment
Share on other sites

  • Administrators

Not sure what can be done about it. Gregorian date is used internally by both Ext JS and Delphi and this can not be changed. You must convert date when it is displayed but all these must be implemented in JS. i.e. you need a JS code which converts Gregorian date to Persian date. Also date must be converted back to Gregorian when it is sent back to the server.

Link to comment
Share on other sites

Hi, Mr. Farshad

 

I can convert it to display in textbox, but when i click on calnedar button to view Jalali Calendar Panel, i cant triger this and jalali date send to panel and panel convert it to jalali agin and date is incorrect shown in then panel !!!

How can i trigger this when panel want get date from textbox i give it a grigorian date ?

 

If we have a OnGetText event like DBEdit or TField only for display a text not for store text in the DateTimePicker this is a best way for do it.

 

Can you help me for this event Please ?

 

Best Regrads

Link to comment
Share on other sites

Hi. Mr. Farshad

 

I develope this component with OnGetText event and work fine !

 

unit UniXJalaliCalendar;

interface

uses
 SysUtils, Classes, Controls, Ext, ExtPascal, ExtCalendar, uniGUIBaseClasses, uniGUIClasses, uniPanel,
 uniDateTimePicker, DateFunc;

Type TDateTimePickerGetText = procedure(sender: TObject; Var DisplayText: AnsiString) Of Object ;

Type
 TUniXJalaliCalendar = class(TUniDateTimePicker)
 private
FVersion: string;
OldOnAjaxEvent: TUniAjaxEvent ;
FOnGetText: TDateTimePickerGetText;
function GetJalaliDate: String;
Procedure OnMyAjaxEvent(Sender: TComponent; EventName: string; Params: TStrings);
{ Private declarations }
 protected
{ Protected declarations }
Procedure Loaded; Override;
 public
{ Public declarations }
Constructor Create(Owner: TComponent); Override;
Destructor Destroy;
 published
{ Published declarations }
Property JalaliDate: String Read GetJalaliDate ;
Property OnGetText: TDateTimePickerGetText Read FOnGetText Write FOnGetText ;
 End;

procedure Register;

Implementation

// -----------------------------------------------------------------------------
Procedure Register;
Begin
 RegisterComponents('uniGUI Custom', [TUniXJalaliCalendar]);
End ;

// -----------------------------------------------------------------------------
{ TUniXJalaliCalendar }
Constructor TUniXJalaliCalendar.Create(Owner: TComponent);
Begin
 Inherited Create(Owner);
End ;

// -----------------------------------------------------------------------------
destructor TUniXJalaliCalendar.Destroy;
begin
 inherited;
End;

// -----------------------------------------------------------------------------
Function TUniXJalaliCalendar.GetJalaliDate: String;
Begin
 DateTimeToString(Result, 'yyyy/MM/dd', Self.DateTime) ;
 Result := StrMToSh( Result ) ;
End;

// -----------------------------------------------------------------------------
Procedure TUniXJalaliCalendar.Loaded ;
Begin
 Inherited;
 If WebMode Then
 Begin
	OldOnAjaxEvent := Self.OnAjaxEvent ;
	Self.OnAjaxEvent := OnMyAjaxEvent ;

	Self.Text := '' ;
 End;
End;

// -----------------------------------------------------------------------------
Procedure TUniXJalaliCalendar.OnMyAjaxEvent(Sender: TComponent; EventName: string; Params: TStrings);
Var DisplayText : AnsiString ;
Begin
 If SameText(EventName, 'select') And ( Params.Values['Date'] <> '' ) Then
 Begin
If Assigned(FOnGetText)  Then
 	FOnGetText(Sender, DisplayText)
Else
 	DisplayText := GetJalaliDate ;
JSCode('document.getElementById("'+Self.JSName+'_id").value="'+DisplayText+'";');
 End;
 If Assigned(OldOnAjaxEvent) Then
OldOnAjaxEvent(Sender, EventName, Params);
End ;

// -----------------------------------------------------------------------------
End.

 

This code in AjaxEvent very important condition:

 

Params.Values['Date'] <> ''

 

 

Best Regrads

Link to comment
Share on other sites

  • 4 years later...

To MainForm.Scrpits add:

 

Ext.override(Ext.DatePicker, {
  initComponent: Ext.DatePicker.prototype.initComponent.createInterceptor(function() {
	this.plugins = [Ext.ux.JalaliDatePlugin];
  	return(true);
	}) 
});
To ServerModule.CustomFiles add

 

files\Jalali\Jalali.js
files\Jalali\JalaliDate.js
files\Jalali\JalaliDatePlugin.js
files\Jalali\JalaliDatePlugin-fa_IR.js
This will change all DatePicker instances in your app to jalali calendar.

 

 

 

not work  loop loading ....

plz make sample code

Link to comment
Share on other sites

Hi,

 

1. Download these files and copy to directory for example "files/":

  1.    https://raw.githubusercontent.com/behrang/Ext.ux.JalaliDatePlugin/master/Jalali.js
  2.    https://raw.githubusercontent.com/behrang/Ext.ux.JalaliDatePlugin/master/JalaliDate.js
  3.    https://raw.githubusercontent.com/behrang/Ext.ux.JalaliDatePlugin/master/JalaliDatePlugin-fa_IR.js
  4.    https://raw.githubusercontent.com/behrang/Ext.ux.JalaliDatePlugin/master/JalaliDatePlugin.js

* JalaliDatePlugin-fa_IR.js - for localization

 

2. UniServerModule.CustomFiles add these "lines":

files/Jalali.js
files/JalaliDate.js
files/JalaliDatePlugin.js
files/JalaliDatePlugin-fa_IR.js

3. UniDateTimePicker->ClientEvents->UniEvents ... add beforeInit fn:

function beforeInit(sender, config)
{
  sender.plugins = [new Ext.ux.JalaliDatePlugin]
}

Try...

 

post-906-0-43834600-1453094149_thumb.png

 

Best regards.

Link to comment
Share on other sites

Thanks Delphi Developer

 

Can do add all Datepicker Renderers      

in unigui

 

There are many different calendars used throughout the world. This plugin aims to make them accessible in JavaScript in a consistent manner. The basic modules provide the underlying calendar support, while the picker module builds a generic datepicker on top of this functionality.

Link to comment
Share on other sites

  • 5 months later...

Hi,

 

It is works, but

Follow this sequence:

 

1. UniDateTimePicker1->Kind = tUniDateTime

 

2. After,

UniDateTimePicker1->ClientEvents->UniEvents [Ext.form.field.Date[date]] ... date.beforeInit fn:

function date.beforeInit(sender, config)
{
    sender.plugins = [new Ext.ux.JalaliDatePlugin]
}

Best regards.

  • Upvote 1
Link to comment
Share on other sites

  • 4 weeks later...

Please sign in to comment

You will be able to leave a comment after signing in



Sign In Now
×
×
  • Create New...