Click here to Skip to main content
15,868,141 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
Hi,

I am new to KnockoutJS and in my application i am setting the visible property to a div like this
HTML
<div class="cd-fail-message" data-bind="visible: containerModel().QlikViewData.Navigations.length = 0">No results found</div>


But its showing exception ,
Uncaught TypeError: Unable to process binding "visible: function (){return containerModel().QlikViewData.Navigations.length > 0 }"
Message: Cannot read property 'length' of undefined

This is my viewmodel object in JS

JavaScript
function containerViewModel() {
    mainViewModel = this;
    mainViewModel.isBusy = ko.observable(false);
    mainViewModel.errorMessage = ko.observable("");
    mainViewModel.containerModel = ko.observable(
        {
            HomeSettings: ko.observable(),
            ERPData: ko.observable({ HeaderText: '', BodyText: '', FooterText: '' }),
            KPIData: ko.observable({ HeaderText: '', BodyText: '', FooterText: '' }),
            iJETData: ko.observable({ HeaderText: '', BodyText: '', FooterText: '' }),
            QlikViewData: ko.observable({ HeaderText: '', BodyText: '', FooterText: '' }),
            IDEAData: ko.observable({ HeaderText: '', BodyText: '', FooterText: '' })
        }
        );

    GET_AllContainer(mainViewModel);
}

function GET_AllContainer(mainView) {
    mainViewModel.isBusy(true);
    $.ajax({
        url: hostApi + api_GetAllContainer,
        contentType: "json",
        success: function (result) {
            mainView.containerModel(result);
            mainViewModel.isBusy(false);
        },
        error: function (result) {
            mainViewModel.errorMessage(result);
            mainViewModel.isBusy(false);
        }
    });

}


Also i am using template to bind a sequence of data, but if the data is null exception will be thrown, how can i prevent that?

HTML
<section class="cd-gallery">
                            <ul class="noPadding" data-bind="template: { name: 'Report-Tiles', foreach: containerModel().QlikViewData.Navigations }"></ul>


Can anyone please help me

Thanks
Posted
Updated 13-Aug-15 23:28pm
v2
Comments
Black Mamba Elapidae 20-Aug-15 6:58am    
What is Navigations in containerModel().QlikViewData.Navigations.length ???
I cant see any 'Navigations' in your viewmodel ! Can you please elaborate On what condition you want to make that div visible ??
Arjun Menon U.K 23-Aug-15 4:56am    
Navigations is one of the two list that resides inside the QlikViewData object
Black Mamba Elapidae 24-Aug-15 5:44am    
Then if its a list and suppose it has no elements and you try to find out its length then it will ofcourse throw an exception . One thing you can do is calculate its length in js itself(also add extra check to calculate length only when navigation list is not null !) and then bind this new variable in template

1 solution

(Regarding your second question),
Before binding data to template you can check if the data is null , and if it is not null then only bind it,

 <section class="cd-gallery">
<!-- ko if: containerModel().QlikViewData.Navigations!= null -->
 <ul data-bind="template: { name: 'Report-Tiles', foreach: containerModel().QlikViewData.Navigations }"></ul>
<!-- /ko --></section>
 
Share this answer
 
v3
Comments
Arjun Menon U.K 23-Aug-15 4:57am    
Am new to Knockout, that commented part is that how i put it
Black Mamba Elapidae 24-Aug-15 5:32am    
They are not just comments :P It is called as Knockout containerless control flow syntax.. You can find more about it here, http://knockoutjs.com/documentation/if-binding.html

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