programing

POST(ajax)를 통해 JSON 데이터를 전송하고 컨트롤러(MVC)로부터 json 응답을 수신합니다.

bestprogram 2023. 2. 26. 16:25

POST(ajax)를 통해 JSON 데이터를 전송하고 컨트롤러(MVC)로부터 json 응답을 수신합니다.

javascript에서 다음과 같은 기능을 만들었습니다.

function addNewManufacturer() {
    var name = $("#id-manuf-name").val();
    var address = $("#id-manuf-address").val();
    var phone = $("#id-manuf-phone").val();
    
    var sendInfo = {
        Name: name,
        Address: address,
        Phone: phone
    };
    
    $.ajax({
        type: "POST",
        url: "/Home/Add",
        dataType: "json",
        success: function (msg) {
            if (msg) {
                alert("Somebody" + name + " was added in list !");
                location.reload(true);
            } else {
                alert("Cannot add to list !");
            }
        },
        data: sendInfo
    });
}

전화해봤어요.jquery.json-2.3.min.js스크립트 파일, 그리고 나는 그것을 위해 사용했습니다.toJSON(array)방법.

컨트롤러에 이게 있어요.Add액션.

[HttpPost]
public ActionResult Add(PersonSheets sendInfo) {
    bool success = _addSomethingInList.AddNewSomething( sendInfo );

    return this.Json( new {
         msg = success
    });
      
}

그렇지만sendInfo메서드 파라미터가 null이 됩니다.

모델:

public struct PersonSheets
{
    public int Id;
    public string Name;
    public string Address;
    public string Phone;
}

public class PersonModel
{
    private List<PersonSheets> _list;
    public PersonModel() {
         _list= GetFakeData();
    }

    public bool AddNewSomething(PersonSheets info) {
         if ( (info as object) == null ) {
            throw new ArgumentException( "Person list cannot be empty", "info" );
         }

         PersonSheets item= new PersonSheets();
         item.Id = GetMaximumIdValueFromList( _list) + 1;
         item.Name = info.Name;
         item.Address = info.Address;
         item.Phone = info.Phone;
             
         _list.Add(item);

         return true;
    }
}

POST로 데이터가 전송되었을 때 어떻게 행동할 수 있습니까?

사용법을 몰라요.또한 JSON을 통해 (ajax에) 응답을 반송할 수 있습니까?

var SendInfo= { SendInfo: [... your elements ...]};

        $.ajax({
            type: 'post',
            url: 'Your-URI',
            data: JSON.stringify(SendInfo),
            contentType: "application/json; charset=utf-8",
            traditional: true,
            success: function (data) {
                ...
            }
        });

그리고 실행 중

public ActionResult AddDomain(IEnumerable<PersonSheets> SendInfo){
...

어레이를 다음과 같이 바인드할 수 있습니다.

var SendInfo = [];

$(this).parents('table').find('input:checked').each(function () {
    var domain = {
        name: $("#id-manuf-name").val(),
        address: $("#id-manuf-address").val(),
        phone: $("#id-manuf-phone").val(),
    }

    SendInfo.push(domain);
});

이게 도움이 되길 바라

모델 작성

public class Person
{
    public string Name { get; set; }
    public string Address { get; set; }
    public string Phone { get; set; }
}

다음과 같은 컨트롤러

    public ActionResult PersonTest()
    {
        return View();
    }

    [HttpPost]
    public ActionResult PersonSubmit(Vh.Web.Models.Person person)
    {
        System.Threading.Thread.Sleep(2000);  /*simulating slow connection*/

        /*Do something with object person*/


        return Json(new {msg="Successfully added "+person.Name });
    }

자바스크립트

<script type="text/javascript">
    function send() {
        var person = {
            name: $("#id-name").val(),
            address:$("#id-address").val(),
            phone:$("#id-phone").val()
        }

        $('#target').html('sending..');

        $.ajax({
            url: '/test/PersonSubmit',
            type: 'post',
            dataType: 'json',
            contentType: 'application/json',
            success: function (data) {
                $('#target').html(data.msg);
            },
            data: JSON.stringify(person)
        });
    }
</script>

사용하다JSON.stringify(<data>).

코드 변경:data: sendInfo로.data: JSON.stringify(sendInfo)이게 도움이 되길 바랍니다.

JSON을 게시하려면 문자열을 지정해야 합니다. JSON.stringify를 설정합니다.processData옵션을 false로 설정합니다.

$.ajax({
    url: url,
    type: "POST",
    data: JSON.stringify(data),
    processData: false,
    contentType: "application/json; charset=UTF-8",
    complete: callback
});

PersonSheets에 속성이 있습니다.int Id,Id포스트에 없기 때문에 모델 바인딩에 실패합니다.ID를 nullable(int?)로 설정하거나 ID = 0 이상을 Post와 함께 전송합니다.

JSON.stringify를 사용해야 합니다.
그리고 플라스크에는 json.loads를 사용합니다.

res = request.get_data("data")
d_token = json.loads(res)

json.dll은 사전을 반환하고, 값은 d_dlll['ll]을 취득할 수 있습니다.아이디]

 $.ajax({
            type: "POST",
            url: "/subscribe",
            contentType: 'application/json;charset=UTF-8',
            data: JSON.stringify({'tokenID':  token}),
            success: function (data) {
                console.log(data);
              
            }
     });

플라스크

@app.route('/test', methods=['GET', 'POST'])
def test():
    res = request.get_data("data")
    d_token = json.loads(res)
    logging.info("Test called..{}".format(d_token["tokenID"]))
    const URL = "http://localhost:8779/api/v1/account/create";
    let reqObj = {accountName:"", phoneNo:""}

    const httpRequest = new XMLHttpRequest();
    let accountName = document.getElementById("accountName").value
    let phoneNo = document.getElementById("phoneNo").value
    reqObj.accountName = accountName;
    reqObj.phoneNo = phoneNo;
    console.log(reqObj);
    console.log(JSON.stringify(reqObj))
    httpRequest.onload = function() {
        document.getElementById("mylabel").innerHTML = this.responseText;
    }
    httpRequest.open("POST", URL);
    httpRequest.overrideMimeType("application/json");
    httpRequest.send(reqObj);

전화 안 해도 돼$.toJSON추가하다traditional = true

data: { sendInfo: array },
traditional: true

그럴 거예요.

언급URL : https://stackoverflow.com/questions/8517071/send-json-data-via-post-ajax-and-receive-json-response-from-controller-mvc