Auto Complete Dropdown Boxes For Ticket-frontend and backend

[deserteagle369]

I customized the new ticket custom field to a auto complete dropdown box, because in my case, I use custom2 to store the product categories and there are near 200 product categories, it continue increase every month.

The user (frontend) and admin (backend)can start type in the custom2 text field and a dropdown list boxes will show up with the text you type in bold, that make it easy and fast to select category.

The trick is jquery auto complete.

hesk2.41

For submit ticket:



what I did are:
1.new ticket - sales info - auto populate - import pseries to db talbe hesk_pseries;


2.new ticket - pseries - jquery auto complete - upload js and css files
D:\wamp\www\hesk\js\
jquery-1.4.2.js
jquery.autocomplete.js
jquery.autocomplete.css
indicator.gif
D:\wamp\www\hesk\js\lib\
jquery.ajaxQueue.js
jquery.bgiframe.min.js

http://kanboxshare.com/link/yCrYMS3asS6 ... YLfZxW1lYK

3.new ticket - pseries - jquery auto complete - create search php
D:\wamp\www\hesk\pseriescheck.php

Code: Select all

<?php
define('IN_SCRIPT',1);
define('HESK_PATH','./');

/* Get all the required files and functions */
require(HESK_PATH . 'hesk_settings.inc.php');
require(HESK_PATH . 'inc/common.inc.php');
require(HESK_PATH . 'inc/database.inc.php');

hesk_dbConnect();	

$q = strtolower($_GET["q"]);
if (!$q) return;

$sql = "select series from hesk_pseries where series LIKE '%$q%'";
$rsd = mysql_query($sql);
while($rs = mysql_fetch_array($rsd)) {
	$pserie = $rs['series'];
	echo "$pserie\n";
}
?>

4.user new ticket - pseries - jquery auto complete - function
D:\wamp\www\hesk\index.php
line 89

Code: Select all

<meta charset="UTF-8" />
<script type="text/javascript" src="js/jquery-1.4.2.js"></script>
<script type='text/javascript' src='js/lib/jquery.bgiframe.min.js'></script>
<script type='text/javascript' src='js/lib/jquery.ajaxQueue.js'></script>
<script type='text/javascript' src="js/jquery.autocomplete.js"></script>
<link rel="stylesheet" type="text/css" href="js/jquery.autocomplete.css" />

<script type="text/javascript">
$().ready(function() {

 $("#pserie").autocomplete("pseriescheck.php", {
  width: 320,
  matchContains: true,
  mustMatch: true,
  minChars: 2,
  selectFirst: false
 });
});
</script>

5.user new ticket - pseries - jquery auto complete - custom2 form
D:\wamp\www\hesk\index.php
line 556

add for custom2 after

