保存后重新渲染标签

时间:2016-11-29 17:15:42

标签: visual-studio-lightswitch

使用Visual Studio 2015 CE和LightSwitch HTML客户端

我有四个属性(严重,高,中,低),数据类型为Int。我有另一个属性(Risk),其数据类型为string,我想根据四个Int属性值更改css颜色。

在ViewDetails屏幕中,我将字符串属性Risk显示为标签。当四个Int属性中的一个更改并满足特定条件时,我需要能够更改标签ex:.css("color", "red");的颜色。使用_postRender函数可以很好地设置初始颜色,但如果我打开编辑屏幕并修改值,则Risk不会重新渲染。我怎样才能重新渲染风险?我已尝试在dataBind事件中为四个Int属性中的每一个设置_postRender。我遇到的问题是element事件中提供的_postRender参数不是风险标签。其他任何尝试都没有取得多大成功。

1 个答案:

答案 0 :(得分:1)

是的,在添加屏幕上,我有以下代码:

/// <reference path="~/GeneratedArtifacts/viewModel.js" />

var cri;
var hig;
var med;
var low;

myapp.AddEditAlarm.created = function (screen) {

    //GET THE VALUES ON THE ADD/EDIT SCREEN CREATION
    cri = screen.Alarm.Critical;
    hig = screen.Alarm.High;
    med = screen.Alarm.Medium;
    low = screen.Alarm.Low;


};
myapp.AddEditAlarm.Save_execute = function (screen) {

    if (screen.Alarm.AlarmStatus == null) {
        //NEW ALARM STATUS
        screen.Alarm.AlarmStatus = 0;
        //WHATEVER YOU WANT TO SET IT AS HERE
    }
    else {
        //HAS IT CHANGED?
        if (screen.Alarm.Critical == cri) {
            //VALUE CHANGED
            screen.Alarm.AlarmStatus = screen.Alarm.Critical;
        }
        else if (screen.Alarm.High == hig) {
            //VALUE CHANGED
            screen.Alarm.AlarmStatus = screen.Alarm.High;
        }
        else if (screen.Alarm.Medium == med) {
            //VALUE CHANGED
            screen.Alarm.AlarmStatus = screen.Alarm.Medium;
        }
        else if (screen.Alarm.Low == low) {
            //VALUE CHANGED
            screen.Alarm.AlarmStatus = screen.Alarm.Low;
        }
    }

    myapp.commitChanges();
};

我已经声明了4个变量,这些变量可以在自定义保存按钮和创建的事件中访问。在屏幕创建上,我将这4个变量设置为4个警报的当前值。

如果这些更改,则 AlarmStatus 值将更改。目前我把它放在if,else if语句中仅用于测试目的。现在,当您单击“保存”时,如果没有任何更改,则颜色不会更改。如果更改了4个警报值中的任何一个,则使用以下代码在视图屏幕上点击dataBind:

myapp.ViewAlarm.AlarmStatus_postRender = function (element, contentItem) {
    contentItem.dataBind("value", function (value) {

        var critical = contentItem.screen.Alarm.Critical;
        var high = contentItem.screen.Alarm.High;
        var medium = contentItem.screen.Alarm.Medium;
        var low = contentItem.screen.Alarm.Low;

        element.style.fontWeight = 'bold';
        element.style.fontSize = "18px";

        if (critical == 50 || high == 50 || medium == 50 || low == 50) {
            element.style.background = "RED"; //CRITICAL
            //element.style.opacity = 0.4;
            element.style.color = "white";
            element.innerText = "Critical";
        }
        else if (contentItem.value == 2) {
            element.style.background = "ORANGE"; //HIGH
            //element.style.opacity = 0.4;
            element.style.color = "black";
            element.innerText = "High";
        }
        else if (contentItem.value == 3) {
            element.style.background = "YELLOW"; //MEDIUM
            //element.style.opacity = 0.4;
            element.style.color = "black";
            element.innerText = "Medium";
        }
        else if (contentItem.value == 4) {
            element.style.background = "GREEN"; //LOW
            // element.style.opacity = 0.4;
            element.style.color = "white";
            element.innerText = "Low";
        }
        else {
            //WAIT FOR OPTION
        }
    });
};

现在我已设置第一个if语句中的任何值是否等于50,然后将警报状态设置为CRITICAL。我现在已将其他人留下2,3,4。我不知道你是否想要一个范围,或者同时只使用4个警报值中的一个,但是如果任何值发生变化,这种方法都有效。