TryReact

diff --git a/TryReact/TryReact/Controllers/ReactController.cs b/TryReact/TryReact/Controllers/ReactController.cs
index 8733821..5a28cab 100644
--- a/TryReact/TryReact/Controllers/ReactController.cs
+++ b/TryReact/TryReact/Controllers/ReactController.cs
@@ -53,5 +53,10 @@ namespace TryReact.Controllers
             return View();
         }
 
+        public ActionResult Test6_ParentChild()
+        {
+            return View();
+        }
+
     }
 }
\ No newline at end of file

diff --git a/TryReact/TryReact/TryReact.csproj b/TryReact/TryReact/TryReact.csproj
index 688357c..fca8e5b 100644
--- a/TryReact/TryReact/TryReact.csproj
+++ b/TryReact/TryReact/TryReact.csproj
@@ -214,6 +214,7 @@
     <Content Include="Views\React\Test5_Event.cshtml" />
     <Content Include="Views\ReactCRUD\Index.cshtml" />
     <Content Include="Views\Home\Test.cshtml" />
+    <Content Include="Views\React\Test6_ParentChild.cshtml" />
   </ItemGroup>
   <ItemGroup>
     <Folder Include="App_Data\" />

diff --git a/TryReact/TryReact/TryReact.csproj.user b/TryReact/TryReact/TryReact.csproj.user
index fb6311a..a5d62ef 100644
--- a/TryReact/TryReact/TryReact.csproj.user
+++ b/TryReact/TryReact/TryReact.csproj.user
@@ -8,7 +8,7 @@
     <IISExpressWindowsAuthentication />
     <IISExpressUseClassicPipelineMode />
     <UseGlobalApplicationHostFile />
-    <LastActiveSolutionConfig>Release|Any CPU</LastActiveSolutionConfig>
+    <LastActiveSolutionConfig>Debug|Any CPU</LastActiveSolutionConfig>
     <Controller_SelectedScaffolderID>MvcControllerEmptyScaffolder</Controller_SelectedScaffolderID>
     <Controller_SelectedScaffolderCategoryPath>root/Controller</Controller_SelectedScaffolderCategoryPath>
     <WebStackScaffolding_ControllerDialogWidth>600</WebStackScaffolding_ControllerDialogWidth>

diff --git a/TryReact/TryReact/Views/React/Test6_ParentChild.cshtml b/TryReact/TryReact/Views/React/Test6_ParentChild.cshtml
new file mode 100644
index 0000000..2b7604b
--- /dev/null
+++ b/TryReact/TryReact/Views/React/Test6_ParentChild.cshtml
@@ -0,0 +1,125 @@
+
+@{
+    ViewBag.Title = "Test6_ParentChild";
+}
+
+<h2>Test6_ParentChild</h2>
+<div id="app"> </div>
+
+
+<script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
+<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.25.0/babel.min.js"></script>
+
+<script type="text/babel">
+
+class ChildComponent extends React.Component{
+    
+    constructor(props){
+        super(props);
+
+        this.state = {color: "red"};
+
+        this.OnClick = this.OnClick.bind(this);
+        this.SetButtonState = this.SetButtonState.bind(this);
+
+        this.props.OnCreate(this);
+    }
+
+    componentWillUnmount(){
+        this.props.OnDestroy(this);
+    }
+
+    
+    OnClick(event){
+        this.props.OnClick(this, event);
+    }    
+
+    SetButtonState(state){
+        let color = "";
+        
+        if (state === 1)
+            color = "green";
+        else
+            color = "red";
+
+        this.setState({color: color});
+    }
+
+    render(){
+        return (<p>
+            <button onClick={this.OnClick} style={{backgroundColor: this.state.color}}>elem id: {this.props.id}</button>
+        </p>
+        );
+    }    
+}
+
+class ParentComponent extends React.Component{
+    
+    constructor(props){
+        super(props);
+
+        this.state = { Text: "NoText", data: [{id: 10}, {id: 11}, {id: 12}]};
+        this.childs = [];
+
+        this.OnChildClick = this.OnChildClick.bind(this);     
+        this.OnChildCreate = this.OnChildCreate.bind(this);
+        this.OnChildDestroy = this.OnChildDestroy.bind(this);
+    }
+
+    OnChildCreate(child){
+        this.childs.push(child);
+    }
+    OnChildDestroy(child){
+        delete this.state.childs[child.id];
+    }
+
+    OnChildClick(child, event){
+        console.log(child);
+        console.log(event);
+
+        var text = "Click to " + child.props.id;
+
+        this.childs.map(function(elem)
+        {
+            elem.SetButtonState(0);
+        });
+        child.SetButtonState(1);
+
+        this.setState({Text: text});
+    }
+
+    render(){
+        return(
+        <div>
+        <p>{this.state.Text}</p>
+            
+            <table>
+                <tr>
+                    <th>row numb</th>
+                    <th></th>
+                </tr>
+
+            {
+                this.state.data.map(function(elem, index, array){
+                    return (
+                    <tr>
+                        <td>{index}</td>
+                        <td><ChildComponent id={elem.id} OnClick={this.OnChildClick} OnCreate={this.OnChildCreate} OnDestroy={this.OnChildDestroy}  /></td>
+                    </tr>
+                    )
+                }.bind(this))
+            }
+            </table>
+
+        </div>
+        );
+    }
+
+}
+ 
+ReactDOM.render(
+    <ParentComponent />,
+    document.getElementById("app")
+)
+</script>
\ No newline at end of file

diff --git a/TryReact/TryReact/Views/ReactCRUD/Index.cshtml b/TryReact/TryReact/Views/ReactCRUD/Index.cshtml
index bdccc1d..5bf0d3c 100644
--- a/TryReact/TryReact/Views/ReactCRUD/Index.cshtml
+++ b/TryReact/TryReact/Views/ReactCRUD/Index.cshtml
@@ -72,9 +72,6 @@
         dataType: "json"
      });
     }
-    @*SaveSuccess(data){
-            this.Load();
-        }*@
 
 
     OnAdd(){
@@ -121,22 +118,20 @@
                 <th></th>
             </tr>
 
-            {data.map(function( elem, i, arr )
-            {
-            if (elem.State != 3)
             {
-            return [
-            <tr>
-                <td>{elem.ID}</td>
-                <td><input id={i} type="text" value={elem.Name} onChange={this.OnChange} /></td>
-                <td><button id={i} onClick={this.OnRemove}>Удалить</button></td>
-            </tr>
-            ];
-            }
-            else
-            return "";
-            }.bind(this)
-            )
+                data.map(function( elem, i, arr ){
+                    if (elem.State != 3){
+                        return [
+                        <tr>
+                            <td>{elem.ID}</td>
+                            <td><input id={i} type="text" value={elem.Name} onChange={this.OnChange} /></td>
+                            <td><button id={i} onClick={this.OnRemove}>Удалить</button></td>
+                        </tr>
+                        ];
+                    }
+                    else
+                        return "";
+                }.bind(this))
             }
             @*<div key={i}>{component}</div>)}*@
         </table>

diff --git a/TryReact/TryReact/Views/Shared/_Layout.cshtml b/TryReact/TryReact/Views/Shared/_Layout.cshtml
index 1cab996..01abe85 100644
--- a/TryReact/TryReact/Views/Shared/_Layout.cshtml
+++ b/TryReact/TryReact/Views/Shared/_Layout.cshtml
@@ -32,7 +32,8 @@
                             @Html.ActionLink("Test2_Components", "Test2_Components", "React", null, new { @class = "dropdown-item" })
                             @Html.ActionLink("Test3_Props", "Test3_Props", "React", new { s1 = "I'm work1", s2 = "I'm work2" }, new { @class = "dropdown-item" })
                             @Html.ActionLink("Test4_State", "Test4_State", "React", null, new { @class = "dropdown-item" })
-                            @Html.ActionLink("Test5_Event", "Test5_Event", "React", null, new { @class = "dropdown-item" })                           
+                            @Html.ActionLink("Test5_Event", "Test5_Event", "React", null, new { @class = "dropdown-item" })
+                            @Html.ActionLink("Test6_ParentChild", "Test6_ParentChild", "React", null, new { @class = "dropdown-item" })
 
                         </div>
                     </li>