Jump to content

Help Adding a Time Stamp to a To-Do List


forex4noobs

Recommended Posts

Hi Guys,

 

I need some help please. I am coding a mootools based to-do list for my website.

 

http://www.Domain Name Spam Removed.com/forex-tools/trade-list.php

 

In the link above if you put something in the 'add' field and click the button it adds it to the box below. It works perfectly so far however I want a timestamp added every time a new item is created.

 

Is there any way to get this done with PHP?

 

I am a complete PHP newbie I am guessing this very easy stuff but it is beyond me.

 

Thanks,

Nick

Ok I will try an explain it in more detail.

 

I am creating a mootools javascript based to-do list. The list is extremely simple. It has a single field into which you enter some text. Once you press the button the entered text is added to the to-do list. In the example below you see I have added 'blah 1' 'blah 2' ect.

 

blahs.png

 

The problem I have so far is that I want a timestamp added to each item. I believe this can be accomplished via PHP. However, it is beyond my skill level. So what I want is a timestamp added to in front of each item on the list showing when the item was added to the list. Ideally I would want something like what is show in the image below:

 

blah2.png

 

The time would be based on the users computer time. The current code is below:

 

HTML:

    <div id="tradeList">
    <form id="addTask">
  	  <input type="text" id="newTask" />
	  <input type="submit" value="Add!" />
  </form>

  <div id="listArea">
	  <ol id="todo"></ol>
  </div>

  <div id="data"/></div>
  </div>

 

JS

window.addEvent('domready', function() {

//This is the function that will run every time a new item is added or the 
//list is sorted.
var showNewOrder = function() {
	//This function means we get serialize() to tell us the text of each 
	//element, instead of its ID, which is the default return.
	var serializeFunction = function(el) { return el.get('text'); };
	//We pass our custom function to serialize();
	var orderTxt = sort.serialize(serializeFunction);
	//And then we add that text to our page so everyone can see it.
	$('data').set('text', orderTxt.join(' '));
};

//This code initalizes the sortable list.
var sort = new Sortables('.todo', {
	handle: '.drag-handle',
	//This will constrain the list items to the list.
	constrain: true,
	//We'll get to see a nice cloned element when we drag.
	clone: true,
	//This function will happen when the user 'drops' an item in a new place.
	onComplete: showNewOrder
});

//This is the code that makes the text input add list items to the <ul>,
//which we then make sortable.
var i = 1;
$('addTask').addEvent('submit', function(e) {
	e.stop();
	//Get the value of the text input.
	var val = $('newTask').get('value');
	//The code here will execute if the input is empty.
	if (!val) {
		$('newTask').highlight('#f00').focus();	
		return; //Return will skip the rest of the code in the function. 
	}
	//Create a new <li> to hold all our content.
	var li = new Element('li', {id: 'item-'+i, text:val});
	//This handle element will serve as the point where the user 'picks up'
	//the draggable element.
	var handle = new Element('div', {id:'handle-'+i, 'class':'drag-handle'});
	handle.inject(li, 'top');
	//Set the value of the form to '', since we've added its value to the <li>.
	$('newTask').set('value', '');
	//Add the <li> to our list.
	$('todo').adopt(li);
	//Do a fancy effect on the <li>.
	li.highlight();
	//We have to add the list item to our Sortable object so it's sortable.
	sort.addItems(li);
	//We put the new order inside of the data div.
	showNewOrder();
	i++;
});

});

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.