How to sum html data table column with matching and showing in footer

Question

User-2035378889 posted

Dear Every one I want to Sum html data table column  with ID is  Amount

In Dr total  if dr/cr equal to 'Dr' and in Cr Total if dr/cr equal to 'Cr'

here is my html code

@model PharmaApp.Core.DataModel.LedgersModel

@{
    ViewBag.Title = "Create";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<style type="text/css">
    .bg_1 {
        background-color: green;
    }

    .amt {
        font-size: x-large;
        font-weight: 500;
        background-color: #6ce26c;
        height: 50px;
        color: #ffffff;
        border-color: transparent
    }

    .bg_2 {
        background-color: gray;
    }

    .error_msg {
        color: #f00;
        display: none;
    }

    .table {
        /* width: 100%; */
        /* max-width: 100%; */
        margin-bottom: 0px;
    }
</style>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/css/bootstrap-datepicker3.css" rel="stylesheet" />
<div class="wraper container-fluid">
    <div class="page-title">
        <h3 class="title">GV/JV </h3>
    </div>
    <div class="row">
        <div class="col-lg-10 col-md-offset-1">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h3 class="panel-title">New Voucher</h3>
                </div>
                <div class="panel-body">
                    @using (Html.BeginForm("Create", "Ledgers", FormMethod.Post))
                    {
                        @Html.AntiForgeryToken()

                        <div class="col-md-4">
                            <div class="form-group">
                                <label for="EntryId">Voucher No.</label>
                                @Html.EditorFor(model => model.EntryId, new { htmlAttributes = new { @class = "form-control", id = "Vno" } })
                                @Html.ValidationMessageFor(model => model.EntryId, "", new { @class = "text-danger" })
                            </div>
                        </div>
                         <div class="col-md-4">
                            <div class="form-group">
                                <label for="Date"> Date: </label>
                                @Html.TextBox("EntryDate", null, new { @class = "form-control mydatepicker", @placeholder = "Select Date ", onchange = "blankme(this.id)", id = "Dt" })

                                @Html.ValidationMessageFor(model => model.EntryDate, "", new { @class = "text-danger" })
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label for="EntryId"> Bill No</label>
                                @Html.EditorFor(model => model.BillNo, new { htmlAttributes = new { @class = "form-control", id = "Billno" } })
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label for="Name"> Account Name: </label>
                                <select id="Accounts" class="form-control">
                                    <option value="">Select Account</option>
                                </select>
                                @Html.ValidationMessageFor(model => model.Acid, "", new { @class = "text-danger" })
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label for="Descripation">Narration.</label>
                                @Html.EditorFor(model => model.Deacripation, new { htmlAttributes = new { @class = "form-control", id = "Narr" } })
                                @Html.ValidationMessageFor(model => model.Deacripation, "", new { @class = "text-danger" })
                            </div>
                        </div>

                        <div class="col-md-4">
                            <div class="form-group">
                                <label for="EntryId">Amount.</label>
                                @Html.EditorFor(model => model.Amount, new { htmlAttributes = new { @class = "form-control" , id = "Amount1" } })
                                @Html.ValidationMessageFor(model => model.Amount, "", new { @class = "text-danger" })
                            </div>
                        </div>

                        <div class="form-group col-md-4" style="margin-left:20px;width:100px">
                            <label for="Drcr"> Dr/Cr: </label>
                            @Html.DropDownList("Drcr", new List<SelectListItem>
                                {
                                    new SelectListItem() {Text = "Dr", Value="Dr"},
                                    new SelectListItem() {Text = "Cr", Value="Cr"},
                                },  new { @class = "form-control", onchange = "blankme(this.id)", id = "Drcr" })

                            @Html.ValidationMessageFor(model => model.Drcr, "", new { @class = "text-danger" })
                        </div>
                        <br><br />
                        <div class="form-group m-b-0">
                            <button type="submit" id="addToIe" class="btn btn-info">
                                Add To List
                            </button>
                        </div>

                        <br><br />
                        <div class="col-md-offset-1 col-md-12" style="width:1100px;float:left;margin-right:50px;margin-left:0px;padding-left:0px">
                            <br />
                            <div class="panel panel-color panel-primary">
                                <div class="panel-heading">
                                    <h3 class="panel-title" style="text-align:center">Voucher List</h3>
                                </div>
                                <div class="panel-body" style="width:1100px">
                                    <table class="table table-hover table-responsive1" id="detailsTable1">
                                        <thead>
                                            <tr>
                                                <th>Ac.Id</th>
                                                <th>V.No</th>
                                                <th>Date</th>
                                                <th>Bill No.</th>
                                                <th style="width:300px">Accounts</th>
                                                <th style="width:500px">Narration</th>
                                                <th style="text-align:right">Amtount</th>
                                                <th style="width:50px"></th>
                                                <th>Dr/Cr</th>
                                            </tr>
                                        </thead>
                                        <tbody></tbody>
                                        <tfoot>
                                            <tr>
                                                <td></td>
                                                <td></td>
                                                <td></td>
                                                <td></td>
                                                <td></td>
                                                <td></td>
                                                <td></td>
                                                <td></td>
                                                <td></td>
                                                <td></td>
                                                <td> <strong> CrTotal:</strong> </td>
                                                <td> <strong> CrTotal:</strong> </td>
                                                <td> <strong id="DrTotal">  </strong> </td>
                                                <td> <strong id="CrTotal">  </strong> </td>
                                                <td></td>
                                            </tr>
                                        </tfoot>
                                    </table>
                                </div>
                            </div>
                        </div>

                        <div class="form-group">
                            <div class="col-md-offset-2 col-md-10">
                                <input id="BtnSave" class="btn btn-success col-md-3 pull-right" type="submit" value="Save Voucher" />
                               
                            </div>
                        </div>

                    }
                </div>
            </div>
            <div>
                @Html.ActionLink("Back to List", "Index")
            </div>
        </div>
    </div>
</div>

and this is my JS

@section scripts {
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/js/bootstrap-datepicker.js"></script>

    @Scripts.Render("~/bundles/App")

    @*<script>

            $(function () {

                $("#Supplier").Select2();

            });

        </script>*@
    <script type="text/javascript">
     

        $("#addToIe").click(function (e) {
            e.preventDefault();
            var accountId = $("#Accounts option:selected").val(),
                accountsName = $("#Accounts option:selected").text(),
                vno = $("#Vno").val(),
                dt = $("#Dt").val(),
                billno = $("#Billno").val(),
                narr = $("#Narr").val(),
                amountt = $("#Amount1").val(),
                drcr = $("#Drcr").val(),
                
                detailsTableBody = $("#detailsTable1 tbody");
            var productItem1 = '<tr><td> ' + accountId + ' </td><td>' + vno + '</td><td>' + dt + '</td><td>' + billno + '</td><td>' + accountsName + '</td> <td>' + narr + '</td><td class="Amountt">' + amountt + '</td><td> ' + drcr + '</td><td><a data-itemId="0"  href="#" class="deleteItem"><i class="fa fa-trash"></i></a></td></tr>';
            detailsTableBody.append(productItem1);
            calculateSum2();
            $("#Amountt").val('');

        });

        function calculateSum2() {
            var sum1 = 0;
            
             $(".Amountt").each(function () {
                var value = $(this).text();
                if (!isNaN(value) && value.length !== 0) {
                    sum1 += parseFloat(value)
                
                }
            });

            if (sum1 == 0.0) {
                $('#Amount1').text("0");
                $('#DrTotal').text("0")
            }
            $('#DrTotal').text(sum1.toFixed(2));
            $('#CrTotal').text(sum1.toFixed(2));
            var b = parseFloat($('#DrTotal').text()).toFixed(2);

            if (isNaN(b)) return;
            var a = parseFloat($('#CrTotal1').text()).toFixed(2);

            var grandTotal = parseFloat(a);
            $('#DrTotal').text(grandTotal.toFixed(2));
        };
        //$("#addToList").click(function (e) {
        //    e.preventDefault(); if (add_validation()) {
        //        var productId = $("#Medicine option:selected").val(), productName = $("#Medicine option:selected").text(), quantity = $("#Quantity").val(), bagweight = $("#Bagweight").val(), bardanaweight = $("#Bardanaweight").val(), weight = $("#Weight").val(), muns = $("#Muns").val(), price = $("#Price").val(), detailsTableBody = $("#detailsTable tbody"); var productItem = '<tr> <td> ' + productId + ' </td> + <td>' + productName + '</td><td>' + quantity + '</td><td>' + bagweight + '</td><td>' + bardanaweight + '</td><td>' + weight + '</td><td> ' + muns + '</td ><td>' + price + '</td><td class="Amount">' + (parseFloat(price) * parseInt(muns)).toFixed(2) + '</td><td><a data-itemId="0"  href="#" class="deleteItem"><i class="fa fa-trash"></i></a></td></tr>'; detailsTableBody.append(productItem); calculateSum(); $("#Amount").val('')

        //    }

        //});

        $(document).ready(function () {
            $.ajax({ type: "GET", url: "/Admin/GetSupplier", datatype: "Json", success: function (data) { $.each(data, function (index, value) { $('#Supplier').append('<option value="' + value.Id + '">' + value.Name + '</option>') }) } });
            $.ajax({ type: "GET", url: "/Admin/Getbroker", datatype: "Json", success: function (data) { $.each(data, function (index, value) { $('#Accounts').append('<option value="' + value.Id + '">' + value.Name + '</option>') }) } });
            $.ajax({ type: "GET", url: "/Admin/GetMedicinesByCategory", datatype: "Json", success: function (data) { $.each(data, function (index, value) { $('#Medicine').append('<option value="' + value.Id + '">' + value.Name + '</option>') }) } });
            $("#Quantity").change(function () { blankme("Quantity") });

        });
            //ok//

    </script>
}

     

Answer 1

User1535942433 posted

Hi ABDULLAH ANOTECH,

Dear Every one I want to Sum html data table column  with ID is  Amount

In Dr total  if dr/cr equal to 'Dr' and in Cr Total if dr/cr equal to 'Cr'

According to your description,I don't understand your requirement clearly.Could you post sample your need to us?It will help us to solve your problems.

Best regards,

Yijing Sun

Answer 2

User-2035378889 posted

Thanks for  responding brother I solved my problem myself 

now I have an other problem 

Error activating ILedgerRepository
No matching bindings are available, and the type is not self-bindable.
Activation path:
 2) Injection of dependency ILedgerRepository into parameter ledgerRepository of constructor of type LedgersController
 1) Request for LedgersController

