This is a migrated thread and some comments may be shown as answers.

Get value from dropdownlist in popup grid

1 Answer 247 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Machriza
Top achievements
Rank 1
Machriza asked on 16 Nov 2017, 03:30 AM

Dear All,

Can you help me :)

I want to get value from dropdownlist in popup in grid.I have dropdownlist TransactionId,i want get automactically value in field outstanding Amount whatever in transaction id is primary key from outsatnding amount. 

 

My view:

<div>
    @(Html.Kendo().Grid<DevRedsMk3.Models.NpvCalculation>()
        .Name("NpvCalculation")
        .Columns(columns =>
        {
            columns.Bound(p => p.NpvCalculationId).Hidden();
            columns.ForeignKey(p => p.TransactionId, (System.Collections.IEnumerable)ViewData["custTrans"], "TransactionId", "TransactionId").Title("TransactionId ID");
            columns.Bound(p => p.LastPayment).Title("Last Payment");
            columns.Bound(p => p.OutstandingAmount).Title("Outstanding Amount");
            columns.Bound(p => p.Installment).Title("Installment");
            columns.Bound(p => p.Interest).Title("Interest");//Title("Interest").Editable(false)

            columns.Command(command => { command.Edit(); command.Destroy(); }).Width(150);
            columns.Command(c => c.Custom("OK").Text("OK").Click("OK"));
        })
        .ToolBar(toolbar =>
        {
            toolbar.Create();
        })
        .Events(e => {  e.DataBound("onchangeevent"); })
        .Editable(editable => editable.Mode(GridEditMode.PopUp))
        .Scrollable(s => s.Height(570))
        .Sortable()
        .Pageable(pageable => pageable
            .Refresh(true)
            .PageSizes(true)
            .ButtonCount(5))
        .DataSource(datasource => datasource
             .Ajax()
             .ServerOperation(false)
             .Model(model =>
             {
                 model.Id(p => p.NpvCalculationId);
                 model.Field(p => p.Interest).Editable(false);

             })

             .Read(read => read.Action("List", "NpvCalculations"))
             .Update(update => update.Action("Update", "NpvCalculations"))
             .Create(create => create.Action("Create", "NpvCalculations"))
             .Destroy(destroy => destroy.Action("Destroy", "NpvCalculations"))

        )
    )

    <script type="text/javascript">
        function OK(e) {
            e.preventDefault();
            var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
            
            $.ajax({
                url: "/NpvCalculations/GenerateNpvBaru",
                //data: dataItem.id,
                //data: { 'TransactionId': dataItem.TransactionId },
                data: { TransactionId: dataItem.TransactionId },
                success: function (response) {
                    //$('#viewDetails').html(response);
                    //alert('Approve done...');
                }
            });
        }
    </script>

    <script>
        function onchangeevent() {
            $('#OutstandingAmount').val('10000');
        }

    </script>

</div>

 

 

Thanks for your help,

 

Regards,

 

Madeck

1 Answer, 1 is accepted

Sort by
0
Stefan
Telerik team
answered on 20 Nov 2017, 09:52 AM
Hello, Machriza,

Thank you for the provided details.

This could be achieved with a custom popup editor. It will require setting a change event to the DropDown editor used for the ForeignKey field. Then in that event the retrieve the value of the DropDown and to programmatically set it to the TextBox which holds the OutstandingAmount value:

https://docs.telerik.com/kendo-ui/api/javascript/ui/dropdownlist#events-change

https://docs.telerik.com/kendo-ui/api/javascript/ui/dropdownlist#methods-value

I can suggest checking the following example demonstrating how to use a custom popup editor:

https://docs.telerik.com/aspnet-mvc/helpers/grid/how-to/editing/custom-popup-editor

If additional assistance is needed, please provide a fully runnable example and I will gladly assist.

Regards,
Stefan
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Grid
Asked by
Machriza
Top achievements
Rank 1
Answers by
Stefan
Telerik team
Share this question
or