Convert Json to String Arrays

Question

This is my code for my form:

<div class="form-group">
    <label for="text">product name:</label>
    <input id="name" type="text" class="form-control"  placeholder="Enter product name" name="product[0].name">
</div>
<div class="form-group">
    <label for="text">product detail:</label>
    <input id="detail" type="text" class="form-control" placeholder="Enter prodcut detail" name="product[1].detail">
</div>

<button id="btn" type="submit" class="btn btn-default">Submit</button>

This is my javascript

<script>

    $(function postProduct() {
        $('#btn').click(function () {

            var productName = document.getElementById("name").value;
            var productDetail = document.getElementById("detail").value;

            var dimensions = [ productName, productDetail];
            var keys = $.map(dimensions, function (value, key) {
                return key;
            });

            if (productName == '' || productDetail == '') {
                alert("Please Fill All Fields");
            } else {

                $.ajax({
                    type: 'post',
                    url: "api/product/addproduct",
                    data: keys,
                    dataType: 'json',
                    success: function (result) {

                    },
                    error: function (error) {

                    }
                });
            }

        });
    });

</script>

My controller:

[HttpPost]
[Route("api/product/addproduct")]
public IActionResult AddProduct([FromBody] string[] addproduct)
{
    var pProductName= addProduct[0];
    var pProductDetail= addProduct[1];

    Product NewProduct = new Product();
    {
        NewProduct.ProductName= pProductName;
        NewProduct.ProductDetail = pProductDetail;
    }


    _db.Products.Add(NewProduct);
    _db.SaveChanges();

    //create a new route for post method by id
    return CreatedAtRoute(new { id = addproduct}, addproduct);
}

What I'm trying to do is after the user enters the information into the form and hits submit button. The information will be pass to the controller and save the information into the database. The issue that I have is my data in the form is a Json type, however, my controller is an array.

Is it possible to convert the form into an array?

Are you using web api controllers on asp.net? If so, you can just send a json array with "application/json" header on your post request and it'll deserialize the json into an array by itself for you. — Janilson
– Janilson, Commented Jun 30, 2018 at 0:30
@Lucas Yes I'm using web api on asp.net. Can you please give me an example on doing that? Thank you. — dddmo
– dddmo, Commented Jun 30, 2018 at 0:37

Mohammed Noureldin · Accepted Answer · 2018-06-30 09:43:33Z

I did not check how you are sending the data. So I assume that you are sending the data in the correct JSON format.

The good news are: if you wrote your code in a proper way, ASP.Net Core will adapt the data from JSON to array automatically for you!

The first thing to do is to remove that [FromBody] annotation.

Now please use ViewModel approach to receive the data rather than receiving the data directly as an array. I.e., Create a view model class like this:

public class MyViewModel
{
    public string[] AddProduct { get; set; } // I find the name weired
}

Now adapt the action in the controller:

public IActionResult AddProduct(MyViewModel viewModel)
{
    // Now check viewModel.AddProduct, you should find the data in the array.
}

Collectives™ on Stack Overflow

Convert Json to String Arrays

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related