Custom Dialogue

[theS70RM]

Hi,

I've made a class to show various forms to the screen. The only thing I cant figure out is how to integrate it so they return a value like normal dialogues..

You will see better from an example.

Here is a simplified version of the class i made:

	function Form(type){		
						
		switch (type){
			case 0:
				width = "450";
				height = "300";
				
				newDiv = document.createElement("div");
				newDiv.className = "form";	
				newDiv.style.left = (window.innerWidth/2) - (width/2) +"px";
				newDiv.style.top = (window.innerHeight/2) - (height/2) +"px";
				newDiv.style.width = width + "px";
				newDiv.style.height = height + "px";
				newDiv.appendChild(this.makeButtons("OkCancel"));
				this.object = newDiv;

			break;
			
		}
		
		document.body.appendChild(this.object);
		
		
	}
	
	Form.prototype.makeButtons = function(type){
			
		var buttons = document.createElement("div");
		var me = this;
		
		switch (type){
			case "OkCancel":  //ok & cancel

			
				newButton = document.createElement("input");
				newButton.type = "button";
				newButton.value = "Cancel"
				newButton.onclick = function(){me.setResponse(false);}
				
				buttons.appendChild(newButton);
				newButton = document.createElement("input");
				newButton.type = "button";
				newButton.value = "OK"
				newButton.onclick = function(){me.setResponse(true);}
				buttons.appendChild(newButton);
				break;
				
			default:

				
		}
			
		return buttons;
			
	}
	
	Form.prototype.setResponse = function(response){
		this.response = response;
		
		this.remove();
	
	}
	
	Form.prototype.remove = function(){
		document.body.removeChild(this.object);
	}

and then its run from the page with something like....

function showform(){

	response = new Form(0);
	
	alert(response);


}

but obviously there is something missing, I need it to wait until the user has clicked a button before returning...

Can anyone help??


Thanks!


Andy

[pronerd]

I need it to wait until the user has clicked a button before returning...

You can trigger your logic to be called on an onClick event.

<div onClick="callYourFunctionHere()" >Click Here</div