Question

我的网站中有selectboxit个组件。采用下一个设计：

如果从第二个选择框中选择值将数据渲染到第二列等，我选择第一个选择框值渲染数据到第一列时我需要。

我的HTML代码：

<table>
<tr>
    <td>
        <div id="appVerFirst">
            <select id="appVersionsFirst" ng-model="version" ng-change="compareVersionEvent(version, 1)">
                <option ng-repeat="app in compareAppVer | orderBy:$index" value="{{::app.version}}" ng-selected="$last">
                    APP vr. {{::app.version}}
                </option>
            </select>
        </div>
        <div>
            <p>On Range {{::startDay | date:'M/d/yy'}} - {{::currentDate | date:'M/d/yy'}}</p>
            <p>Average Score <span class="{{::fisrtScoreClass}} total-quality"> {{::fisrtScore}}</span>
            </p>
        </div>
        <div> <p>Users on Peak: {{::fisrtUsers}}</p> </div>
    </td>
    <td>
        <div id="appVerSecond">
            <select id="appVersionsSecond" ng-model="version1" ng-change="compareVersionEvent(version1, 2)">
                <option ng-repeat="app in compareAppVer | orderBy:$index" value="{{::app.version}}" ng-selected="$last-1">
                    APP vr. {{::app.version}}
                </option>
            </select>
        </div>
        <div>
            <p>On Range {{::startDay | date:'M/d/yy'}} - {{::currentDate | date:'M/d/yy'}}</p>
            <p>Average Score <span class="{{::secondScoreClass}} total-quality"> {{::secondScore}}</span>
            </p>
        </div>
        <div> <p>Users on Peak: {{::secondUsers}}</p> </div>
    </td>
    <td>
        <div id="appVerThird">
            <select id="appVersionsThird" ng-model="version2" ng-change="compareVersionEvent(version2, 3)">
                <option ng-repeat="app in compareAppVer | orderBy:$index" value="{{::app.version}}" ng-selected="$last-2">
                    APP vr. {{::app.version}}
                </option>
            </select>
        </div>
        <div>
            <p>On Range {{::startDay | date:'M/d/yy'}} - {{::currentDate | date:'M/d/yy'}}</p>
            <p>Average Score <span class="{{::thierdScoreClass}} total-quality"> {{::thierdScore}}</span>
            </p>
        </div>
        <div> <p>Users on Peak: {{::thierdUsers}}</p> </div>
    </td>
</tr>
</table>

更改selectBox组件的事件：

var selectData = function (version) {
    var currentData = null;
    angular.forEach($scope.compareAppVer, function (data) {
        if (data.version === version)
            currentData = data;
    });

    return currentData;
};

$scope.compareVersionEvent = function (version, id) {
    var data = selectData(version);
    switch (id) {
        case 1:
        {
            $scope.fisrtScore = data.qualityScore;
            $scope.fisrtScoreClass = data.qualityScoreClass;
            $scope.fisrtUsers = data.activeUsers;
            break;
        }
        case 2:
        {
            $scope.secondScore = data.qualityScore;
            $scope.secondScoreClass = data.qualityScoreClass;
            $scope.secondUsers = data.activeUsers;
            break;
        }
        default:
        {
            $scope.thierdScore = data.qualityScore;
            $scope.thierdScoreClass = data.qualityScoreClass;
            $scope.thierdUsers = data.activeUsers;
        }
    }
};

但它不起作用，因为在 compareVersionEvent 中没有传输正确的数据，意味着如果在第二个selectBox中我选择值 1 然后在第一个selectBox中选择值 1 他没有转移到主 compareVersionEvent 。

请帮我解决这个问题。

Answer 1

尝试在JavaScript中初始化版本，版本1和版本2

并删除＆＃34; ::＆＃34;在HTML中

Answer 2

chat.client.onConnected = function (id, userName, allUsers, messages) {
    $.sort(messages,function(a,b){
           return a.ReceivedOn > b.ReceivedOn;
    });

    for (i = 0; i < messages.length; i++) {
        AddMessage(messages[i].UserName, messages[i].Message);
    }
}

请访问此链接http://gregfranko.com/jquery.selectBoxIt.js/

AngularJs与selectboxit的问题

2 个答案: