The for...in loop

by Sebastian Kay

HTML

<link rel="stylesheet" href="https://bootswatch.com/darkly/bootstrap.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery.perfect-scrollbar/0.8.1/css/perfect-scrollbar.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jScrollPane/2.0.23/style/jquery.jscrollpane.min.css">
<link rel="stylesheet" href="https://bootswatch.com/assets/css/custom.min.css">
<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="https://bootswatch.com/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/1.7.1/clipboard.min.js"></script>
<script src="https://bootswatch.com/assets/js/custom.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/mustache.js/2.3.0/mustache.min.js"></script>
<h2>Example 3 : array of name/value objects</h2>

<div id="output"></div>

<script type="text/html" id="test3">
  {{#data}}
  <div class="list-group-item">
    <div class="input-group">
      <input type="text" class="form-control" aria-label="..." value="{{name}}" disabled>
      <div class="input-group-btn">
        <button class="btn btn-success clip" data-clipboard-text="{{ip}}" data-tooltip="tooltip" data-placement="top" title="kopiert ServerIP in die Zwischenablage (STRG+C)"><span class="glyphicon glyphicon-copy" aria-hidden="true"></span></button>
        <button class="btn btn-info" onclick="window.open('https://www.dayzspy.com/server/{{ip}}')" data-tooltip="tooltip" data-placement="top" title="Server Info öffnen im neuen Fenster"><span class="glyphicon glyphicon-log-out" aria-hidden="true"></span></button>
        <button class="btn btn-warning" data-toggle="modal" data-target="#Modal-{{id}}" data-tooltip="tooltip" data-placement="top" title="Server Info öffnen im Modal"><span class="glyphicon glyphicon-new-window" aria-hidden="true"></span></button>
      </div>
    </div>
  </div>
		<div id="Modal-{{id}}" class="modal fade"...

JavaScript

$(document).ready(function() {
  var output = $("#output");
  var template = $("#test3").html();

  //test 3
  var data3 = {
    data: [{
    	id: "1",
      ip: "198.12.77.50:2302",
      name: "DayZ Standalone Server"
    }, {
    	id: "2",
      ip: "198.12.77.50:2302",
      name: "DayZ Standalone Server"
    }, {
    	id: "3",
      ip: "198.12.77.50:2302",
      name: "DayZ Standalone Server"
    }]
  };

  html = Mustache.render(template, data3);
  output.append(html);
});

new Clipboard('.clip');