JavaScript: Function that detects click and returns control to calling function

slackaddict · 11-26-2013, 09:20 PM

Hi

I want to call a function that displays a list then returns control, along with the id of the clicked item, to the calling function.

I want it to work like this:

Code:

function createOrder() {
	customerId = getCustomerId();
	// Continue creating order now...
}

function getCustomerId() {
	// Display list of customers...
	// Return the id of clicked item
	return customerId;
}

But I don't know how to detect the click and return control to createOrder().

At the moment I do this:

Code:

function createOrder(customerId ) {
	if (typeof customerId == 'undefined') {
		customerId = getCustomerId(createOrder);
	} else {
		// Continue creating order now...
	}
}

function getCustomerId(callback) {
	var list = document.createElement('ul');
	// Sample data...
	for (i=0; i<9; i++) {
		var id = 'Cust' + i;
		var item = document.createElement('li');
		item.appendChild(document.createTextNode('Customer ' + id));
		item.id = id;
		item.addEventListener('click', function() { callback(this.id) });
		list.appendChild(item);
	}
	document.getElementById('test').appendChild(list);
}

But this isn't really returning control to the calling function, it just calls that function again, this time with a parameter.

How can I get javascript to detect the click and actually return to the calling function?

Thanks

NevemTeve · 11-27-2013, 02:07 PM

Not possible. The script that is activated by the selection (onclick) should find out (from variables) that a creation is in progress.

astrogeek · 11-27-2013, 02:53 PM

Not sure why you would have that particular code structure, but it seems to me that you are doing it backwards calling createOrder() then expecting it to synchronously get the customerId. Think asynchronously...

Code:

function listCustomers() {
	var list = document.createElement('ul');
	// Sample data...
	for (i=0; i<9; i++) {
		var id = 'Cust' + i;
		var item = document.createElement('li');
		item.appendChild(document.createTextNode('Customer ' + id));
		item.id = id;
		item.addEventListener('click', function() { createOrder(this.id) });
		list.appendChild(item);
	}
	document.getElementById('test').appendChild(list);
}

function createOrder(customerId ) {

		// Continue creating order now...

}