Suggestions:
 1) Ensure that you have defined a binding for ILedgerRepository.
 2) If the binding was defined in a module, ensure that the module has been loaded into the kernel.
 3) Ensure you have not accidentally created more than one kernel.
 4) If you are using constructor arguments, ensure that the parameter name matches the constructors parameter name.
 5) If you are using automatic module loading, ensure the search path and filters are correct

This is my  Controller 

using PharmaApp.Core.AppData;
using PharmaApp.Data.AuthHelper;
using PharmaApp.Core.DataModel;
using PharmaApp.Core.Interface;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Web;
using System.Data;
using System.Web.Mvc;
using PharmaApp.Core.ViewModel;
using PharmaApp.Web.Reports;
using System.Web.Security;

    public class LedgersController : Controller
    {     
      
        private readonly ILedgerRepository _ledgerRepository;

        public LedgersController(ILedgerRepository ledgerRepository)
           
      
        {
         
            _ledgerRepository = ledgerRepository;
        }
        // GET: Admin

        #region ledgers
        [HttpGet]
        public ActionResult Ledgers()
        {
            return View();
        }
        [HttpPost]
        public ActionResult Ledgers(LedgersModel model)
        {
            if (ModelState.IsValid)
            {
                _ledgerRepository.Insert(model);

                foreach (var item in model.Items)
                {
                    var stock = _ledgerRepository.All().SingleOrDefault(x => x.Acid == item.Acid);
                    // add new stock
                    _ledgerRepository.Insert(new LedgersModel { Acid = item.Acid, EntryId = item.EntryId, BillNo = item.BillNo, EntryDate = item.EntryDate, Deacripation = item.Deacripation, CrAmount = item.CrAmount, DrAmount = item.DrAmount, Sp = "GV" });

                }
                return Json(new { error = false, message = "Purchse saved successfully" });
            }
            return Json(new { error = true, message = "failed to save Purchse" });
        }

        public ActionResult List()
        {
            return View(_ledgerRepository.All());
        }

        [HttpGet]
        public ActionResult Editledgers(int ID)
        {
            var ledgers = _ledgerRepository.Find(ID);
            if (ledgers != null)
            {
                return View(model: ID);
            }
            return RedirectToAction("List");
        }

        [HttpPost]
        public ActionResult Updateledgers(LedgersModel model)
        {
            if (ModelState.IsValid)
            {
                // remove 
                var items = _ledgerRepository.All().Where(x => x.Id == model.Id).ToList();
                if (items.Any())
                {
                    //subtract item quantity from stock
                    foreach (var item in items)
                    {
                        var stock = _ledgerRepository.All().SingleOrDefault(x => x.Acid == item.Acid);
                        // add new stock
                        _ledgerRepository.Insert(new LedgersModel { Acid = item.Acid, EntryId = item.EntryId, BillNo = item.BillNo, EntryDate = item.EntryDate, Deacripation = item.Deacripation, CrAmount = item.CrAmount, DrAmount = item.DrAmount, Sp = "GV" });

                    }
                    //remove from ledgers item
                    foreach (var item in items)
                    {
                        _ledgerRepository.Remove(item.Id);
                    }
                }

                var ledgers = _ledgerRepository.Find(model.Id);

                foreach (var item in model.Items)
                {
                    ledgers.Items.Add(new LedgersModel
                    {
                        Acid = item.Acid,
                        EntryId = item.EntryId,
                        BillNo = item.BillNo,
                        EntryDate = item.EntryDate,
                        Deacripation = item.Deacripation,
                        CrAmount = item.CrAmount,
                        DrAmount = item.DrAmount,
                        Sp = "Gv",

                    });
                }
                _ledgerRepository.Update(ledgers);

                // add quantity to stock and or add new 

                return Json(new { error = false, message = "Purchse updated successfully" });
            }
            return Json(new { error = true, message = "failed to Update Purchsed" });
        }

        public ActionResult Delete(int ID)
        {
            var items = _ledgerRepository.All().Where(x => x.Id == ID).ToList();
            if (items.Any())
            {
                // subtract item quantity from stock

            }
            _ledgerRepository.Remove(ID);

            return RedirectToAction("List");
        }

        #endregion

    }

Thanks again

Answer 3

User1535942433 posted

Hi ABDULLAH ANOTECH,

According to your description and error,do you have use Ninject in Service? This error is about Ninject. You could check your service or update versions of packages.

By the way,each thread only post one problems.If you have other questions,you could post new threads.It's helpful to more members to look for you.

More details,you could refer to below articles:

https://stackoverflow.com/questions/40150986/no-matching-bindings-are-available-and-the-type-is-not-self-bindable-error-act

https://stackoverflow.com/questions/13466406/ninject-withconstructorargument-no-matching-bindings-are-available-and-the-ty

Best regards,

Yijing Sun