Q:

Autocomplete issue: Content is not displaying

Content is not displaying is autocomplate list as you can see in screenshot below.

I am getting this response.

[{"emp_number":1,"fname":"Arslan","lname":"Hassan"},{"emp_number":2,"fname":"Muneeb","lname":"Janjua"
  },{"emp_number":3,"fname":"hr","lname":"user"},{"emp_number":4,"fname":"test","lname":""} .......... REMOVED TO MAKE IT LOOK BETTER HERE .......]

My JS Code:
$( "#search-emp" ).autocomplete(
{
    source: function (request, response)
    {
        var form_data = {
            ajax                : '1',
            name                : $("#search-emp").val(),
            actioncall          : 'search-emp'
        };

        $.ajax({
            //contentType: "application/json",
            type: "POST",
            dataType: 'json',
            url: "_ajax.php",
            data: form_data,
            success: function( data )
            {
                response( data );
            }
        });
    },
    minLength:3,
    select:function(evt, ui)
    {
        alert(ui.item.emp_number);
    }
});

I want to display fname and lname on selected into input field.

A:

The problem it's because jQuery autocomplete wants to have 2 fields named label and value. The content from label will be displayed in the autocomplete.
Because your server return other name for the keys you have 2 options:

Change the server to return a json like:
[{"emp_number":1,"fname":"Arslan","lname":"Hassan", "label":"Arslan Hassan", "value": "Arslan Hassan"},....]
Or on the success callback from ajax create an array with this fields (label and value) and pass this array to response() callback.

You can find more informations here: http://api.jqueryui.com/autocomplete/#option-source

