How to change EditorFor Value(From value in DB) based on DropDownListFor onChange?

Question

I want to change the value in my EditorFor to a value from my DB, based on a selection from my DropDownFor.

Code to pull value to go into TextboxFor in my Controller:

using (RexusTradingEntities RTE = new RexusTradingEntities())
        {
            if (PIVM.Pipe_Absolute_Roughness_Override != null || PIVM.Pipe_Absolute_Roughness_Override != 0)
            {
                PIVM.Pipe_Absolute_Roughness = Convert.ToDecimal(PIVM.Pipe_Absolute_Roughness_Override);
            }
            else
            {
                var PipeAbsoluteRoughness = (from P in RTE.ProjectInformations
                                       join PM in RTE.PipeMaterials on P.Pipe_Material equals PM.Material_Name
                                       where P.pkiProjectID == id
                                       select PM).SingleOrDefault();

                PIVM.Pipe_Absolute_Roughness = Convert.ToDecimal(PipeAbsoluteRoughness.Material_Value);
            }
        }

View:

@Html.EditorFor(model => model.Pipe_Absolute_Roughness, new { htmlAttributes = new { @class = "form-control col-md-5" } })

This works when loading the View the first time, but I want the value in the EditorFor to change when ever the DropDownFor selected value changes.

I would like this same EditorFor value to change when the following EditorFor Value changes :

@Html.EditorFor(model => model.Pipe_Absolute_Roughness_Override, new { htmlAttributes = new { @class = "form-control" } })

I would appreciate the help, as I am still pretty new to MVC and still learning the ropes.

Thanks for any help.

You can add @onchange as html attribute and then use... let's say javascript to do the value changes. The DropDownListFor would be something like this: `@Html.DropDownListFor(model => model.selectedDropDownItem, new SelectList(Model.DropDownListInstance, "Value", "Text"), new { @class = "form-control" , @onchange="Javascript_Function()" })` — Shawn Yan, Jun 16 '16 at 01:50
@ShawnYan Thanks. So if I want to pull values from my DB, how would I do this in the Javascript function ? — AxleWack, Jun 20 '16 at 06:31
From what I understand , you want to pull value from DB to populate dropdownlist? If so you can refer to [this](http://stackoverflow.com/questions/28330970/populating-a-dropdown-dynamically-with-data-returned-from-database) — Shawn Yan, Jun 20 '16 at 07:07
What im looking for, as described in my post, is to populate an EditorFor with a value from my DB, based on a selection from my DropDownListFor. The @onchange will be exactly what I need to use, but I will need to still pull data from my DB, using javascript or even json to pull the data and pass to my EditorFor — AxleWack, Jun 20 '16 at 08:12

score 0 · Accepted Answer · answered Jun 20 '16 at 09:01

Got it sorted. I am posting what I did below. Please note that I am only providing the specific items I used, not everything(for example, I did not post the entire View, only the parts I used)

View :

@Html.DropDownListFor(model => model.Pipe_Material, Model.Pipe_MaterialList, new { @class = "form-control", id = "ddlPipe_Material", @onchange = "ChangePipeMaterialValue(this.value)" })

@Html.EditorFor(model => model.Pipe_Absolute_Roughness, new { htmlAttributes = new { @class = "form-control col-md-5", @id = "txtPipe_Absolute_Roughness" } })

@section scripts
    {
    <script src="@Url.Content("~/bootstrap.min.js")"></script>
    <script src="@Url.Content("~/jquery-2.2.3.min.js")" type="text/javascript"></script>
    <script>

        function ChangePipeMaterialValue(val) {
            //var Pipe_Material = $("#ddlPipe_Material").val();

            var ProjectDetails =
            {
                "Pipe_Material": val
            };

            $.ajax({

                url: '/ProjectInformation/GetPipeMaterialValues/',
                data: JSON.stringify(ProjectDetails),
                type: 'POST',
                contentType: 'application/json; charset=utf-8',
                success: function (data) {
                    var m = $('#txtPipe_Absolute_Roughness');
                    m.val(data);
                }
            });
        }
    </script>
    }

Controller :

[HttpPost]
        public JsonResult GetPipeMaterialValues(ProjectInformationViewModel model)
        {
            decimal PipeMaterialValue;

            using (RexusTradingEntities RTE = new RexusTradingEntities())
            {
                    var PipeMaterialValueQuery = (from PM in RTE.PipeMaterials
                                        where PM.Material_Name == model.Pipe_Material
                                        select PM).FirstOrDefault();

                PipeMaterialValue = Convert.ToDecimal(PipeMaterialValueQuery.Material_Value);
            }

                return Json(PipeMaterialValue, JsonRequestBehavior.AllowGet);
        }

In fact, I do not even need to pass the model through to the Controller, I can just pass the parameter "val" through to the URL as well, but I am leaving it as is, as it does the job. I hope this helps someone else in the future.

jacek · Answer 2 · 2020-08-24T12:37:32.917

0

@Html.EditorFor(model => model.Pipe_Absolute_Roughness_Override, new { htmlAttributes = new { @Value=@Html.ValueFor(x=>x.Pipe_Absolute_Roughness) , @class = "form-control" } })

this is not a dropdown, but it can also be useful

edited Aug 24 '20 at 12:37

answered Aug 24 '20 at 12:31

jacek

311
3
8

How to change EditorFor Value(From value in DB) based on DropDownListFor onChange?

2 Answers2