Click here to Skip to main content
15,894,646 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more: , +
Problem
The purpose of the logements indexpage is that the user must be able to change the value by simply enter the textbox, change it and leave the textbox.
The database value changes perfectly.
But the webgrid keeps showing the old value when I go to another page and get back to the index page
When I refresh the indexpage it shows the new value.

Tried
ModelState.Clear() to force the webgrid to pick up the new value from the database.
myObjectContext.Refresh(...) to update the model with the database values.

When I go to another page, clear the cache and get back it also shows the new value
so now I think I must clear the specific cache for the index View via LogementsController.

Model Logement

C#
public long LogementID { get; set; }
public string Naam { get; set; }
public string Omschrijving { get; set; }
public Nullable<decimal> PrijsPerNacht { get; set; }
public Nullable<System.DateTime> StartDatum { get; set; }
public Nullable<System.DateTime> EindDatum { get; set; }


LogementsController

C#
public JsonResult ChangeLogement(CustomObject obj)
{
        Logement oLogement = db.Logement.SingleOrDefault<Logement>(o => o.LogementID              == obj.ID);

        var oConverter =   TypeDescriptor.GetConverter(oLogement.GetType().GetProperty(obj.Property).PropertyType);

                oLogement.GetType().GetProperty(obj.Property).SetValue(oLogement, oConverter.ConvertFrom(obj.Value));

    db.SaveChanges();

    string message = "Success";

    return Json(message, JsonRequestBehavior.AllowGet);
}


Index
HTML
$('body').on('mouseout', '.edit-mode', function () {
        var td = $(this).parent();
        var tr = td.parent();

        var sLogementID = tr.find('#txtLogementID').val();

        if (!isNaN(sLogementID)) {
            var sCurrentID = '#' + $(this).attr('id');
            var sProperty = sCurrentID.substr(4);
            var sLabelID = '#' + $(this).prev().children('label').attr('id');

            var sValue = tr.find(sCurrentID).val();
            tr.find(sLabelID).text(sValue);

            var obj =
            {
                "ID": sLogementID,
                "Property": sProperty,
                "Value": sValue
            };

            $.ajax({
                url: '/Logements/ChangeLogement/',
                data: JSON.stringify(obj),
                type: 'POST',
                contentType: 'application/json; charset=utf-8',
                success: function () {

                 }
            });

            td.find('.edit-mode, .display-mode').toggle();
      }
    });

$('body').on('mouseleave', 'td', function () {
        var tr = $(this).parent();
        var sLogementID = tr.find('#txtLogementID').val();

        if (!isNaN(sLogementID)) {
           $(this).find('.edit-mode').hide();
           $(this).find('.display-mode').show();
        }
    });

@{
    var oGrid = new WebGrid(Model);
}

<div>
    @oGrid.GetHtml(
    tableStyle: "webgrid-table", headerStyle: "webgrid-header", footerStyle: "webgrid-footer", alternatingRowStyle: "webgrid-alternating-row",
                 selectedRowStyle: "webgrid-selected-row", rowStyle: "webgrid-row-style", mode: WebGridPagerModes.All,

        columns: oGrid.Columns(
        oGrid.Column(null, format: @&lt;input type="text" id="txtLogementID" value="@item.LogementID" />),
            oGrid.Column("clnNaam", "Naam", format: @<text>
            <span class="display-mode">&lt;label id="lblNaam">@item.Naam&lt;/label></span>&lt;input type="text" id="txtNaam" value="@item.Naam" class="edit-mode" /></text>),

        oGrid.Column("clnOmschrijving", "Omschrijving", format: @<text>
            <span class="display-mode">&lt;label id="lblOmschrijving">@item.Omschrijving&lt;/label></span>&lt;input type="text" id="txtOmschrijving" value="@item.Omschrijving" class="edit-mode" /></text>),
        oGrid.Column("clnPrijsPerNacht", "Prijs per nacht", format: @<text>
            <span class="display-mode">&lt;label id="lblPrijsPerNacht">@item.PrijsPerNacht&lt;/label></span>&lt;input type="text" id="txtPrijsPerNacht" value="@item.PrijsPerNacht" class="edit-mode" /></text>),
        oGrid.Column("clnVan", "Van", format: @<text>

            <span class="display-mode">&lt;label id="lblStartDatum">@(item.StartDatum != null ? item.StartDatum.ToShortDateString() : string.Empty)&lt;/label></span>&lt;input type="text" id="txtStartDatum" value="@(item.StartDatum != null ? item.StartDatum.ToShortDateString() : string.Empty)" class="edit-mode" /></text>),
        oGrid.Column("clnTot", "Tot", format: @<text>

            <span class="display-mode">&lt;label id="lblEindDatum">@(item.EindDatum != null ? item.EindDatum.ToShortDateString() : string.Empty)&lt;/label></span>&lt;input type="text" id="txtEindDatum" value="@(item.EindDatum != null ? item.EindDatum.ToShortDateString() : string.Empty)" class="edit-mode" /></text>),

        oGrid.Column("", "", style:"extra-kolom", format: @<text></text>)
         ))
    </div>
Posted
Updated 7-Aug-15 4:34am
v2

1 solution

I recommend you to use partial view.
You can make partial view and refresh it when parent page load.
When the content of textbox change, you can save it to temp variable(such as Session, ViewBag, ...) and when page reload, you can show this temp data in textbox.
In ChangeLogement method you can add some code to save data to temp variable.
For example "SESSION["CONTENT"] = obj.Value;"
In controller file
public ActionResult MainPage()
{
ViewBag.Content = SESSION["CONTENT"];
}

In partial view
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900