sourcetip

JSON, jQuery를 사용하여 ASP에 복잡한 객체 배열을 게시하는 방법.NET MVC 컨트롤러?

fileupload 2023. 3. 19. 18:25
반응형

JSON, jQuery를 사용하여 ASP에 복잡한 객체 배열을 게시하는 방법.NET MVC 컨트롤러?

현재 코드는 다음과 같습니다.어레이를 컨트롤러에 전달하려면 어떻게 해야 하며 컨트롤러 액션은 어떤 파라미터를 수용해야 합니까?

function getplaceholders() {
    var placeholders = $('.ui-sortable');
    var result = new Array();
    placeholders.each(function() {
        var ph = $(this).attr('id');
        var sections = $(this).find('.sort');
        var section;

        sections.each(function(i, item) {
            var sid = $(item).attr('id');

            result.push({ 'SectionId': sid, 'Placeholder': ph, 'Position': i });
        });
    });
    alert(result.toString());
    $.post(
        '/portal/Designer.mvc/SaveOrUpdate',
        result,
        function(data) {
            alert(data.Result);
        }, "json");
};

컨트롤러의 액션 방식은

public JsonResult SaveOrUpdate(IList<PageDesignWidget> widgets)

해결책을 찾았어요Steve Gentile, jQuery ASP 솔루션을 사용하고 있습니다.NET MVC – JSON을 액션에 송신재방문.

ASP.NET MVC 뷰 코드는 다음과 같습니다.

function getplaceholders() {
        var placeholders = $('.ui-sortable');
        var results = new Array();
        placeholders.each(function() {
            var ph = $(this).attr('id');
            var sections = $(this).find('.sort');
            var section;

            sections.each(function(i, item) {
                var sid = $(item).attr('id');
                var o = { 'SectionId': sid, 'Placeholder': ph, 'Position': i };
                results.push(o);
            });
        });
        var postData = { widgets: results };
        var widgets = results;
        $.ajax({
            url: '/portal/Designer.mvc/SaveOrUpdate',
            type: 'POST',
            dataType: 'json',
            data: $.toJSON(widgets),
            contentType: 'application/json; charset=utf-8',
            success: function(result) {
                alert(result.Result);
            }
        });
    };

컨트롤러 액션은 커스텀 속성으로 장식되어 있습니다.

