Wcf service writing PUT/DELETE methods crashes the service

See more:

ASP.NET

WCF

Ajax

jQuery

, +

I am creating a web service to interact with a database and it is supposed to perform the CRUD operations. Right now it works fine with the read and post operation the WCF service supposed to have a method that is called from within jQuery whenever the page completes load to retrieve a list of all providers and it works fine, however, when I update the WCF Service with a method like this

[OperationContract]
    [WebInvoke(Method = "PUT", RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json)]
    public Object PutSupplier(int id, Supplier oParameter)
    {
        // Do work
    }

OR

[OperationContract]
    [WebInvoke(Method = "DELETE", RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json)]
    public Object DeleteSupplier(int id)
    {
        // Do work
    }

Something happen and no data comes back when the page loads and the insertion operation failed too and I got a 500 internal error?!. Like if the whole WCF Service got unseen or not functioning.

Here is my other WCF Service methods and the calling jQuery/Ajax

[OperationContract]
    [WebInvoke(Method = "GET", RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json)]
    public List<Supplier> GetSupplier(int id)
    {
        // Add your operation implementation here
        return DbContext.DbContextManager.GetSupplier(id.ToNullableInt());
    }
    [OperationContract]
    [WebInvoke(Method = "POST", RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json)]
    public Supplier PostSupplier(Supplier oParameter)
    {
        return DbContext.DbContextManager.PostSupplier(oParameter);
    }

<script>
    $(function () {
        $.ajax({
            method: 'GET',
            url: '/WebServices/NameService.svc/GetSupplier',
            data: JSON.stringify({ id : 0 }),
            dataType: 'json',
            contentType: 'application/json; charset=utf-8',
            success: function (item) {
                $.each(item, function (i) {
                    var _tr = '<tr><td class="readonly-"><input type="text" class="form-control" value="' + item[i].CompanyName + '" style="display:table-cell; width:100%" readonly/></td><td>' +
                        '<button type="button" id="pencilbutton_' + item[i].SupplierId + '"  class="btn btn-success">' +
                        '<span class="glyphicon glyphicon-pencil"></span> Pencil</span></button>' +
                        '<button type="button" id="removebutton_' + item[i].SupplierId + '"  class="btn btn-danger"><span class="glyphicon glyphicon-remove"></span> Remove</button></td></tr>';
                    $('tbody').append(_tr);
                });
            }
        });
        $('table').on('focus', 'input[type="text"]', function () {
            $(this).removeAttr('readonly');
        });
        $(':button[class*="btn-primary"]').click(function () {
            if (Page_ClientValidate("MyValidationGroup")) {
                $.ajax({
                    method: 'POST',
                    url: '/WebServices/NameService.svc/PostSupplier',
                    data: JSON.stringify({ 'SupplierId': 0, 'CompanyName': $(':text[class="form-control"]').val() }),
                    dataType: 'json',
                    contentType: 'application/json; charset=utf-8',
                    success: function (item) {
                        var _tr = '<tr><td class="readonly-"><input type="text" class="form-control" value="' + item.CompanyName + '" style="display:table-cell; width:100%" readonly/></td><td>' +
                                 '<button type="button" id="pencilbutton_' + item.SupplierId + '"  class="btn btn-success">' +
                                 '<span class="glyphicon glyphicon-pencil"></span> Pencil</span></button>' +
                                 '<button type="button" id="removebutton_' + item.SupplierId + '"  class="btn btn-danger"><span class="glyphicon glyphicon-remove"></span> Remove</button></td></tr>';
                        $('tbody').append(_tr);
                    }
                });
            }
        });
    });
</script> 

What I have tried:

I am trying to use POST instead