Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.

...

HTML
<div id="keyWordContainerDiv"></div>


<style>
	.Keyword-Container-Wrapper{
		width: 100%;
		height: auto;
		min-height: 30px;
	}


	.Keyword-Container-Wrapper-Span{
		padding: 5px;
		background-color: #3572b0;
		color: #fff;
	}
</style>


<script>


TOTVS_Keywords = {
	Id: 'KeyWord1',
	Container: null,
	Tags: [],
	Init: function(id, nameOfContainer, tags){
		this.Id = id;
		this.Container = nameOfContainer; 
		this.Tags = tags;
	},
	Build: function(id, nameOfContainer, tags){
			this.Init(id, nameOfContainer, tags);
			this.Container = (typeof this.Container === "string") ? document.getElementById(this.Container) : this.Container; 

			var _keyWordContainerWrapper = document.createElement('div');		
			_keyWordContainerWrapper.id = this.Id + "_ContainerWrapper";
			_keyWordContainerWrapper.className = "Keyword-Container-Wrapper";


			var _keyWordContainerWrapperInput = document.createElement('input');		
			_keyWordContainerWrapperInput.id = _keyWordContainerWrapper.id + "_Input";
			_keyWordContainerWrapperInput.name = _keyWordContainerWrapperInput.id;
			_keyWordContainerWrapperInput.type = "text";
			_keyWordContainerWrapperInput.onkeypress = function(e){
				var _evt = e || window.event;
				if (event.which == 13 || event.keyCode == 13) {
        			this.Tags.push(this.value);
					
					var _span = document.createElement('span');
					
					this.parentNode.insertBefore(_span, this);
        			return false;
    			}
			}


			_keyWordContainerWrapper.appendChild(_keyWordContainerWrapperInput);

			this.Container.appendChild(_keyWordContainerWrapper);
	}
}


TOTVS_Keywords.Build('TOTVS_KeyWord', 'keyWordContainerDiv', [])


</script>