Freshdesk API (jquery fetch ticket example) ajax 调用后的可点击链接答案

【问题标题】：Freshdesk API (jquery fetch ticket example) clickable link after ajax callFreshdesk API (jquery fetch ticket example) ajax 调用后的可点击链接
【发布时间】：2017-05-30 18:26:14
【问题描述】：

下面的示例代码是 Freshdesk (https://github.com/freshdesk/fresh-samples) 提供的 jquery 示例。我插入我的 url 和 api 密钥，它就可以工作了。

我想对此进行自定义，以便在按下“读取”按钮时，输出的 json 对象数据是可点击的，特别是票证“主题”值。单击此按钮将关闭票证。

我不知道从哪里开始，最终只是想在 ajax 调用之后有一个可点击的值。关闭工单的点击操作将是我需要处理的另一件事。

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("button").click(
      function() {
        var yourdomain = 'yourdomain'; // Your freshdesk domain name. Ex., yourcompany
        var api_key = 'API_KEY'; // Ref: https://support.freshdesk.com/support/solutions/articles/215517-how-to-find-your-api-key
        $.ajax(
          {
            url: "https://"+yourdomain+".freshdesk.com/api/v2/tickets",
            type: 'GET',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            headers: {
              "Authorization": "Basic " + btoa(api_key + ":x")
            },
            success: function(data, textStatus, jqXHR) {
              $('#result').text('Success');
              $('#code').text(jqXHR.status);
              $('#response').html(JSON.stringify(data, null, "<br/>"));
            },
            error: function(jqXHR, tranStatus) {
              $('#result').text('Error');
              $('#code').text(jqXHR.status);
              x_request_id = jqXHR.getResponseHeader('X-Request-Id');
              response_text = jqXHR.responseText;
              $('#response').html(" Error Message : <b style='color: red'>"+response_text+"</b>.<br/> Your X-Request-Id is : <b>" + x_request_id + "</b>. Please contact support@freshdesk.com with this id for more information.");
            }
          }
        );
      }
    );
});
</script>
</head>
<body>

<button>Read</button>
<br/></br>
<table cellspacing = '10'>
  <tr>
    <td> <b>Result</b></td>
    <td> <div id = 'result'></div> </td>
  </tr>
  <tr>
    <td> <b>Code</b></td>
    <td> <div id = 'code'></div> </td>
  </tr>
  <tr>
    <td> <b>Response</b></td>
    <td> <div id = 'response'></div> </td>
  </tr>
</table>
</body>
</html>

【问题讨论】：

标签： jquery ajax freshdesk

【解决方案1】：

回复有点晚。

我已经用这个例子构建了很多东西这应该会有所帮助

<!DOCTYPE html>
<html>
<head>
<script 
src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(
  function() {
    var yourdomain = 'yourdomain'; // Your freshdesk domain name. Ex., yourcompany
    var api_key = 'API_KEY'; // Ref: https://support.freshdesk.com/support/solutions/articles/215517-how-to-find-your-api-key
    $.ajax(
      {
        url: "https://"+yourdomain+".freshdesk.com/api/v2/tickets",
        type: 'GET',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        headers: {
          "Authorization": "Basic " + btoa(api_key + ":x")
        },
        success: function(data, textStatus, jqXHR) {
          $('#result').text('Success');
          $('#code').text(jqXHR.status);
      //Removed the standard response
      //converted the response to JSON
    var jsonText = JSON.stringify(data);
            var obj = data;

            var tbl=$("<table/>").attr('id','mytable');
            $('#response').append(tbl);
    //added a table element and then looped through each subject and added it as a seperate div that cals the closure function

    for(var i=0;i<obj.length;i++){
    var td1="<div id='"+obj[i].subject+"' onclick='CloseTicket()'>Subject: "+obj[i].subject+"<br></div>";
    $('#mytable').append(td1);
     }


        },
        error: function(jqXHR, tranStatus) {
          $('#result').text('Error');
          $('#code').text(jqXHR.status);
          x_request_id = jqXHR.getResponseHeader('X-Request-Id');
          response_text = jqXHR.responseText;
          $('#response').html(" Error Message : <b style='color: red'>"+response_text+"</b>.<br/> Your X-Request-Id is : <b>" + x_request_id + "</b>. Please contact support@freshdesk.com with this id for more information.");
        }
      }
    );
  }
);
});

function CloseTicket() {
alert('delete me');
//To test closure function would work
//IRL this would be an update Ticket Call that includeds the ticket id
}
</script>
</head>
<body>

<button>Read</button>
<br/></br>
<table cellspacing = '10'>
 <tr>
    <td> <b>Result</b></td>
   <td> <div id = 'result'></div> </td>
  </tr>
  <tr>
    <td> <b>Code</b></td>
    <td> <div id = 'code'></div> </td>
  </tr>
 <tr>
    <td> <b>Response</b></td>
   <td> <div id = 'response'></div> </td>
  </tr>
</table>
</body>
</html>

【讨论】：