diff --git a/src/display.js b/src/display.js
index a4e9443..51b5893 100644
--- a/src/display.js
+++ b/src/display.js
@@ -5,34 +5,74 @@ export default function (compDef) {
   const {componentName,
 	 fields
 	} = compDef
+  let propTypes = {}
 
   const componentProperName = componentName[0].toUpperCase() + componentName.substring(1)
   const fieldNames = Object.keys(fields)
+  fieldNames.map((fieldName)=>{
+    if (fields[fieldName].relation) {
+      const relation = fields[fieldName].relation
+      const relationProperName = relation[0].toUpperCase() + relation.substring(1)
+      propTypes[`${relation}Routes`] = PropTypes.object
+      propTypes[`${relation}Templates`] = PropTypes.object
+      propTypes[`save${componentProperName}${relationProperName}`] = PropTypes.func
+      propTypes[`delete${componentProperName}${relationProperName}`] = PropTypes.func
+      propTypes[`${relation}ComponentDef`] = PropTypes.object
+      propTypes[`${relation}List`] = PropTypes.object
+      propTypes[relation] = PropTypes.object
+    }
+  })
+
+
   const ComponentDisplay = (props) =>{
     console.log('in display', props)
-    let next = Object.assign({}, props[componentName])
+    let state = Object.assign({}, props[componentName])
     const url = props.routing.locationBeforeTransitions.pathname
     const editURL = `${url.slice(0, url.lastIndexOf('/')+1)}edit`
     const {goBack} = props
     const listCaption = `Datos de ${componentProperName}`
     const listFields = []
+    const relationFields = []
 
     for (let fieldName of fieldNames) {
+      console.log('field', state[fieldName])
       const componentField = compDef.fields[fieldName]
-      const field = <div key={fieldName}>
-	    <ListItem caption={next[fieldName] ||''}
-      legend={componentField.label} righticon={componentField.icon}/>
-	</div>
-	listFields.push(field)
+      if (componentField.relation) {
+	const relComponents = []
+	const relation = componentField.relation
+	const relationList = props[`${relation}List`]
+	console.log('Props relationList', `${relation}List`, relationList)
+	console.log(`relation, ${componentField.relation}`, state[fieldName])
+ 	if (state[fieldName]) {
+	  const ids = Object.keys(state[fieldName])
+  	  ids.map((id, index) => {
+ 	    console.log('rel id', relationList[id])
+	    const relComp = []
+	    const relCompKeys = Object.keys(relationList[id])
+	    relCompKeys.map((name) =>{
+	      relComp.push(<div>{name}: {relationList[id][name]}</div>)
+	    })
+ 	    relComponents.push(relComp)
+ 	  })
+	relationFields.push(<div key={componentField.relation}>
+			    {componentField.relation}, {relComponents}</div>)
+	}
+      } else {
+	const field = <div key={fieldName}>
+	    <ListItem caption={state[fieldName] ||''}
+	legend={componentField.label} righticon={componentField.icon}/>
+	  </div>
+	  listFields.push(field)
+      }
     }
-
     return (
 	<div>
 	<List>
 	<ListSubHeader caption={listCaption}/>
 	{listFields}
+	<div>Relaciones: {relationFields} </div>
       </List>
-	<Button icon='edit' floating disabled={!next.isValid} accent mini onClick={(e)=>{
+	<Button icon='edit' floating disabled={!state.isValid} accent mini onClick={(e)=>{
 	  props.pushRoute(editURL)
 	}}/>
 	<Button icon='undo' floating accent mini onClick={()=>{goBack()}}/>
@@ -40,11 +80,10 @@ export default function (compDef) {
     )
   }
 
-  ComponentDisplay.propTypes = {
-    pushRoute: PropTypes.func,
-    goBack: PropTypes.func,
-    routing: PropTypes.object
-  }
+  ComponentDisplay.propTypes = propTypes
+  ComponentDisplay.propTypes.pushRoute = PropTypes.func
+  ComponentDisplay.propTypes.goBack = PropTypes.func
+  ComponentDisplay.propTypes.routing = PropTypes.object
   ComponentDisplay.propTypes[`${componentName}`] = PropTypes.object
   ComponentDisplay.propTypes[`save${componentProperName}`] = PropTypes.func
   ComponentDisplay.propTypes[`store${componentProperName}`] = PropTypes.func
diff --git a/src/edit.js b/src/edit.js
index ed2a54d..b5ce9c8 100644
--- a/src/edit.js
+++ b/src/edit.js
@@ -1,5 +1,5 @@
-import React, {PropTypes} from 'react'
-import {List, ListItem, ListSubHeader, Button, Input} from 'react-toolbox'
+import React, {Component, PropTypes} from 'react'
+import {List, ListSubHeader, Button, Input} from 'react-toolbox'
 
 export default function (compDef) {
   const {componentName,
@@ -22,86 +22,138 @@ export default function (compDef) {
       propTypes[relation] = PropTypes.object
     }
   })
-  const ComponentEdit = (props) =>{
-    const next = Object.assign({}, props[componentName])
-    console.log('next', next, props)
-    const save = () =>{props[`save${componentProperName}`](next)}
-    const store = () =>{props[`store${componentProperName}`](next)}
-    const {goBack} = props
-    const listCaption = `Ingrese datos de ${componentProperName}`
+  class ComponentEdit extends Component {
+    constructor(props) {
+      super(props)
+      this.state = JSON.parse(JSON.stringify(this.props[componentName]))
+      console.log('isValid?', this.state.isValid)
+      console.log('\n in constructor, props', this.props[componentName], 'state', this.state)
+      this.save = () =>{this.props[`save${componentProperName}`](this.state)}
+      this.store = () =>{this.props[`store${componentProperName}`](this.state)}
+      this.goBack = this.props.goBack
+    }
 
-    const listFields = fieldNames.map((fieldName)=>{
-      let label = fields[fieldName].label
-      if (!label || label === '') {
-	  label = fieldName
+    componentWillMount() {
+      console.log('\n in mount, props', this.props[componentName], 'state', this.state)
+      this.relations = {}
+      fieldNames.map((fieldName) =>{
+	const field = fields[fieldName]
+	const relation = field.relation
+	if (this.state[relation]) {this.state[relation]={}}
+	if (relation) {
+// 	  const relationProperName = relation[0].toUpperCase() + relation.substring(1)
+// 	  const saveRelation = this.props[`save${componentProperName}${relationProperName}`]
+	  if (this.state[`${relation}Selecting`]) {
+	    console.log(`${relation}Selecting`)
+	    const id = this.props[relation].uuid
+	    if (!this.state[relation]) {this.state[relation] = []}
+	    this.state[relation][id] = id
+	    delete this.state[`${relation}Selecting`]
+	    this.save()
+	  }
 	}
-      const componentField = compDef.fields[fieldName]
-      const fieldError = `${fieldName}Error`
-      let error = ''
-      if (next[fieldError]) {
-	error = <span>{next[fieldError]}</span>
-      }
-      if (fields[fieldName].relation) {
-	const relation = fields[fieldName].relation
-	const relationList = props[`${relation}List`]
-	const relationComponentDef = props[`${relation}ComponentDef`]
-	const relationProperName = relation[0].toUpperCase() + relation.substring(1)
-	const saveRelation = props[`save${componentProperName}${relationProperName}`]
-	const deleteRelation = props[`delete${componentProperName}${relationProperName}`]
-	const routes = `${relation}Routes`
-	const listRoute = props[routes][`${relation}List`]
+      })
+    }
+
+    componentDidMount() {}
+    shouldComponentUpdate() {
+      return true
+    }
+
+    componentWillReceiveProps() {
+//       this.state = JSON.parse(JSON.stringify(this.props[componentName]))
+//       console.log('receiveProps == isValid?', this.state.isValid)
+    }
+
+    componentWillUpdate() {
+      console.log('componentWillUpdate')
+    }
+    componentDidUpdate() {console.log('componentDidUpdate')}
 
-	if (next[relation]===undefined) {next[relation]=[]}
-	if (next[`${relation}Selecting`]) {
-	    saveRelation(props[relation].uuid)
-	  delete next[`${relation}Selecting`]
+    componentWillUnmount() {
+      this.save()
+    }
+
+    render() {
+      console.log('Render')
+      this.state = JSON.parse(JSON.stringify(this.props[componentName]))
+      console.log('in Update == isValid?', this.state.isValid)
+      const listCaption = `Ingrese datos de ${componentProperName}`
+      const listFields = fieldNames.map((fieldName)=>{
+	let label = fields[fieldName].label
+	if (!label || label === '') {
+	  label = fieldName
 	}
-	const ids = Object.keys(relationList)
-	const relListFields = ids.map(id => {
-	  const comp = relationList[id]
-	  let thisComp = []
-	  for (let key in comp) {
-	    thisComp.push(<div key={key}>{key}: {comp[key]}</div>)
-	  }
-	  return <div key={comp.uuid}>{thisComp}
-	  <Button icon='close' floating accent mini onClick={
-	    () =>{
-	      deleteRelation(comp.uuid)
+	const componentField = compDef.fields[fieldName]
+	const fieldError = `${fieldName}Error`
+	let error = []
+	console.log('errors', this.state[fieldError])
+	if (this.state[fieldError] && this.state[fieldError].length >0) {
+	  error = this.state[fieldError].map((err) =>{return <span key={err}>{err}</span>})
+	}
+	if (fields[fieldName].relation) {
+	  const relation = fields[fieldName].relation
+	  const relationList = this.props[`${relation}List`]
+//	  const relationComponentDef = this.props[`${relation}ComponentDef`]
+//	  const relationProperName = relation[0].toUpperCase() + relation.substring(1)
+//	  const saveRelation = this.props[`save${componentProperName}${relationProperName}`]
+//	  const deleteRelation = this.props[`delete${componentProperName}${relationProperName}`]
+	  const routes = `${relation}Routes`
+	  const listRoute = this.props[routes][`${relation}List`]
+	  let relListFields= []
+	  if (relation && this.state[relation]) {
+	    const ids = Object.keys(this.state[relation])
+	    if (ids.length > 0) {
+	       relListFields = ids.map(id => {
+		const comp = relationList[id]
+		let thisComp = []
+		for (let key in comp) {
+		  thisComp.push(<div key={key}>{key}: {comp[key]}</div>)
+		}
+		return <div key={comp.uuid}>{thisComp}
+		  <Button icon='close' floating accent mini onClick={
+		    () =>{
+		      delete this.state[relation][comp.uuid]
+		      this.save()
+		      //deleteRelation(comp.uuid)
+		    }
+		  }/>
+		  </div>
+	      })
 	    }
-	  }/>
-	  </div>
-	})
+	  }
+	  return <div key={fieldName}>
+	    <label>{relation}</label>
+	    <List>{relListFields}</List>
+	    <Button icon='add' onClick={() => {
+	      this.state[`${relation}Selecting`] = true
+	      this.props.pushRoute(listRoute)
+	    }}
+	    /></div>
+	}
 	return <div key={fieldName}>
-	  <label>{relation}</label>
-	  <List>{relListFields}</List>
-	  <Button icon='add' onClick={() => {
-	    next[`${relation}Selecting`] = true
-	    //save()
-	  props.pushRoute(listRoute)
-	}}
-	  /></div>
-      }
-      return <div key={fieldName}>
-	<Input value={next[fieldName] ||''}
-      type={componentField.uiType} label={label} name='name' icon={componentField.icon}
-      hint={componentField.hint}
-      onChange={(e) => {
-	next[fieldName] = e
-	save()
-      }}/>
-	{error}
-      </div>
-    })
-    return <div>
-      <ListSubHeader caption={listCaption}/>
-      {listFields}
-      <Button icon='done' floating disabled={!next.isValid} accent mini onClick={(e)=>{
-	store()
-	goBack()
-      }}/>
-      <Button icon='undo' floating accent mini onClick={()=>{goBack()}}/>
-      </div>
+	  <Input value={this.state[fieldName] ||''}
+	type={componentField.uiType} label={label} name='name' icon={componentField.icon}
+	hint={componentField.hint}
+	onChange={(e) => {
+	  this.state[fieldName] = e
+	  this.save()
+	}}/>
+	  {error}
+	</div>
+      })
+      return <div>
+	<ListSubHeader caption={listCaption}/>
+	{listFields}
+	<Button icon='done' floating disabled={!this.state.isValid} accent mini onClick={(e)=>{
+	  this.store()
+	  this.goBack()
+	}}/>
+	<Button icon='undo' floating accent mini onClick={()=>{this.goBack()}}/>
+	</div>
+    }
   }
+
   ComponentEdit.propTypes = propTypes
   ComponentEdit.propTypes[`${componentName}`] = PropTypes.object
   ComponentEdit.propTypes[`save${componentProperName}`] = PropTypes.func
diff --git a/src/list.js b/src/list.js
index a529660..bd02f6d 100644
--- a/src/list.js
+++ b/src/list.js
@@ -12,7 +12,7 @@ export default function (compDef) {
     const displayURL = `${url.slice(0, url.lastIndexOf('/')+1)}display`
     const editURL = `${url.slice(0, url.lastIndexOf('/')+1)}edit`
     const list = props[`${componentName}List`]
-    console.log('list', list)
+    //console.log('list', list)
     const ids = Object.keys(list)
     const Items = ids.map((id, index) =>{
       const item = list[id]
diff --git a/src/providers.js b/src/providers.js
index 5b02706..830d21a 100644
--- a/src/providers.js
+++ b/src/providers.js
@@ -17,16 +17,6 @@ export default function (compDef) {
   const componentDefinitionName = componentName + 'ComponentDef'
 
   let fieldNames = Object.keys(fields)
-
-  /*
-  const crudInit = {}
-  const crudErrorInit = {}
-  if (fieldNames.length > 0) {
-    for (let fieldName of fieldNames) {
-      crudInit[fieldName] = fields[fieldName].defaultValue
-      crudErrorInit[`${fieldName}Error`] = ''
-    }}
-  */
   const SELECT = `SELECT_${componentCapitalName}`
   const DESELECT = `DESELECT_${componentCapitalName}`
   const SAVE = `SAVE_${componentCapitalName}`
@@ -142,27 +132,30 @@ export default function (compDef) {
   reducers[componentName] = (state = {isValid: false}, action) =>{
     switch (action.type) {
     case SELECT: {
-      console.log('select', state, action)
       return action.component
     }
     case DESELECT: {
       return {}
     }
     case SAVE: {
-      const next = Object.assign({}, action.component)
+      //const next = Object.assign({}, action.component)
+      const next = JSON.parse(JSON.stringify(action.component))
       next.isValid = true
       for (let fieldName of fieldNames) {
 	const value = String(action.component[fieldName])
 	const validators = fields[fieldName].validate
 	if (validators && validators.length > 0) {
-	  let validatorPassed = true
+	  next.isValid= true
+	  next[`${fieldName}Error`] = []
 	  for (let validator of validators) {
 	    const valid = validator.func(value, validator.params)
 	    if (!valid) {
 	      next.isValid = false
-	      next[`${fieldName}Error`] = validator.message
+	      next[`${fieldName}Error`].push(validator.message)
 	    }
-	    else {delete next[`${fieldName}Error`]}
+	  }
+	  if (next.isValidm && next[`${fieldName}Error`]) {
+	    delete next[`${fieldName}Error`]
 	  }
 	}
       }
@@ -175,7 +168,7 @@ export default function (compDef) {
       }
       const next = Object.assign({}, state)
       next[fieldName] = Object.assign({}, state[fieldName])
-      console.log ('save', fieldName, id, next)
+//      console.log ('Reducer saveRelation', fieldName, id, next)
       if (next[fieldName] === undefined) {
 	next[fieldName] = {}
       }
@@ -185,7 +178,7 @@ export default function (compDef) {
     case DELETE_RELATION: {
       const next = Object.assign({}, state)
       const {fieldName, id} = action
-      console.log ('delete', fieldName, id, state)
+  //    console.log ('delete', fieldName, id, state)
       next[fieldName] = Object.assign({}, state[fieldName])
       delete next[fieldName][id]
       return next