0

I have following code. but not update the view page.

In my app.js

// Hub Callback: Update User List

    hub.client.updateUserList = function (userList) {
        viewModel.setUsers(userList);
    };

In my viewmodel.js

 var viewModel = {
        Users: ko.mapping.fromJS([]), 
}
 viewModel.setUsers = function (userArray) {
        ko.mapping.fromJS(userArray, viewModel.Users);     
    };

My SignalR hub class

 private void SendUserListUpdate()
 {
            Users.ForEach(u => u.InCall = (GetUserCall(u.ConnectionId) != null));
            Clients.All.updateUserList(Users);
  }

This signalR SendUserListUpdate() correctly update the users list. But not update in below index page.

 <div class="well user-list">
                            <ul class="nav nav-list">
                                <li class="nav-header">Online Users <small data-bind="text: Users().length"></small></li>
                                <!-- ko foreach: Users -->
                                <li class="user" data-bind="attr: { 'data-cid': ConnectionId, 'title': Username }">
                                    <a href="#">
                                        <!-- only using an a here for bootstrap styling -->
                                        <div class="username" data-bind="text: Username"></div>
                                        <div class="helper" data-bind="css: $parent.getUserStatus($data)"></div>
                                    </a>
                                </li>
                                <!-- /ko -->
                            </ul>
                        </div>

scripts I used.

   <script src="~/Scripts/adapter.js"></script>
    <script src="~/Scripts/jquery-3.3.1.min.js"></script>
    <script src="~/Scripts/knockout-3.4.2.js"></script>
    <script src="~/Scripts/knockout.mapping-latest.js"></script>
    <script src="~/Scripts/alertify.min.js"></script>
    <script src="~/Scripts/WebRtcDemo/bootstrap.min.js"></script>
    <script src="~/Scripts/jquery.signalR-2.3.0.min.js"></script>
KIS
  • 129
  • 1
  • 10

2 Answers2

1

Add the mapping object parameter when you map the new array data from server. And further you could create obeservable arrays via ko.observableArray([]);

var viewModel = {
        Users: ko.observableArray([]), 
}
 viewModel.setUsers = function (userArray) {
        ko.mapping.fromJS(userArray, {}, viewModel.Users);     
    };
Wenushka Dikowita
  • 61
  • 2
  • I added ko.mapping.fromJS(userArray, {}, viewModel.Users); and Users: ko.observableArray([]), as it is.But same.Users().length is still = 0 – KIS Aug 13 '18 at 09:18
  • Have you checked the setUsers function receives non empty js array when it is called? – Wenushka Dikowita Aug 13 '18 at 09:25
  • In SignalR hub SendUserListUpdate() function Users list is having values and updating real time.But how to check in viemodel.js? – KIS Aug 13 '18 at 09:34
  • in the browser, press F12 to get the developer tools and put a break point in the source. if you are not familiar with it, for a quick check, just put alert(ko.mapping.toJSON(userArray)); as the first line of the setUsers function. Ii will show the json string of the array. But it will fail if your userArray is null or undefined. – Wenushka Dikowita Aug 13 '18 at 09:46
  • I checked,but I found it is not hit the setUsers() function all time,I do not know why.But anyway I use this code https://github.com/mgiuliani/webrtc-video-chat. When you run this it is working fine. But when upgraded all libraries the user list not updating in this same solution.Can you check this?Thanks. – KIS Aug 13 '18 at 11:45
  • I fixed it according to below description saying from upgrade signalR should define client functions declared before hub start.https://stackoverflow.com/questions/14072223/signalr-js-client-methods-not-invoked – KIS Aug 14 '18 at 06:44
0

I did call the client functions after hub start before. I fixed it according to below description saying from upgrade signalR should define client functions declared before hub start. SignalR JS Client Methods Not Invoked

KIS
  • 129
  • 1
  • 10