Q:

need help with Legend in ArcGis JS Api 3.4

I've been told to write up a small site which displays data from our ArcGis server.  As a first time user of the ArcGis Api I instantly ran into a serious problem. 
I am creating a map with a datagrid below just like in this code sample.  Afterwards I want to implement a legend on the right hand side, but the div-container stays empty and does not display a legend.  Following the code sample for the stand alone legend it works just fine. 
Besides this crucial problem, there is a minor question which popped up while trying to solve this issue:
I am using dojo.require() und require() alongside.  Eliminating dojo.require() or require() results in js.  errors in my code. 
Please point me to my errors and tell me where I went wrong. 
Thanky you in advance
Code: 
<! DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Map with a Dojo dGrid</title>

  <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.4/js/dojo/dojo/resources/dojo.css">
  <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.4/js/dgrid/css/dgrid.css">
  <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.4/js/dgrid/css/skins/tundra.css">
  <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.4/js/dojo/dijit/themes/tundra/tundra.css">
  <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.4/js/esri/css/esri.css">
  <style>
    html, body { 
      height: 100%; 
      width: 100%; 
      margin: 0; 
      padding: 0; 
      overflow: hidden;
    }
    #container { 
      height: 100%; 
      visibility: hidden;
    }
    #bottomPane { height: 200px; }
    #grid { height: 100%; }
    .dgrid { border: none; }
    .field-id { cursor: pointer; }

    #rightPane{
        width:20%;
      }
      #legendPane{
        border: solid #97DCF2 1px;
      }
  </style>

  <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/3.4/"></script>
  <script type="text/javascript">
      dojo.require("dijit.layout. BorderContainer");
      dojo.require("dijit.layout. ContentPane");
      dojo.require("dijit.layout. AccordionContainer");
      dojo.require("esri.map");
      dojo.require("esri.dijit. Legend");
      dojo.require("esri.layers. FeatureLayer");
      // dojo's layout dijits and the parser to auto-create the dijits

      // bring in dgrid, esri and dojo modules
      // create the grid and the map
      // then parse the dijit layout dijits
      require(["dgrid/OnDemandGrid", "dgrid/Selection", "dojo/store/Memory", "esri/map", "esri/layers/FeatureLayer", "dojo/_base/declare", "dojo/number", "dojo/parser", "dojo/domReady!"], 
      function (Grid, Selection, Memory, Map, FeatureLayer, declare, dojoNum, parser) {
          // call the parser to create the dijit layout dijits
          parser.parse();

          // create the dgrid
          window.grid = new (declare([Grid, Selection]))({
              // use Infinity so that all data is available in the grid
              bufferRows: Infinity,
              columns: {
                  "id": "OBJECTID",
                  "hochwert": "HOCHWERT",
                  "schadennr": "SchadenNr",
                  "status": "Status"
              }
          }, "grid");
          // add a click listener on the ID column
          grid.on(".field-id:click", selectItem);

          window.map = new esri. Map("map", {
              basemap: "gray",
              center: [12.8, 51],
              zoom: 9
          });
          window. HWSUrl = "http://herellbedragons/ArcGIS/rest/services/hwstest/MapServer/2";
          window.outFields = ["OBJECTID", "something", "damagenr", "STATUS"];
          var fl = new FeatureLayer(window. HWSUrl, {
              id: "schaden",
              mode: esri.layers. FeatureLayer. MODE_ONDEMAND,
              outFields: window.outFields
          });
          dojo.connect(fl, "onLoad", function (fl) {
              fl.maxScale = 0; // show the states layer at all scales
              fl.setSelectionSymbol(new esri.symbol. SimpleFillSymbol().setOutline(null).setColor("#AEC7E3"));
          });
          //add the legend

          dojo.connect(map, "onLoad", function (map) {
              // show the border container now that the dijits 
              // are rendered and the map has loaded
              dojo.style(dijit.byId("container").domNode, "visibility", "visible");
              populateGrid(Memory); // pass a reference to the MemoryStore constructor
          });

          //add the legend
          dojo.connect(map, 'onLayersAddResult', function (results) {
              var layerInfo = dojo.map(results, function (layer, index) {
                  return { layer: layer.layer, title: layer.layer.name };
              });
              if (layerInfo.length > 0) {
                  var legendDijit = new esri.dijit. Legend({
                      map: map,
                      layerInfos: layerInfo
                  }, "legendDiv");
                  legendDijit.startup();
              }
          });

          dojo.connect(fl, "onClick", selectGrid);
          map.addLayer(fl);
      }
    );

      function addLegend(results) {
          var layerInfo = dojo.map(results, function (layer, index) {
              return { layer: layer.layer, title: layer.layer.name };
          });
          if (layerInfo.length > 0) {
              var legendDijit = new esri.dijit. Legend({
                map: map,
                layerInfos: layerInfo
              }, "legendDiv");
          }
      }

      function populateGrid(Memory) {
          var qt = new esri.tasks. QueryTask(window. HWSUrl);
          var query = new esri.tasks. Query();
          query.where = "1=1";
          query.returnGeometry = false;
          query.outFields = window.outFields;
          qt.execute(query, function (results) {
              var data = dojo.map(results.features, function (feature) {
                  return {
                      // property names used here match those used when creating the dgrid
                      "id": feature.attributes[window.outFields[0]],
                      "hochwert": feature.attributes[window.outFields[1]],
                      "schadennr": feature.attributes[window.outFields[2]],
                      "status": feature.attributes[window.outFields[3]]
                  }
              });
              var memStore = new Memory({ data: data });
              window.grid.set("store", memStore);
          });
      }

      // fires when a row in the dgrid is clicked
      function selectItem(e) {
          // select the feature
          var fl = map.getLayer("schaden");
          var query = new esri.tasks. Query();
          query.objectIds = [parseInt(e.target.innerHTML)];
          fl.selectFeatures(query, esri.layers. FeatureLayer. SELECTION_NEW, function (result) {
              if (result.length) {
                  // re-center the map to the selected feature
                  window.map.centerAt(result[0].geometry.getExtent().getCenter());
              } else {
                  console.log("Feature Layer query returned no features... ", result);
              }
          });
      }

      // fires when a feature on the map is clicked
      function selectGrid(e) {
          var id = e.graphic.attributes. OBJECTID;
          // select the feature that was clicked
          var query = new esri.tasks. Query();
          query.objectIds = [id];
          var states = map.getLayer("schaden");
          states.selectFeatures(query, esri.layers. FeatureLayer. SELECTION_NEW);
          // select the corresponding row in the grid
          // and make sure it is in view
          grid.clearSelection();
          grid.select(id);
          grid.row(id).element.scrollIntoView();
      }
  </script>
