CODEWITHSUNDEEP
javascriptjqueryhtmlasp.net-mvc-5onchange
Readamus
Readamus

Reputation: 43

Update HTML.HiddenFor value with selected value form Dropdownlist

I have a simple form of sales information which users edit comments and reasons and then using the SaveChanges() function the data gets committed back to the database. I need to update a field which contains an ID number. I have a simple dropdownlist (populated by a viewbag) and when the user makes a change I want to update the ID number in the hiddenfor field so it can be posted back on save. My code is below:

EditorTemplate

   <tr>
@Html.HiddenFor(modelItem => modelItem.ID)
@Html.HiddenFor(modelItem => modelItem.tblTaggingGroupID)
@Html.HiddenFor(modelItem => modelItem.FinYear)
@Html.HiddenFor(modelItem => modelItem.FinWeek)
@Html.HiddenFor(modelItem => modelItem.WeekDay)
@Html.HiddenFor(modelItem => modelItem.Segment)
@Html.HiddenFor(modelItem => modelItem.NetSales)
@Html.HiddenFor(modelItem => modelItem.SwellSales)
@Html.HiddenFor(modelItem => modelItem.SpikeSales)
@Html.HiddenFor(modelItem => modelItem.BaseSales)
@Html.HiddenFor(modelItem => modelItem.tblTaggingReasonID)
<td>
    @switch (Model.WeekDay)
    {
        case 1:
            @:Sunday
            break;
        case 2:
            @:Monday
            break;
        case 3:
            @:Tuesday
            break;
        case 4:
            @:Wednesday
            break;
        case 5:
            @:Thursday
            break;
        case 6:
            @:Friday
            break;
        case 7:
            @:Saturday
            break;
        default:
            break;
    }
</td>
<td>
    @Html.DisplayFor(modelItem => modelItem.Segment)
</td>

<td>
    @Html.DisplayFor(modelItem => modelItem.NetSales)
</td>
<td>
    @Html.DisplayFor(modelItem => modelItem.SwellSales)
</td>
<td>
    @Html.DisplayFor(modelItem => modelItem.SpikeSales)
</td>
<td>
    @switch (Model.Recurring)
    {
        case true:
            Model.Recurring.ToString();
            break;
        case false:
            Model.Recurring.ToString();
            break;
        default:
            break;
    }
    @Html.EditorFor(modelItem => modelItem.Recurring)
</td>

<td>@Html.DropDownListFor(modelItem => modelItem.tblTaggingReasonID, (SelectList)ViewBag.Reasons, "Please Select")</td>
<td>
    @Html.EditorFor(modelItem => modelItem.Comment, new { @class = "Commenttxt" })
</td>

Controller:

        public ActionResult Index()
    {
        var SelectedID = Convert.ToInt32(Session["_SessionSelectGroupID"]);
        var SelectedYear = Convert.ToInt32(Session["_SessionSelectFinYear"]);
        var SelectedWeek = Convert.ToInt32(Session["_SessionSelectFinWeek"]);
        var tblTaggingGroupInstances = db.tblTaggingGroupInstances.Include(t => t.tblTaggingGroup);

         ViewBag.Reasons = new SelectList(db.tblTaggingReasons,"ID","UpliftReason");

        return View(tblTaggingGroupInstances.Where(t => t.tblTaggingGroupID == SelectedID && t.FinYear == SelectedYear && t.FinWeek == SelectedWeek).ToList());
    }
    [HttpPost]
    public ActionResult Index(List<tblTaggingGroupInstance> model)
    {
        foreach (var record in model)
        {
            db.Entry(record).State = EntityState.Modified;
        }
        db.SaveChanges();
        return RedirectToAction("Details");
    }

I'm assuming this can be done with some simple JQuery or Javascript but, everything I have tried so far falls over?

Upvotes: 0

Views: 1775

Answers (2)

user3559349
user3559349

Reputation:

There is no need to use javascript to update the hidden input. Instead just bind directly to the property

@Html.DropDownList(m => m.tblTaggingReasonID, (SelectList)ViewBag.Reasons, "Please Select")

and remove the hidden input from the view.

Upvotes: 1

Kartikeya Khosla
Kartikeya Khosla

Reputation: 18893

Attach change() event with #Reasons and update #tblTaggingReasonID value. As shown :-

$("#Reasons").on("change",function(){
   $("#tblTaggingReasonID").val(this.value)
});

Don't forget to include jQuery file in your page.

Upvotes: 0

Related Questions