Change event on Dropdown list ,populate label

Analyst_SQL 3,551 Reputation points
2023-03-15T18:02:54.8833333+00:00

I have table 

Create table #SalesOrder (orderno int,Order_Date date)
Create table #OrderDetail (ID int,orderno int,orderqty int) 

Insert into #SalesOrder values(11,'2023-03-15')
insert into #OrderDetail Values(1,11,25)
insert into #OrderDetail Values(2,11,25)
insert into #OrderDetail Values(3,11,25)
insert into #OrderDetail Values(4,11,25)

Controller action

        public ActionResult Index()
        {
            var orderID = 0;
            ViewBag.orderID = new SelectList(DB.SalesOrders.Where(bt => bt.OrderNo > orderID && bt.Status == "Open"), "Orderno", "Order_Ref_No", "0");
            return View();
        }

        [HttpGet]
        public JsonResult GetOrderno(int orderId)
        {
            int? orderID = DB.SalesOrders.First(a => a.OrderNo == orderId).OrderNo;
            var STATUS_LIST = (from od in DB.OrderDetails
                               where od.OrderNO == orderID
                               select new 
                               {
                                  od.orderqty
                               }).ToList();

         var   sumqty = STATUS_LIST.Select(c => c.orderqty).Sum();
            return Json(sumqty, JsonRequestBehavior.AllowGet);
        }
    }

View

@model ERP_APP.Models.SalesOrderMV

@{

}



<body>
    <div class="col-lg-8">
        <div class="card card-default mb-5">
            <div class="card-header" style="font-size:x-large">Big Bale Form</div>
            <div class="card-body">
                @Html.ActionLink("Create New", "CreateBigBale", null, new { @class = "btn btn-primary" })
                @using (Html.BeginForm("CreateBigBale", "BigBale", FormMethod.Post, new { @target = "_blank" }))
                {
                    @Html.AntiForgeryToken()

                <div class="form-horizontal">
                    <hr />
                    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
                    @Html.HiddenFor(u => u.OrderNo)



                    <div class="form-group">
                        @Html.LabelFor(model => model.OrderNo, "Select Item", htmlAttributes: new { @class = "control-label col-md-2" })
                        <div class="col-md-3">


                            @Html.DropDownList("orderID", (SelectList)ViewBag.OrderNo, "Select", htmlAttributes: new { @class = "form-control", @id = "select2-1" })

                            @Html.ValidationMessageFor(model => model.OrderNo, "", new { @class = "text-danger" })
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-md-3">

                            @Html.DropDownList("DDLPacktype", new List<SelectListItem>()
        {
        new SelectListItem(){ Text= "One", Value = "1"},
        new SelectListItem(){ Text= "Two", Value = "2"},
        new SelectListItem(){ Text= "Three", Value = "3"}, }, "Select ", htmlAttributes: new { @class = "form-control", @id = "select2-2" })


                        </div>
                    </div>
                   


                    <div class="form-group">

                        <div class="col-md-10">
                            @Html.DisplayFor(model => model.orderqty, new { htmlAttributes = new { @class = "form-control", @id = "Order_Qty" } })
                            @Html.ValidationMessageFor(model => model.orderqty, "", new { @class = "text-danger" })
                        </div>


                    </div>


                    <div class="form-group">
                        <div class="col-md-offset-2 col-md-10">
                            <input type="submit" value="Create" class="btn btn-default" />
                        </div>
                    </div>
                </div>
                }
                <div>
                    @Html.ActionLink("Back to List", "AllDesignation")
                </div>
            </div>
        </div>
    </div>
</body>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

<script type="text/javascript">
    $(document).ready(function () {
        $("#select2-1").change(function () {
            var orderId = $("#select2-1").val();
            if (orderId != "") {
                GetOrderno(orderId);
            }
            else {
                $("#Order_Qty").empty();

            }

        });
    });

    function GetOrderno(orderId) {
        $.ajax({
            async: true,
            type: 'GET',
            dataType: 'JSON',
            contentType: 'application/json; charset=utf-8',
            url: '/OrderPack/GetOrderno',
            data: { orderId: orderId },
            success: function (data) {

                $('#Order_Qty').empty();
                $(data).each(function (index, item) {
                    $('#Order_Qty').append($('<option/>', { value: item.Value }))
                })
            },
            error: function () {
                alert("There is some problem to get.");
            }
        });
    }

