Как отправить значения координат (x, y, w, h) как JSON на контроллер и получить ответ в WEB API

Question

Я использую JQuery Jcrop для получения выбранной области. Основываясь на значениях, полученных для x, y, w, h, мне нужно получить «ключ» и «значение». Мне нужно использовать Web API для этого.

function PostCoordinateValues() { 
    $.ajax({ 
     type: "GET", 
     url: "api/ExtractWithKey", 
     data: JSONString, 
     success: function (result) { 
      alert("success"); 
      if (result != null) { 
       var data = result.d; 
       $('#keyBox').text(data[0]); 
       $('#valueBox').text(data[1]); 
      } 
     } 
    }); 
} 

Вышеупомянутый призыв ajax. Ниже приведен скрипт jquery, позволяющий jcrop выбирать конкретный регион.

$(document).ready(function() { 
    $('#docView').Jcrop({ 
     onSelect: function (c) { 
      var x1 = $('#cropx').val(c.x); 
      var y1 = $('#cropy').val(c.y); 
      var x2 = $('#cropw').val(c.w); 
      var y2 = $('#croph').val(c.h); 
     } 
    }); 
    $('#form').on('change', '[type=text]', function (c) { 
    $('#docView').Jcrop('api').setSelect([ 
     x1, y1, x2, y2]); 
     var JSONString = {'xv': x1, 'yv': y1, 'wv': x2, 'hv': y2}; 
     PostCoordinateValues(); 
    }); 
}); 

Ниже приведен класс, объявленный в проекте веб-API.

public class KeyValueData 
{ 
    public string XVal { get; set; } 
    public string YVal { get; set; } 
    public string WVal { get; set; } 
    public string HVal { get; set; } 
    public string Key { get; set; } 
    public string Value { get; set; } 
} 

Вот код контроллера:

public class ExtractWithKeyController : ApiController 
{ 
    List<string> ReturnData; 
    public List<KeyValueData> responseData = new List<KeyValueData>() 
    { 
     new KeyValueData() { XVal = "79", YVal = "198", WVal = "218", HVal = "32", Key = "EMPNAME", Value ="Ron" } 
    }; 

    [System.Web.Http.HttpGet] 
    public List<string> GetResponse(string coordinates) 
    { 
     if (coordinates[0] == responseData[0].XVal && coordinates[1] == responseData[0].YVal && coordinates[2] == responseData[0].WVal && coordinates[3] == responseData[0].HVal) 
     { 
      ReturnData = new List<string>(); 
      ReturnData[0] = responseData[0].Key; 
      ReturnData[1] = responseData[0].Value; 
     } 
     return ReturnData; 
    } 
} 

Answer 1

Вам не нужно реализовать свои собственные модели связывания. MVC уже может сделать это за вас. Все, что вам нужно в вашем контроллере - правильно описывайте входящую модель. Таким образом, вы действие может выглядеть следующим образом:

Модель:

public class MyCoordinates{ 
    public decimal Xv {get; set;} 
    public decimal Yv {get; set;} 
    public decimal Wv {get; set;} 
    public decimal Hv {get; set;} 
} 

Действие:

[HttpGet] 
    public List<string> GetResponse(MyCoordinates coordinates) 
    { 
     //Here you can use coordinates.Xv and other members 
    }