Trouble passing custom headers in a CORS GET request using jquery

Question

I wrote a Web API which need to be accessed outside of the app domain. I have CORS enabled and I'm able to make the API call from outside the application domain. I'm trying to pass in custom HTTP headers as part of the GET request which I'm not able to get it working

I searched in web to get it working but unable to. I'm trying pass in two parameters appId as custom header on a GET request to the web API call using jQuery $.ajax.

            url: "http://localhost:38994/api/Search/GetSearchResults",                
            type: 'GET',
            dataType: 'json',
            headers: { 'appId': '234' },
            data: { param1: 1, param2: { search_by_param: 'xyz', category: 'null'}},                                    
            success: function (result) {                                        
                alert(result);                    
            }
       , error: function (err) { alert(err); }

I tried to use beforeSend to add the headers as well. Regardless I use 'headers' or beforeSend to add headers, I see the custom header names are added to 'Access-Control-Request-Headers' as

Access-Control-Request-Headers: accept, appId

I tried to use JSONP as well using WebApiContrib.Formatting.Jsonp from Nuget. After I add the reference, my project goes for a toss. I see 'dll version mismatch on System.Web.Http.dll between ver 4.0 and 5.0'

Can anyone advice me on how to pass custom Http headers in CORS? Note that when I try to pass custom http headers within my application, it works