</head>

<body class="tundra">
  <div id="container" data-dojo-type="dijit.layout. BorderContainer" data-dojo-props="design: 'headline', gutters: false">
     <div id="rightPane" 
           data-dojo-type="dijit.layout. ContentPane" 
           data-dojo-props="region:'right'">

        <div data-dojo-type="dijit.layout. AccordionContainer">
          <div data-dojo-type="dijit.layout. ContentPane" id="legendPane" 
               data-dojo-props="title:'Legend', selected:true">
            <div id="legendDiv"></div>
          </div>
          <div data-dojo-type="dijit.layout. ContentPane" 
               data-dojo-props="title:'Pane 2'">
            This pane could contain tools or additional content
          </div>
        </div>
      </div>
    <div id="map" data-dojo-type="dijit.layout. ContentPane" data-dojo-props="region: 'center'"></div>
    <div id="bottomPane" data-dojo-type="dijit.layout. ContentPane" data-dojo-props="region: 'bottom'"> <div id="grid"></div>
    </div>
  </div>
</body>
</html>

A:

The legend was not being created in the code you posted because you set up an event listener for onLayer*s*AddResult but you're adding layers with addLayer.  For onLayersAddResult to fire, you need to use map.addLayer*s*. 
Regarding require() vs. dojo.require(), you can technically use both at the same time but I would pick one or the other.  Otherwise, your code is unnecessarily complex (and ugly).  I made some additional changes to use local module references instead of global dojo.*  but didn't change them all. 
<! DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Map with a Dojo dGrid</title>

  <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.4/js/dojo/dojo/resources/dojo.css">
  <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.4/js/dgrid/css/dgrid.css">
  <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.4/js/dgrid/css/skins/tundra.css">
  <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.4/js/dojo/dijit/themes/tundra/tundra.css">
  <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.4/js/esri/css/esri.css">
  <style>
    html, body { 
      height: 100%; 
      width: 100%; 
      margin: 0; 
      padding: 0; 
      overflow: hidden;
    }
    #container { 
      height: 100%; 
      visibility: hidden;
    }
    #bottomPane { height: 200px; }
    #grid { height: 100%; }
    .dgrid { border: none; }
    .field-id { cursor: pointer; }

    #rightPane{
        width:20%;
      }
      #legendPane{
        border: solid #97DCF2 1px;
      }
  </style>

  <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/3.4/"></script>
  <script type="text/javascript">
      dojo.require("dijit.layout. BorderContainer");
      dojo.require("dijit.layout. ContentPane");
      dojo.require("dijit.layout. AccordionContainer");
      dojo.require("esri.map");
      dojo.require("esri.dijit. Legend");
      dojo.require("esri.layers. FeatureLayer");
      // dojo's layout dijits and the parser to auto-create the dijits

      // bring in dgrid, esri and dojo modules
      // create the grid and the map
      // then parse the dijit layout dijits
      require([
        "dgrid/OnDemandGrid", "dgrid/Selection", "dojo/store/Memory", 
        "esri/map", "esri/layers/FeatureLayer", 
        "dojo/_base/declare", "dojo/_base/array", "dojo/_base/connect", "dojo/number", "dojo/parser",
        "dojo/domReady!" 
      ], function (Grid, Selection, Memory, Map, FeatureLayer, declare, arrayUtils, connect, dojoNum, parser) {
          // call the parser to create the dijit layout dijits
          parser.parse();

          // create the dgrid
          window.grid = new (declare([Grid, Selection]))({
              // use Infinity so that all data is available in the grid
              bufferRows: Infinity,
              columns: {
                  "id": "OBJECTID",
                  "hochwert": "HOCHWERT",
                  "schadennr": "SchadenNr",
                  "status": "Status"
              }
          }, "grid");
          // add a click listener on the ID column
          grid.on(".field-id:click", selectItem);

          window.map = new Map("map", {
              basemap: "gray",
              center: [-100, 40],
              zoom:5 
          });
          window. HWSUrl = "http://server.arcgisonline.com/ArcGIS/rest/services/Demographics/USA_Median_Net_Worth/MapServer/4";
          window.outFields = ["OBJECTID", "NAME", "MEDNW_CY", "NW1M_CY"];
          var fl = new FeatureLayer(window. HWSUrl, {
              id: "schaden",
              mode: esri.layers. FeatureLayer. MODE_ONDEMAND,
              outFields: window.outFields
          });
          connect.connect(fl, "onLoad", function (fl) {
              fl.maxScale = 0; // show the states layer at all scales
              fl.setSelectionSymbol(new esri.symbol. SimpleFillSymbol().setOutline(null).setColor("#AEC7E3"));
          });
          connect.connect(map, "onLoad", function (map) {
              // show the border container now that the dijits 
              // are rendered and the map has loaded
              dojo.style(dijit.byId("container").domNode, "visibility", "visible");
              populateGrid(Memory); // pass a reference to the MemoryStore constructor
          });

          //add the legend
          var layerAdd = connect.connect(map, 'onLayersAddResult', function (results) {
              connect.disconnect(layerAdd);
              var layerInfos = arrayUtils.map(results, function(r) {
                return { layer: r.layer, title: r.layer.name };
              });
              var legendDijit = new esri.dijit. Legend({
                  map: map,
                  layerInfos: layerInfos
              }, "legendDiv");
              legendDijit.startup();
          });

          connect.connect(fl, "onClick", selectGrid);
          map.addLayers([fl]);
      }
    );

      function populateGrid(Memory) {
          var qt = new esri.tasks. QueryTask(window. HWSUrl);
          var query = new esri.tasks. Query();
          query.where = "1=1";
          query.returnGeometry = false;
          query.outFields = window.outFields;
          qt.execute(query, function (results) {
              var data = dojo.map(results.features, function (feature) {
                  return {
                      // property names used here match those used when creating the dgrid
                      "id": feature.attributes[window.outFields[0]],
                      "hochwert": feature.attributes[window.outFields[1]],
                      "schadennr": feature.attributes[window.outFields[2]],
                      "status": feature.attributes[window.outFields[3]]
                  }
              });
              var memStore = new Memory({ data: data });
              window.grid.set("store", memStore);
          });
      }

      // fires when a row in the dgrid is clicked
      function selectItem(e) {
          // select the feature
          var fl = map.getLayer("schaden");
          var query = new esri.tasks. Query();
          query.objectIds = [parseInt(e.target.innerHTML)];
          fl.selectFeatures(query, esri.layers. FeatureLayer. SELECTION_NEW, function (result) {
              if (result.length) {
                  // re-center the map to the selected feature
                  window.map.centerAt(result[0].geometry.getExtent().getCenter());
              } else {
                  console.log("Feature Layer query returned no features... ", result);
              }
          });
      }

      // fires when a feature on the map is clicked
      function selectGrid(e) {
          var id = e.graphic.attributes. OBJECTID;
          // select the feature that was clicked
          var query = new esri.tasks. Query();
          query.objectIds = [id];
          var states = map.getLayer("schaden");
          states.selectFeatures(query, esri.layers. FeatureLayer. SELECTION_NEW);
          // select the corresponding row in the grid
          // and make sure it is in view
          grid.clearSelection();
          grid.select(id);
          grid.row(id).element.scrollIntoView();
      }
  </script>
</head>

<body class="tundra">
  <div id="container" data-dojo-type="dijit.layout. BorderContainer" data-dojo-props="design: 'headline', gutters: false">
     <div id="rightPane" 
           data-dojo-type="dijit.layout. ContentPane" 
           data-dojo-props="region:'right'">

        <div data-dojo-type="dijit.layout. AccordionContainer">
          <div data-dojo-type="dijit.layout. ContentPane" id="legendPane" 
               data-dojo-props="title:'Legend', selected:true">
            <div id="legendDiv"></div>
          </div>
          <div data-dojo-type="dijit.layout. ContentPane" 
               data-dojo-props="title:'Pane 2'">
            This pane could contain tools or additional content
          </div>
        </div>
      </div>
    <div id="map" data-dojo-type="dijit.layout. ContentPane" data-dojo-props="region: 'center'"></div>
    <div id="bottomPane" data-dojo-type="dijit.layout. ContentPane" data-dojo-props="region: 'bottom'"> <div id="grid"></div>
    </div>
  </div>
</body>
</html>

