jquery - Message : The requested resource does not support http method 'POST' -
i new web api , trying jquery post request getting error message":"the requested resource not support http method 'post' have tried many sulotions nothing worked me
there code
controller
public class productscontroller : apicontroller { list<product> products = new list<product> { new product { id = 1, name = "tomato soup", category = "groceries", price = 1 }, new product { id = 2, name = "yo-yo", category = "toys", price = 3.75m }, new product { id = 3, name = "hammer", category = "hardware", price = 16.99m } }; [httpget] public ienumerable<product> getallproducts() { return products; } [httpget] public ihttpactionresult getproduct(int id) { var product = products.firstordefault((p) => p.id == id); if (product == null) { return notfound(); } return ok(product); } [httppost] public ihttpactionresult addproduct([frombody] product p) { var product = new product(); if (p.name == null || p.price <= 0) { return notfound(); } product.id = products.last().id +1; product.name = p.name; product.price = p.price; products.add(product); return ok(products); } } html , js
<!doctype html> <html> <head> <title>product app</title> </head> <body> <div> <h2>all products</h2> <ul id="products" /> </div> <div> <h2>search id</h2> <input type="text" id="prodid" size="5" /> <input type="button" value="search" onclick="find();" /> <p id="product" /> </div> <div> <h2>add new product</h2> <input type="text" id="newprod" placeholder="product name" size="7" /> <input type="text" id="newprodprice" placeholder="product price" size="7" /> <input type="button" value="add" onclick="add();" /> </div> <script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-2.0.3.min.js"></script> <script> var uri = 'api/products'; //works fine $(document).ready(function () { // send ajax request $.getjson(uri) .done(function (data) { // on success, 'data' contains list of products. $.each(data, function (key, item) { // add list item product. $('<li>', { text: formatitem(item) }).appendto($('#products')); }); }); }); function formatitem(item) { return item.name + ': $' + item.price; } //works fine function find() { var id = $('#prodid').val(); $.getjson(uri + '/' + id) .done(function (data) { $('#product').text(formatitem(data)); }) .fail(function (jqxhr, textstatus, err) { $('#product').text('error: ' + err); }); } function add() { var _name = $('#newprod').val(); var _price = $('#newprodprice').val(); var p = {name:_name, price:_price}; $.ajax({ type: 'post', url: uri, data: json.stringify(p), success: oncomplete, contenttype: "application/json" }); } function oncomplete(data) { $("#products").empty(); $.each(data, function (key, item) { // add list item product. $('<li>', { text: formatitem(item) }).appendto($('#products')); }); } </script> </body> </html> and web api
public static void register(httpconfiguration config) { // web api configuration , services // web api routes config.maphttpattributeroutes(); config.routes.maphttproute( name: "defaultapi", routetemplate: "api/{controller}/{id}", defaults: new { id = routeparameter.optional } ); } when change httppost on addproduct httpget anxd json request works fine when post error
i have tried frombody , still didnt work
thanks helpers
well found answer had add rout before post method
[route("api/products")] [httppost] public ihttpactionresult addproduct([frombody] product p) { var product = new product(); if (p.name == null || p.price <= 0) { return notfound(); } product.id = products.last().id +1; product.name = p.name; product.price = p.price; products.add(product); return ok(products); } that fixed of have other answers please post them here
Comments
Post a Comment