Creating a Custom HTML Form for Ticket Submission Follow

Comments

12 comments

  • Avatar
    Gokul Nk

    If you are getting this to work with Drupal, chekcout https://www.drupal.org/project/webform_zendesk which helps you integrate any Drupal Webform with ZenDesk ticket creation.

  • Avatar
    Ben Stein-Lobovits

    Like many others, I needed a way to have a custom form with custom fields and allow multiple attachments to the form. I was successful with the following code:

    All my Zendesk configurations are in config.php

     

    My form looks like 

     <div class="form-group">
    <label class="control-label custom-file-upload" for="data">Upload Log Files</label>
    <div class="upload">
    <input type="file" class="upload" name="data[]" id="data" multiple>
    </div>
    </div>
    include("config.php");

    /* Notes
    *
    * This script expects there to be a config.php file in the same directory as this file.
    *
    * Instructions:
    * for custom fields, you'll create text boxes that have c_ but are followed by the custom field ID number.
    */

    //File upload
    function curlUpload(){

    $i = 0;

    while (is_uploaded_file($_FILES['data']['tmp_name'][$i])){
    $file = fopen(($_FILES['data']['tmp_name'][$i]), 'r');
    $filename = ($_FILES['data']['name'][$i]);
    $size = ($_FILES['data']['size'][$i]);

    $params = fread($file,$size);
    $ch = curl_init();

    curl_setopt($ch, CURLOPT_FOLLOWLOCATION, true);
    curl_setopt($ch, CURLOPT_MAXREDIRS, 10 );
    curl_setopt($ch, CURLOPT_URL, ZDURL.'/uploads.json?filename='.$filename);
    curl_setopt($ch, CURLOPT_USERPWD, ZDUSER."/token:".ZDAPIKEY);
    curl_setopt($ch, CURLOPT_CUSTOMREQUEST, "POST");
    curl_setopt($ch, CURLOPT_POSTFIELDS, $params);
    curl_setopt($ch, CURLOPT_HTTPHEADER, array('Content-type: application/binary'));
    curl_setopt($ch, CURLOPT_INFILE, $file);
    curl_setopt($ch, CURLOPT_INFILESIZE, $size);
    curl_setopt($ch, CURLOPT_USERAGENT, "Mozilla/5.0 (Linux; Ripple Zendesk Ticket File Uploader v1.0)");
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    curl_setopt($ch, CURLOPT_TIMEOUT, 1000);

    $output = curl_exec($ch);
    curl_close($ch);
    $decoded[$i] = json_decode($output);

    $i++;

    if($i == count($_FILES['data']['tmp_name'])){
    return $decoded;
    }
    }
    }

    function curlWrap($url, $json){

    $ch = curl_init();

    curl_setopt($ch, CURLOPT_FOLLOWLOCATION, true );
    curl_setopt($ch, CURLOPT_MAXREDIRS, 10 );
    curl_setopt($ch, CURLOPT_URL, ZDURL.$url);
    curl_setopt($ch, CURLOPT_USERPWD, ZDUSER."/token:".ZDAPIKEY);
    curl_setopt($ch, CURLOPT_CUSTOMREQUEST, "POST");
    curl_setopt($ch, CURLOPT_HTTPHEADER, array('Content-type: application/json'));
    curl_setopt($ch, CURLOPT_USERAGENT, "MozillaXYZ/1.0");
    curl_setopt($ch, CURLOPT_POSTFIELDS, $json);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    curl_setopt($ch, CURLOPT_TIMEOUT, 10);

    $output = curl_exec($ch);
    curl_close($ch);
    $decoded = json_decode($output);
    return $decoded;
    }

    $arr = array();

    foreach($_POST as $key => $value){
    if(preg_match('/^z_/i',$key)){
    $arr[strip_tags($key)] = strip_tags($value);
    }
    }

    $return = curlUpload();

    $token = array();

    for($i =0; $i < count($return); $i++){
    $token[$i] = $return[$i]->upload->token;
    }

    $ticket = array(
    'ticket' => array(
    'subject' => $arr['z_subject'],
    'comment' => array(
    "value"=>$arr['z_description'],
    'uploads' => $token),
    'requester' => array(
    'name' => $arr['z_name'],
    'email' => $arr['z_requester']
    )
    )
    );

    if(CUSTOM){
    foreach($_POST as $key => $value){
    if(preg_match('/^c_/i',$key)){
    $id = str_replace('c_', '', strip_tags($key));
    $value = strip_tags($value);
    $cfield=array('id'=>$id, 'value'=>$value);
    $ticket['ticket']['custom_fields'][]=$cfield;
    }
    }
    }

    $ticket = json_encode($ticket);
    $return = curlWrap("/tickets.json", $ticket);

  • Avatar
    Jessie Schutz

    Hey Ben!

    Thanks for sharing you solution! If you're so inclined, feel free to add it to our Tips & Tricks section. That makes it easy for folks to find, and you'll get swag!

  • Avatar
    Saizad Prasla

    Is there a way to add ticket deflection feature to the custom build "Ticket submission form". Similar feature provided by Zendesk on Web widget and Help Center.

  • Avatar
    Jessie Schutz

    Hey, Saizad!

    When you say "ticket deflection", do you mean the answer suggestions based on keywords in the subject line?

  • Avatar
    Donato (Edited )

    Hi, I have problem with custom fields.

    I have created a custom field form my tickets. It is called "Department"

    I would like that it is appear in custom html form.

    How can i do?

  • Avatar
    Greg

    Hi Donato! Would you mind clarifying what you're looking for? Are you trying to make this ticket field available for your customers to be able to utilize when creating tickets in your Help Center?

  • Avatar
    Donato

    Hi Greg,

    I explain better. I have already set a custom field called "Reparto" in my zendesk account.

    Now I want to create a custom form HTML for my help center.

    I have followed your tutorial but I have difficult with custom fields in HTML Form. I dont know how to do.

    How can I do??


  • Avatar
    Michael Ervin

    Are we able to have this form Apply Zendesk tags?

  • Avatar
    Michael Ervin

    also I am getting a 501 error on this.  I am just using a local python server I am wondering if anyone else has had that problem.

     

  • Avatar
    Daniel Yousaf

    Hi Ervin,

    Thanks for the question!

    It should be possible to apply Tags through this form.  The form uses tickets.json as an endpoint, and the Tags array can be applied to the tickets.json endpoint.  Tags aren't read only restricted, so you're free to make changes to the array.  Our PHP documentation may be of some use here as well.

    If there's a specific problem that you're not getting past, please feel free to submit a support ticket!  This would be out of Zendesk's scope of support, but we're always happy to take a look and see what we can figure out :-)

  • Avatar
    Dennis Lynn

    Hey Donato,

    If you are looking to integrate custom fields in to this form, it looks like Ben might have provided what you are looking for in his comment above! Either scroll up here, or click the link to take a look at his example, and see if that helps!

Please sign in to leave a comment.

Powered by Zendesk