Model binding is not properly working in input parameter controller in .Net Core

Question

I am trying to Alldata transfer a from Model to ViewModel. But the input parameter can't input several data. For that this data I can not use my session to create a cart system. Here is my code.

public class ProductVm: Spray
{ }


 public class Spray
    {
        public int Id { get; set; }
        [Required]
        public String Name { get; set; }
        [Required]
        public decimal Price { get; set; }
        public String Image { get; set; }


        public String Image1 { get; set; }
        [Required]

        public String ProductColor { get; set; }

        public DateTime Date { get; set; }


        [Required]
        public int Quantity { get; set; }

        [Required]
        public int Size { get; set; }

        [Required]
        public String Description { get; set; }


        [Display(Name = "Product Type")]

        public int ProductTypeId { get; set; }

        [ForeignKey("ProductTypeId")]
        public ProductTypes ProductTypes { get; set; }
    }

[HttpGet]

    public ActionResult Details(int? id)
    {
        if (id == null)
        {
            return NotFound();
        }

        var hi = _db.Spray.Include(c => c.ProductTypes).FirstOrDefault(c => c.Id == id);

        ProductVm product = new ProductVm
        {
            Name = hi.Name,
            Id = hi.Id,
            Image = hi.Image,
            Quantity = hi.Quantity,
            Price = hi.Price,
        };
       

        if (product == null)
        {
            return NotFound();
        }

        return View(product);
    }



    [HttpPost]
    [ActionName("Details")]

    public async Task <IActionResult> ProductDetails(ProductVm pb)
    {

        List<Spray> sprays = new List<Spray>();

        //if (id == null)
        //{
        //    return NotFound();
        //}

        //var yes = _db.Spray.Include(c => c.ProductTypes).FirstOrDefault(c => c.Id == id);

        ProductVm product = new ProductVm()
        {
            Name = pb.Name,
            Id=pb.Id,    
            Image=pb.Image,
            Quantity=pb.Quantity,
           Price=pb.Price,
            
        };
      

        if (product == null)
        {
            return NotFound();
        }
        sprays = HttpContext.Session.Get<List<Spray>>("sprays");
        if (sprays == null)
        {
            sprays = new List<Spray>();
        }
        sprays.Add(product);
        HttpContext.Session.Set("sprays", sprays);

        return RedirectToAction(nameof(Index));
    }

@model ProductVm


@{
    ViewData["Title"] = "Details.Cshtml";
}


@*@using OnlineShop.Utility
    @using Microsoft.AspNetCore.Http
    @inject IHttpContextAccessor HttpContextAccessor
    @{

        List<Laptop> laptops = HttpContextAccessor.HttpContext.Session.Get<List<Laptop>>("laptops");
        Laptop laptop = null;
        if (laptops != null)
        {
            laptop = laptops.FirstOrDefault(c => c.Id == Model.Id);
        }


    }

    <br />*@


<h2 class="text-info"> Product Details</h2>
</br></br>


@*<form method="post" asp-action="" enctype="multipart/form-data">*@
    <form method="post" asp-action="" enctype="multipart/form-data">
        <div class="row">
            <div class="col-1">

                <img src="~/@Model.Image" style="width:100%" onclick="myFunction(this);">
                </br></br>
                <img src="~/@Model.Image1" style="width:100%" onclick="myFunction(this);">
            </div>

            <div class="col-4 container">
                <span onclick="this.parentElement.style.display='none'" class="closebtn">&times;</span>
                <img id="expandedImg" style="width:100%">
                <div id="imgtext"></div>
            </div>
            <div class="col-4">
                <h2>@Model.Name</h2>

                <p><b>@Model.Description</b></p>

                <h4>@Model.Price $</h4>

               
                <small class="text-danger">Clearence</small>
                </br>
                <hr>
                <h4>Size:@Model.Size</h4>
                <h6>Product Color:@Model.ProductColor</h6>
                </br></br></br></br>


                <script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
                <div class="col-sm-12 col-xs-12 spinner-block">
                    <div class="number-spinner">

                        <div class="input-group number-spinner">
                            <b class="mr-4"> <label asp-for="@Model.Quantity"></label></b></br>
                            <span class="input-group-btn">
                                <button type="button" class="btn btn-default btn-number btncartsniper" data-type="minus" data-dir="dwn"><span class="fa fa-minus fa-sm"></span></button>
                            </span>
                            <input asp-for="@Model.Quantity" class="form-control input-number Snippper_qty" value="0" type="number">
                            <span class="input-group-btn">
                                <button type="button" class="btn btn-default btn-number btncartsniper" data-type="plus" data-dir="up"><span class="fa fa-plus fa-sm"></span></button>
                            </span>
                        </div>
                    </div>


                </div>
                @*@if (Model.Quantity > 0)
        {
            <h1>This Product Is InStock</h1>
        }
        else
        {
            <h1>Not InStock</h1>
        }*@
                </br>
                <input type="submit" class="btn btn-dark form-control" value="Add To Cart" />
            </div>


        </div>

below picture, I am successful to transfer data to ViewModel but next failed to data-bind.
enter image description here

enter image description here

I am a beginner. Please, anyone, help me

LouraQ · Accepted Answer · 2020-07-27 09:42:14Z

1

can't scope this image under input tag

As @Ben mentioned, you can use hidden input to store the value that img needs to pass like:

<img src="~/@Model.Image"  style="width:100%" onclick="myFunction(this);">
<input type="hidden" asp-for="Image">

Another way is to use ajax to pass any model you want:

  <img src="~/@Model.Image" style="width:100%" onclick="myFunction(this);" data="@Model.Image">
        
    <script>
             var productVm =
                {
                    //other fields
                    "Image": $("#Image").attr("data"),
                }
                $.ajax({
                    url: '/Home/Details',
                    type: 'POST',
                    contentType: 'application/json; charset=utf-8',
                    data: JSON.stringify(productVm)
                });
    </script>

answered Jul 27, 2020 at 9:42

LouraQ

6,9312 gold badges9 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

LouraQ Over a year ago

@Pritomsarkar, If this helps you solve your problem, please accept it as an answer. This will help others who have the same problem find the answer more easier.

Pritom Sarkar Over a year ago

extremely sorry for the late.

Ben Sampica · Accepted Answer · 2020-07-25 02:08:50Z

0

Your Quantity property is passing back through pb because it has an <input> property.

You need to make sure anything you want to pass back to POST action has an input tag associated with it. If you don't want the user to see it, type="hidden" is a good candidate. However, if those fields are not editable by a user you could simply just grab them in the POST action too if you need them.

answered Jul 25, 2020 at 2:08

Ben Sampica

3,4921 gold badge25 silver badges29 bronze badges

4 Comments

Pritom Sarkar Over a year ago

I want the user to see and change my quantity.but my above controller (Httpost) is received just users changeable quantity and id.can not receive another property.that means not totally data-bind here. that means here was not totally data-bind. but I want all data-bind data for using my cart system. I don't understand actually how I fix this problem.

Ben Sampica Over a year ago

Add anything you want to return back to your model as a hidden input.

Pritom Sarkar Over a year ago

Thanks, finally succeeded data-bind, but Image did not bind because can't scope this image under input tag, for that problem, what should I do.

Ben Sampica Over a year ago

If all you need is a string, just add a hidden input with the image url string? To be honest, from what I can see from your code the user is only allowed to input just a few things - everything else can be sent to the view, but shouldn't be sent back through the view model. Grab that information server side so that clients cannot accidentally or maliciously modify those fields.

Collectives™ on Stack Overflow

Model binding is not properly working in input parameter controller in .Net Core

2 Answers 2

2 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related