Salesforce Find and Create Records Pre-Chat API with Contact object picklist field

Chat Deployment: 

 

 

Visualforce Page:

<apex:page showHeader="false" standardStylesheets="false" sidebar="false" title="Pre-Chat Form" cache="false">

    <!-- form id should be used in getElementById() -->
    <script type="text/javascript">
        (function() {
            function handlePageLoad() {
                var endpointMatcher = new RegExp("[\\?\\&]endpoint=([^&#]*)");
                document.getElementById('prechatForm').setAttribute('action',
                        decodeURIComponent(endpointMatcher.exec(document.location.search)[1]));
            }
            if (window.addEventListener) {
                window.addEventListener('load', handlePageLoad, false);
            } else {
                window.attachEvent('onload', handlePageLoad, false);
            }
        })();
    </script>

    <form method='post' id='prechatForm'>
        <table cellspacing="5" cellpadding="5">
            <tr>
                <td>First Name</td>
                <td><input type='text' name='liveagent.prechat:ContactFirstName' /></td>
            </tr>
            <tr>
                <td>Last Name</td>
                <td><input type='text' name='liveagent.prechat:ContactLastName' /></td>
            </tr>
            <tr>
                <td>Email</td>
                <td><input type='text' name='liveagent.prechat:ContactEmail' /></td>
            </tr>
            <tr>
                <td>Contact Level</td>
                <td>
                    <select name="liveagent.prechat:ContactLevel">
                        <option value="">--None--</option>
                        <option value="Primary">Primary</option>
                        <option value="Secondary">Secondary</option>
                        <option value="Tertiary">Tertiary</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>Subject</td>
                <td><input type='text' name='liveagent.prechat:CaseSubject' /></td>
            </tr>
        </table>
        <!-- Contact creation Start -->
        <input type="hidden" name="liveagent.prechat.findorcreate.map:Contact" value="FirstName,ContactFirstName;LastName,ContactLastName;Email,ContactEmail;Level__c,ContactLevel" />
        <input type="hidden" name="liveagent.prechat.findorcreate.map.doFind:Contact" value="FirstName,true;LastName,true;Email,true" />
        <input type="hidden" name="liveagent.prechat.findorcreate.map.isExactMatch:Contact" value="FirstName,true;LastName,true;Email,true" />
        <input type="hidden" name="liveagent.prechat.findorcreate.map.doCreate:Contact" value="FirstName,true;LastName,true;Email,true;Level__c,true" />
        <!-- Contact creation End -->
        <!-- Case creation Start -->
        <!-- Setting Case Status and Origin -->
        <input type="hidden" name="liveagent.prechat:CaseStatus" value="New" /><br />
        <input type="hidden" name="liveagent.prechat:CaseOrigin" value="Chat" /><br />
        <input type="hidden" name="liveagent.prechat.findorcreate.map:Case" value="Subject,CaseSubject;Status,CaseStatus;Origin,CaseOrigin" />
        <input type="hidden" name="liveagent.prechat.findorcreate.map.doCreate:Case" value="Subject,true;Status,true;Origin,true" />
        <!-- Case creation End -->
        <!-- Linking Contact and Case to the Chat Transcript -->
        <input type="hidden" name="liveagent.prechat.findorcreate.saveToTranscript:Contact" value="ContactId" />
        <input type="hidden" name="liveagent.prechat.findorcreate.saveToTranscript:Case" value="CaseId" />
        <!-- Showing the Contact and Case when the Chat loads automatically in a subtab in the Salesforce console -->
        <input type="hidden" name="liveagent.prechat.findorcreate.showOnCreate:Contact" value="true" />
        <input type="hidden" name="liveagent.prechat.findorcreate.showOnCreate:Case" value="true" />
        <!-- Linking Case to the Contact -->
        <input type="hidden" name="liveagent.prechat.findorcreate.linkToEntity:Contact" value="Case,ContactId" />
        <input type="submit" value="Submit"/>
    </form>

</apex:page> 

Chat Button:

Note:

Make sure the VF page is added to the Site's Guest Profile Access.

Output: