我正在尝试为Zendesk创建html应用

时间:2018-06-20 09:49:44

标签: javascript html json

我在为Zendesk套装创建应用程序时遇到了问题,到目前为止,我已经获得了一张表格,其中包含发布票证的用户的信息,但是当我尝试获取组织名称时,只是将应用程序作为一个整体列出一片空白,有什么想法吗?

这是Zendesk中的一个应用程序,我们当前正在通过本地服务器(通过ruby)运行它。该程序的想法是,它从两个都有API的单独服务(zendesk和Assetpanda)中获取两段数据,然后我们试图从zendesk中获取组织名称,以便可以将其插入AssetPanda API中搜索某些资产,但是我们面临的问题是,我们似乎无法在Iframe.html页面(充当应用程序的前端)的表中获取组织名称

iframe.html
    <html>
    <head>
      <meta charset="utf-8">
      <link href="https://cdn.jsdelivr.net/bootstrap/2.3.2/css/bootstrap.min.css" rel="stylesheet">
      <link href="main.css" rel="stylesheet">
    </head>
    <body>

      <div id="content"></div>

      <footer>
        <a href="https://mysite.github.io/support" target="_blank">Report bugs</a>
      </footer>

      <script id="requester-template" type="text/x-handlebars-template">
        <table>
        <tr>
          <td>Customer:</td>
          <td class="data">{{name}}</td>
        </tr>
        {{#if tags}}
        <tr>
          <td>Tags:</td>
          <td class="data">{{#each tags}}{{this}} {{/each}}</td>
        </tr>
        {{/if}}
        <tr>
          <td>Added:</td>
          <td class="data">{{created_at}}</td>
        </tr>
        <tr>
          <td>Last signed in:</td>
          <td class="data">{{last_login_at}}</td>
        </tr>
        <tr>
        </table>


      <script id="orgNameReq" type="text/x-handlebars-template">
      <table>
      <tr>
        <td>Test</td>
        <td class="data">{{name}}</td>



      </script>

      <script id="error-template" type="text/x-handlebars-template">
        <p>{{status}} - {{statusText}} error. Please report a bug at the link below.</p>
      </script>

      <script src="https://cdn.jsdelivr.net/handlebarsjs/4.0.8/handlebars.min.js"></script>
      <script src="https://cdn.jsdelivr.net/jquery/3.2.1/jquery.min.js"></script>
      <script type="text/javascript" src="https://assets.zendesk.com/apps/sdk/2.0/zaf_sdk.js"></script>
      <script type="text/javascript" src="main.js"></script>
    </body>

    </html>

然后这是main.js代码

$(function() {
          var client = ZAFClient.init();
          client.invoke('resize', { width: '100%', height: '120px' });
          client.get('ticket.requester.id').then(
          function(data) {
            var user_id = data['ticket.requester.id'];
                requestUserInfo(client, user_id);
          }
          );
        });

        function requestUserInfo(client, id) {
          var settings = {
            url: '/api/v2/users/' + id + '.json',
            type:'GET',
            dataType: 'json',

          var orgName = {
            url: '/api/v2/organizations' + id + '.json'
            type 'GET',
            dataType: 'json',
          }
          };

          client.request(settings).then(
            function(data) {
              showInfo(data);
            },
            function(response) {
              showError(response);
            }
          );
        }




        function showInfo(data) {
          var requester_data = {
            'name': data.user.name,
            'tags': data.user.tags,
            'created_at': formatDate(data.user.created_at),
            'last_login_at': formatDate(data.user.last_login_at),
            'organizations': name
          };
          var source = $("#requester-template").html();
          var template = Handlebars.compile(source);
          var html = template(requester_data);
          $("#content").html(html);
          var source = $("#orgNameReq").html();
        }

        function showError(response) {
          var error_data = {
            'status': response.status,
            'statusText': response.statusText
          };
          var source = $("#error-template").html();
          var template = Handlebars.compile(source);
          var html = template(error_data);
          $("#content").html(html);
        }

        function formatDate(date) {
          var cdate = new Date(date);
          var options = {
            year: "numeric",
            month: "short",
            day: "numeric"
          };
          date = cdate.toLocaleDateString("en-us", options);
          return date;
        }

    $(function() {
      var client = ZAFClient.init();
      client.invoke('resize', { width: '100%', height: '120px' });
      client.get('ticket.requester.id').then(
      function(data) {
        var user_id = data['ticket.requester.id'];
            requestUserInfo(client, user_id);
      }
      );
    });

    function requestUserInfo(client, id) {
      var settings = {
        url: '/api/v2/users/' + id + '.json',
        type:'GET',
        dataType: 'json',

      var orgName = {
        url: '/api/v2/organizations' + id + '.json'
        type 'GET',
        dataType: 'json',
      }
      };

      client.request(settings).then(
        function(data) {
          showInfo(data);
        },
        function(response) {
          showError(response);
        }
      );
    }




    function showInfo(data) {
      var requester_data = {
        'name': data.user.name,
        'tags': data.user.tags,
        'created_at': formatDate(data.user.created_at),
        'last_login_at': formatDate(data.user.last_login_at),
        'organizations': name
      };
      var source = $("#requester-template").html();
      var template = Handlebars.compile(source);
      var html = template(requester_data);
      $("#content").html(html);
      var source = $("#orgNameReq").html();
    }

    function showError(response) {
      var error_data = {
        'status': response.status,
        'statusText': response.statusText
      };
      var source = $("#error-template").html();
      var template = Handlebars.compile(source);
      var html = template(error_data);
      $("#content").html(html);
    }

    function formatDate(date) {
      var cdate = new Date(date);
      var options = {
        year: "numeric",
        month: "short",
        day: "numeric"
      };
      date = cdate.toLocaleDateString("en-us", options);
      return date;
    }

0 个答案:

没有答案