How to use ticket id in custom app

[Esther_Itolima]

Hello everyone,

Please am trying to use update ticket api in my custom app but I don’t seem to understand how I can use the ticket-id . I have tried using the dynamic placeholder but is not work. Please I need assistance with this.

[Anish]

Hi @Esther_Itolima ,

Greetings!

Could you please let me know when you require an update on the ticket?

In Freshdesk, there are various product events. Whenever one of these events is triggered, you will receive the ticket data related to that particular event, including the ticket ID.

Since you need to configure the necessary events in your serverless application, I’ll share a list of product events below. This will help you determine which trigger necessitates the ticket update action for your case.

https://developers.freshworks.com/docs/app-sdk/v2.3/freshdesk/serverless-apps/product-events/

Hope this helps…

[Esther_Itolima]

Thanks for your response.

I’m using a client app with just HTML, CSs and JavaScript. The custom app(a simple search input field) is in the ticket_requester_info.

When you search, it send a request to an external api to get some data and I want to update(
https://domain.freshdesk.com/api/v2/tickets/[id])
the ticket with the data gotten from the external api request.

So my question is how do I get the ticket id and how will use the placeholder in the update api ?

[Anish]

Hi @Esther_Itolima ,

Greetings!

If it’s a front-end (client-side) app, you can use the data methods to fetch the current ticket data by implementing the below function in your code.

async function getTicketDetails() {
  try {
    const data = await client.data.get("ticket");
    // success output
    // data is {ticket: {"subject": "support needed for..",..}}
    console.log(data);
  } catch (error) {
    // failure operation
    console.log(error);
  }
}

getTicketDetails();

Kindly find the below link for more details

https://developers.freshworks.com/docs/app-sdk/v2.3/freshdesk/front-end-apps/data-method/#ticket

Hope this helps.

Thank you.

[Esther_Itolima]

Hi Anish,

I have also tried the exact thing above and from the article but got some errors in the console.

[Anish]

Hi @Esther_Itolima,

It seems that some changes are needed in your code.

For the TypeError, you are calling the getTicketFields function and the init function at the same time. Before the client gets loaded, the getTicketField function is called and the data becomes undefined.

To resolve this, you can call the getTicketFields function within the init() after the client is declared.

For the second issue, ReferenceError: app is not defined, please confirm that you have declared the client in the index.js file as 2.3 platform version guidelines.

If not kindly Replace

<script src="https://static.freshdev.io/fdk/2.0/assets/fresh_client.js"></script>

With

<script async src="{{{appclient}}}"></script>

Kindly refer to the link below for more details: Freshworks Developer Docs | Migration guide

[Esther_Itolima]

Hello Anish,

I have tried your suggestion. I think we are making progress.
The only error am getting is app is not defined. I have placed the script in the and I have tried placing it in the body of my index.html but am still getting the same error.

[Anish]

Hi @Esther_Itolima ,

Would it be possible for you to share the entire zip file of the app, or could you replicate the issue with a sample app so that we can better identify what’s wrong?

Hope this helps

[Esther_Itolima]

Here is the link to the file https://drive.google.com/file/d/1FSYPWs-ScAQVDdIgDjTQb6fCRnAB0nbA/view?usp=sharing

[Esther_Itolima]

Hello Anish,

Were you able to view it?

[Anish]

Yeah @Esther_Itolima ,

I can access the ZIP you shared. It appears you’re still using platform version 2.2 with FDK 8.6.2.

You can migrate to the latest platform version 2.3 with FDK 9, as previously shared in the migration document link.

This should help update the version and potentially resolve the issue.

Hope this helps!

[Esther_Itolima]

Hi Anish,

I have installed the latest version and am still getting the error that app is not defined. Is it possible for you to send me a meeting invite to look at this please for my client needs this very urgently?

[Anish]

Hi @Esther_Itolima ,

Greetings!

Please use the sample ZIP file provided below, where the data methods function as expected. Make any necessary changes according to your requirements.

sampleUi_2.3.zip (4.2 KB)

Hope this helps.

Thank you.

[Esther_Itolima]

Greetings Anish!

Thank you so much for your assistance. It works now.

I would like to ask for something else
I want to do something similar in the contact. Is there a way I can get the contact details so I can pick the contact id.

So the client wants to update the contact with the details gotten from the external API while still on the ticket page.

[Anish]

Hi @Esther_Itolima ,

There are separate data methods for contacts too: link to the documentation.

try {
  const data = await client.data.get("contact");
  // Success output
  // data: {contact: {"active": true, ...}}
} catch (error) {
  // Failure operation
}

As mentioned previously, you can check all the possible events available in the documentation.

Kindly refer to the documentation link below for reference: Freshworks Developer Docs | Use data method

Hope this helps.

Thank you.

[Esther_Itolima]

Thank you Anish.

Is there an event to call after the update ticket API is been called to see the changes of the update? Instead refreshing the browser.

[Anish]

Hi @Esther_Itolima ,

Greetings!

The frontend app (i.e., client-side app) can’t listen to the API updates made to a ticket. This functionality can only be achieved by the serverless application, i.e., the backend. Here, you can use the product events to listen to these kinds of events.

Hope this helps!

[Esther_Itolima]

Yes. This helps a lot. Another question is from the ticket page. Can I update the contact page using a my custom app in the ticket page?

And is it possible to covert the report from CSV to XML format?

[Anish]

Hi @Esther_Itolima ,

Hope your previous queries have received a solution. You can mark my answer as a solution if it solved your query.

This will help others who are facing the same issue.

Additionally, you can post the last question as a new post since it’s entirely different from the query you initiated.

Hope this helps!