datetime columns

Questionsdatetime columns
Cristi Gradinaru asked 8 years ago

Hi,

I have some difficulties in creating a calculated column where I should insert a div and then execute a javascript in order to build a countdown timer.

So, column [rezervation_date] contains the date and time when an item is reserved and is defined as follows:
$col = array();
$col["title"] = "Data rezervare";
$col["name"] = "rezervation_date";
$col["width"] = "25";
$col["align"] = "center";
$col["editable"] = true;
$col["editoptions"] = array("size"=>20);
$col["editrules"] = array("required"=>false, "readonly"=>true);
$col["editoptions"] = array("size"=>20, "value"=>date('Y-m-d H:i:s'));
$col["search"] = false;
$cols[] = $col;

Column [rezervation_exp_date] contains the date and time when the item reservation expires – 12 hours after the reservation is submitted – and is defined as follows:
$col = array();
$col["title"] = "Expirare rezervare";
$col["name"] = "rezervation_exp_date";
$col["hidden"] = false;
$col["align"] = "center";
$col["width"] = "25";
$col["editable"] = true;
$col["editrules"] = array("required"=>false, "readonly"=>true);
$col["editoptions"] = array("size"=>25, "value"=>date('Y-m-d H:i:s', strtotime(date('Y-m-d H:i:s'))+43200));
$col["search"] = false;
$cols[] = $col;

All I need is a column where I should calculate the difference between the time when the reservation expires – column [rezervation_exp_date] – and the time when the table is generated and listed. The bellow example does not work…

$col = array();
$col["title"] = "Timer rezervare";
$col["name"] = "timer";
$col["hidden"] = false;
$col["align"] = "center";
$col["width"] = "20";
$col["editable"] = true;
$col["editrules"] = array("required"=>false, "readonly"=>true);
$col["condition"] = array('$row["rezervation_exp_date"] == "0000-00-00 00:00:00"', "Nerezervat", "<div class='timer' data-seconds-left=".(strtotime($row["rezervation_exp_date"])-strtotime(date('Y-m-d H:i:s')))."></div>");
$col["show"] = array("list"=>true,"edit"=>false,"add"=>false);
$col["search"] = false;
$cols[] = $col;

In HTML, before </head> tag:
<script src="js/jquery.simple.timer.js"></script>
<script>
$(function(){
$('.timer').startTimer({
});
})
</script>

Ex: I'm trying to use this simple timer http://csouza.me/jQuery-Simple-Timer/
In the database, in the column [timer] i'm getting something like:
<div class="timer" data-seconds-left="-1448208116"></div>
but the timer is not displayed…

Any ideas?

4 Answers
Abu Ghufran answered 8 years ago

Perhaps, You need to put the timer JS code in AfterShowForm event of grid dialog. As before that the element does not exist.

$opt["add_options"]["afterShowForm"] = 'function () {………}';
$opt["edit_options"]["afterShowForm"] = 'function () {………}';

This event is called when dialog of add/edit is opened.

Cristi Gradinaru answered 8 years ago

It doesn't seem to be working… or I'm not doing something right.
I need the counter to show in the grid after the inline editing is done and the save icon is clicked.

Abu Ghufran answered 8 years ago

For inline edit, you need to connect JS code with dataInit event.

$col["editoptions"]["dataInit"] = "function(){ setTimeout(function(){ link_counter('{$col["name"]}'); },200); }";

<script>
function link_counter(id)
{ … }
</script>

Cristi Gradinaru answered 8 years ago

Yep, that did the trick 🙂

Thank you very much!

Your Answer

8 + 1 =

Login with your Social Id:

OR, enter

Attach code here and paste link in question.
Attach screenshot here and paste link in question.



How useful was this discussion?

Click on a star to rate it!

Average rating 0 / 5. Vote count: 0

No votes so far! Be the first to rate it.

We are sorry that this post was not useful for you!

Let us improve this post!

Tell us how we can improve this post?