foreach ($hesk_settings['custom_fields'] as $k=>$v)
{

Code: Select all

 if ($k == 'custom2')
 {
 // Print the field HTML code and anything you want here
 ?>

 <tr>
 <td style="text-align:right" width="150">Product Series:</td>
 <td width="80%"><input type="text" name="pserie" id="pserie" size="50" maxlength="150" value="<?php if (isset($_SESSION['custom2'])) {echo stripslashes(hesk_input($_SESSION['custom2']));} ?>" <?php if (in_array('custom2',$_SESSION['iserror'])) {echo ' class="isError" ';} ?> /><input type="reset" value="Clear"/>
 </td>
 </tr>

 <?php

 // This line will tell PHP to skip the rest of code for 'custom2' and start with next one
 continue;
 }

6.admin new ticket - pseries - jquery auto complete - function
D:\wamp\www\hesk\admin\new_ticket.php
line 90

Code: Select all

 if ($k == 'custom2')
 {
 // Print the field HTML code and anything you want here
 ?>

 <tr>
 <td style="text-align:right" width="150">Product Series:</td>
 <td width="80%"><input type="text" name="pserie" id="pserie" size="50" maxlength="150" value="<?php if (isset($_SESSION['custom2'])) {echo stripslashes(hesk_input($_SESSION['custom2']));} ?>" <?php if (in_array('custom2',$_SESSION['iserror'])) {echo ' class="isError" ';} ?> /><input type="reset" value="Clear"/>
 </td>
 </tr>

 <?php

 // This line will tell PHP to skip the rest of code for 'custom2' and start with next one
 continue;
 }

7. admin new ticket - pseries - jquery auto complete - custom2 form
D:\wamp\www\hesk\admin\new_ticket.php
line 527

add for custom2 after

foreach ($hesk_settings['custom_fields'] as $k=>$v)
{

Code: Select all

 if ($k == 'custom2')
 {
 // Print the field HTML code and anything you want here
 ?>

 <tr>
 <td style="text-align:right" width="150">Product Series:</td>
 <td width="80%"><input type="text" name="pserie" id="pserie" size="50" maxlength="150" value="<?php if (isset($_SESSION['custom2'])) {echo stripslashes(hesk_input($_SESSION['custom2']));} ?>" <?php if (in_array('custom2',$_SESSION['iserror'])) {echo ' class="isError" ';} ?> /><input type="reset" value="Clear"/>
 </td>
 </tr>

 <?php

 // This line will tell PHP to skip the rest of code for 'custom2' and start with next one
 continue;
 }

8. user new ticket - pseries - submit auto complete text
D:\wamp\www\hesk\submit_ticket.php
line 135
add for custom2
after

/* Custom fields */
foreach ($hesk_settings['custom_fields'] as $k=>$v)
{

Code: Select all

 if ($k == 'custom2')
 {
 // custom2(pserie) start

 if ($v['req'])
        {
         $tmpvar[$k]=hesk_makeURL(nl2br(hesk_input($_POST['pserie'])));
            if (!strlen($tmpvar[$k]))
            {
             $hesk_error_buffer[$k]=$hesklang['fill_all'].': '.$v['name'];
            }
        }
  else
        {
         $tmpvar[$k]=hesk_makeURL(nl2br(hesk_input($_POST['pserie'])));
        }
  $_SESSION["c_$k"]=$_POST['pserie'];

 // custom2(pserie) end
 continue;
 }

9. admin new ticket - pseries - submit auto complete text
D:\wamp\www\hesk\admin\admin_submit_ticket.php
line 75
add for custom2 after

// Custom fields
foreach ($hesk_settings['custom_fields'] as $k=>$v)
{

Code: Select all

 if ($k == 'custom2')
 {
 // custom2(pserie) start

 if ($v['req'])
        {
         $tmpvar[$k]=hesk_makeURL(nl2br(hesk_input($_POST['pserie'])));
            if (!strlen($tmpvar[$k]))
            {
             $hesk_error_buffer[$k]=$hesklang['fill_all'].': '.$v['name'];
            }
        }
  else
        {
         $tmpvar[$k]=hesk_makeURL(nl2br(hesk_input($_POST['pserie'])));
        }
  $_SESSION["c_$k"]=$_POST['pserie'];

 // custom2(pserie) end
 continue;
 }

That's all. It works in IE6,7,8,FF3,8,13, also chrome 11.

[Lisaweb]

Wow! Thank you sooo much for this! I will try to implement it tomorrow and report back.

[Lisaweb]

Just now looking at your instructions... and I am unsure about steps 1-3.

Can you please provide the db instructions for step 1 Unsure of exactly what to create.

And in steps 2-3, do you have the js files for this? If not, where can we obtain them?


Sorry - I am a php newbie. Thanks!

[Lisaweb]

Thanks Eagle, for your added instructions. However, I may be mistaken as to what you are trying to do here....

What I had wanted, is for a conditional dropdown boxes, based on Category. For example, if the ticket submitter chose the Category "Phones" then custom2 would automatically populate with the subcategories "iphone, blackberry, Android". If they chose the category "Software" then custom2 would auto-populate "Windows, Mac, Ubuntu, other".

But the hack does not seem to be allowing for this, unless I've installed it incorrectly. Or am I missing something?

Thanks again for your help!
Lisa

[deserteagle369]

Lisa

sorry maybe I mislead you, actually what I did is auto complete dropdown boxes not conditional dropdown boexes. At begging I had same idea as you had, but for hesk tickets there is no parent category and sub category relationship, so if you want conditional category you need create new fields in table for that( article category is different from ticket there is parent id field), that's why I change to auto complete dropdown boxes and it's more practicality, the trick category is combine the parent category with sub category together seperated by ":", for your case, like below:
Phones:iphone
Phones:blackberry
Phones:Android
Software:Windows
Software:Mac
Software:Ubuntu
Software:other
then put some text near the input box to guide user start typing for auto complete.