[JsonFilter(Param = "widgets", JsonDataType = typeof(List<PageDesignWidget>))]
public JsonResult SaveOrUpdate(List<PageDesignWidget> widgets

커스텀 어트리뷰트의 코드는, 여기서 확인할 수 있습니다(링크가 끊어졌습니다).

링크가 끊어졌기 때문에 이것은 Json Filter Attribute의 코드입니다.

public class JsonFilter : ActionFilterAttribute
{
    public string Param { get; set; }
    public Type JsonDataType { get; set; }
    public override void OnActionExecuting(ActionExecutingContext filterContext)
    {
        if (filterContext.HttpContext.Request.ContentType.Contains("application/json"))
        {
            string inputContent;
            using (var sr = new StreamReader(filterContext.HttpContext.Request.InputStream))
            {
                inputContent = sr.ReadToEnd();
            }
            var result = JsonConvert.DeserializeObject(inputContent, JsonDataType);
            filterContext.ActionParameters[Param] = result;
        }
    }
}

Json Convert.Diserialize Object는 Json에서 가져온 것입니다.그물

링크: JSON과 JSON의 시리얼화시리얼화 해제네트워크

액션 필터, jquery stringify, bleh...

피터, 이 기능은 MVC에 기본 탑재되어 있습니다.그게 MVC를 아주 잘 만드는 이유 중 하나예요.

$.post('SomeController/Batch', { 'ids': ['1', '2', '3']}, function (r) {
   ...
});

그리고 액션에서

[HttpPost]
public ActionResult Batch(string[] ids)
{
}

매력적으로 작용:

여기에 이미지 설명 입력

jQuery 1.4+를 사용하는 경우 기존 모드 설정을 검토하십시오.

jQuery.ajaxSettings.traditional = true;

아래 설명과 같이 http://www.dovetailsoftware.com/blogs/kmiller/archive/2010/02/24/jquery-1-4-breaks-asp-net-mvc-actions-with-array-parameters

이것은 복잡한 오브젝트에도 유효합니다.관심 있는 경우 모델 바인딩에 대한 MVC 문서를 참조하십시오.

.NET4.5,MVC 5위젯이 필요 없습니다.

Javascript:

JS의 객체:여기에 이미지 설명 입력

포스트하는 메커니즘입니다.

    $('.button-green-large').click(function() {
        $.ajax({
            url: 'Quote',
            type: "POST",
            dataType: "json",
            data: JSON.stringify(document.selectedProduct),
            contentType: 'application/json; charset=utf-8',
        });
    });

C#

오브젝트:

public class WillsQuoteViewModel
{
    public string Product { get; set; }

    public List<ClaimedFee> ClaimedFees { get; set; }
}

public partial class ClaimedFee //Generated by EF6
{
    public long Id { get; set; }
    public long JourneyId { get; set; }
    public string Title { get; set; }
    public decimal Net { get; set; }
    public decimal Vat { get; set; }
    public string Type { get; set; }

    public virtual Journey Journey { get; set; }
}

컨트롤러:

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Quote(WillsQuoteViewModel data)
{
....
}

수신된 개체:

여기에 이미지 설명 입력

이것으로 시간을 절약하시길 바랍니다.

ASP를 사용한 Create REST API의 후반부로 넘어갑니다.JSON과 플레인 XML을 모두 사용하는 NET MVC는 다음과 같습니다.

이제 HTTP POST를 통해 전달되는 JSON 및 XML payload를 수락해야 합니다.경우에 따라 클라이언트는 일괄 처리를 위해 오브젝트 컬렉션을 한 번에 업로드해야 할 수 있습니다.따라서 JSON 또는 XML 형식을 사용하여 개체를 업로드할 수 있습니다.ASP에서는 네이티브 지원이 없습니다.게시된 JSON 또는 XML을 자동으로 해석하고 Action 파라미터에 자동으로 매핑하는 NET MVC.그래서 필터도 써놨어요.

그런 다음 코드와 함께 JSON 객체를 C# 객체에 매핑하는 액션필터를 실장합니다.

먼저 이 JavaScript 코드 JSON2.js를 다운로드하여 개체를 문자열로 직렬화하는 데 도움이 됩니다.

이 예에서는 Ajax를 통해 jqGrid 행을 게시하고 있습니다.

    var commissions = new Array();
    // Do several row data and do some push. In this example is just one push.
    var rowData = $(GRID_AGENTS).getRowData(ids[i]);
    commissions.push(rowData);
    $.ajax({
        type: "POST",
        traditional: true,
        url: '<%= Url.Content("~/") %>' + AREA + CONTROLLER + 'SubmitCommissions',
        async: true,
        data: JSON.stringify(commissions),
        dataType: "json",
        contentType: 'application/json; charset=utf-8',
        success: function (data) {
            if (data.Result) {
                jQuery(GRID_AGENTS).trigger('reloadGrid');
            }
            else {
                jAlert("A problem ocurred during updating", "Commissions Report");
            }
        }
    });

이제 컨트롤러로 이동:

    [HttpPost]
    [JsonFilter(Param = "commissions", JsonDataType = typeof(List<CommissionsJs>))]
    public ActionResult SubmitCommissions(List<CommissionsJs> commissions)
    {
        var result = dosomething(commissions);
        var jsonData = new
        {
            Result = true,
            Message = "Success"
        };
        if (result < 1)
        {
            jsonData = new
            {
                Result = false,
                Message = "Problem"
            };
        }
        return Json(jsonData);
    }

JSC 참조로 JsonFilter 클래스를 만듭니다.

    public class JsonFilter : ActionFilterAttribute
    {
        public string Param { get; set; }
        public Type JsonDataType { get; set; }
        public override void OnActionExecuting(ActionExecutingContext filterContext)
        {
            if (filterContext.HttpContext.Request.ContentType.Contains("application/json"))
            {
                string inputContent;
                using (var sr = new StreamReader(filterContext.HttpContext.Request.InputStream))
                {
                    inputContent = sr.ReadToEnd();
                }
                var result = JsonConvert.DeserializeObject(inputContent, JsonDataType);
                filterContext.ActionParameters[Param] = result;
            }
        }
    }

필터가 JSON 문자열을 실제 조작 가능한 객체로 해석할 수 있도록 다른 클래스를 만듭니다.이 클래스는 수강료JS는 jqGrid의 모든 행입니다.

    public class CommissionsJs
    {
        public string Amount { get; set; }

        public string CheckNumber { get; set; }

        public string Contract { get; set; }
        public string DatePayed { get; set; }
        public string DealerName { get; set; }
        public string ID { get; set; }
        public string IdAgentPayment { get; set; }
        public string Notes { get; set; }
        public string PaymentMethodName { get; set; }
        public string RowNumber { get; set; }
        public string AgentId { get; set; }
    }

이 예가 복잡한 오브젝트를 게시하는 방법을 설명하는 데 도움이 되었으면 합니다.

    [HttpPost]
    public bool parseAllDocs([FromBody] IList<docObject> data)
    {
        // do stuff

    }

특별한 거 할 필요 없어요.포스트 섹션에서만 다음 작업을 수행합니다.

    $.post(yourURL,{ '': results})(function(e){ ...}

서버에서는 다음을 사용합니다.

   public ActionResult MethodName(List<yourViewModel> model){...}

언급URL : https://stackoverflow.com/questions/320291/how-to-post-an-array-of-complex-objects-with-json-jquery-to-asp-net-mvc-control

반응형