</script>

I want when change value in dropdown ,then Action GetOrderno call and populate value in label,i tried ,but not working,

Data will populate in label accordingly orderno

ASP.NET
ASP.NET
A set of technologies in the .NET Framework for building web applications and XML web services.
3,272 questions
C#
C#
An object-oriented and type-safe programming language that has its roots in the C family of languages and includes support for component-oriented programming.
10,277 questions
Accepted answer
  1. AgaveJoe 26,136 Reputation points
    2023-03-15T21:01:02.8566667+00:00

    Dude, clean up your code before asking questions.

    Mock models

        public class OrderDetail
    {
        public int Id { get; set; }
        public int OrderNo { get; set; }
        public int Quantity { get; set; }
    }

    public class SalesOrder
    {
        public int OrderNo { get; set; }
        public DateTime OrderTime { get; set; }
    }

    public class OrderVm
    {
        public int OrderNo { get; set; }
        public int Quantity { get; set; }
    }

    Controller

        public class OrderPackController : Controller
    {
        private List<OrderDetail> orderDetails;
        private List<SalesOrder> orders;
        public OrderPackController()
        {
            orderDetails = new List<OrderDetail>()
            {
                new OrderDetail() {Id = 1, OrderNo = 11, Quantity = 25},
                new OrderDetail() {Id = 2, OrderNo = 11, Quantity = 10},
                new OrderDetail() {Id = 3, OrderNo = 12, Quantity = 4},
                new OrderDetail() {Id = 4, OrderNo = 13, Quantity = 7}
            };

            orders = new List<SalesOrder>()
            {
                new SalesOrder() {OrderNo = 11, OrderTime=DateTime.Now.AddDays(-2)},
                new SalesOrder() {OrderNo = 12, OrderTime=DateTime.Now.AddDays(-2)},
                new SalesOrder() {OrderNo = 13, OrderTime=DateTime.Now.AddDays(-2)},
            };
        }
        // GET: OrderPack
        public ActionResult Index()
        {
            ViewBag.orderID = new SelectList(orders, "OrderNo", "OrderTime");
            return View();
        }

        [HttpGet]
        public JsonResult GetOrderno(int orderId)
        {
            OrderVm vm = new OrderVm();
            vm.OrderNo = orderId;
            vm.Quantity = orderDetails.Where(o => o.OrderNo == orderId).Sum(o => o.Quantity);
            return Json(vm, JsonRequestBehavior.AllowGet);
        }
    }

    View

    @model MvcIdentity.Models.OrderVm
@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>

<div class="form-group">
    @Html.LabelFor(model => model.OrderNo, "Select Item", htmlAttributes: new { @class = "control-label col-md-2" })
    <div class="col-md-3">
        @Html.DropDownList("orderID", (SelectList)ViewBag.OrderNo, "Select", htmlAttributes: new { @class = "form-control", @id = "select2-1" })
    </div>
    @Html.LabelFor(model => model.Quantity, "Quantity goes here", htmlAttributes: new { @class = "control-label col-md-2", @id = "quantity-label"})
    @Html.HiddenFor(Model => Model.Quantity)
</div>

@section scripts {
    <script>

        $("#select2-1").change(function () {
            //console.log($("#select2-1").val());

            var orderId = $("#select2-1").val();
            if (orderId != "") {
                GetOrderno(orderId);
            }
            else {
                $("#quantity-label").text("Quantity goes here");
                $("#Quantity").empty();
            }
        });
 

        function GetOrderno(orderId) {
            
            $.ajax({
                async: true,
                type: 'GET',
                dataType: 'JSON',
                url: '/OrderPack/GetOrderno',
                data: { orderId: orderId },
                success: function (data) {
                    console.log(data);
                    //populate the hidden field
                    $("#Quantity").val(data.Quantity);
                    //populate the label
                    $("#quantity-label").text(data.Quantity);
                },
                error: function () {
                    alert("There is some problem to get.");
                }
            });
        }
    </script>
    }
    1 person found this answer helpful.

0 additional answers

Sort by: Most helpful
Most helpful Newest Oldest