[webserver]
192.168.204.70
192.168.204.71

[dbserver]
192.168.204.72
192.168.204.73
192.168.204.75

[proxy]
192.168.204.76
192.168.204.77
192.168.204.78

[test]
192.168.204.79
192.168.204.80

[haproxy]
192.168.205.82
192.168.204.83
 

import ConfigParser
import json
dict_result = {}
cf = ConfigParser.ConfigParser(allow_no_value=True)
cf.read('/etc/ansible/hosts.test')
secs = cf.sections()
for sec in secs:
 dict_result[sec] = cf.options(sec)
print json.dumps(dict_result)

#獲取ansible分組
@app.route('/web_test/ansible')
def web_test_ansible():
  dict_result = {}
  cf = ConfigParser.ConfigParser(allow_no_value=True)
  cf.read('/etc/ansible/hosts.test')
  secs = cf.sections()
  for sec in secs:
    dict_result[sec] = cf.options(sec)
  return json.dumps(dict_result)
 

<script src="/static/js/bootstrap-treeview.js"></script>
  <script type="text/javascript">
    $(document).ready(function () {

      $('#btn-get-hostgroup').click(function () {
        getAllCheck = $('#hostgrouptree').treeview('getChecked');
        for (var i = 0; i < getAllCheck.length; i++) {
          console.log(getAllCheck[i].text);
        }
      });


      $.ajax({
        url: '/web_test/ansible',
        type: 'GET',
        success: function (data) {
          result = JSON.parse(data);
          nodes = [];
          for (var hostgroup in result) {
            var nodeshostgroup = [];
            hosts = result[hostgroup];
            for (var i = 0; i < hosts.length; i++) {
              nodeshostgroup.push({text: hosts[i], selectable:false});
            }
            nodes.push({text: hostgroup, nodes: nodeshostgroup, selectable:false});
          }
          $('#hostgrouptree').treeview({data: [{text: 'all', nodes: nodes, selectable:false}], showCheckbox: true, showBorder:false});
        }
      });
    });
  </script>
{% endblock %}
{% block page_content %}

  <div class="col-md-4" id="hostgrouptree">

  </div>

  <div class="col-md-6">
    <button id="btn-get-hostgroup" type="button" class="btn btn-default">獲取選中的組</button>
  </div>