Databases
StackOverflow2013
Postsdbo
POContinuing with the drop down boxes problems
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POContinuing with the drop down boxes problems
    primarykey
    data
    text
    <p>I am still having problems with my cascading selects especially with the optionsCaption. </p> <p>If I select the 'Select a Poster' option in the parent select then I get this error:</p> <p>Microsoft JScript runtime error: Unable to parse bindings. Message: TypeError: Unable to get value of the property 'ClientSite': object is null or undefined; Bindings value: options: <code>enter code here</code>selectedPoster().ClientSite, optionsText: 'ClientName', optionsCaption:select2OptionsCaption(), value: selectedClient, disable: (selectedPoster().ClientSite==undefined) </p> <p>I would appreciate if someone could help me to fix it.</p> <p>Cheers C</p> <p><code>enter code here</code> </p> <pre><code> var objPoster1 = new Dockethub.Services.PosterDdl(); objPoster1.SiteId = -1; objPoster1.SiteName = ""; var posterArray = ([ { SiteId: 1, SiteName: "Mail", ClientSite:[ { ClientId: 1, ClientName: "Mail Client A" }, { ClientId: 2, ClientName: "Mail Client B"}] }, { SiteId: 2, SiteName: "DSAC", ClientSite:[ { ClientId: 1, ClientName: "DSAC Client A"}] }, { SiteId: 3, SiteName: "Bank", ClientSite: [{}] } ]); //var posterArray = ([]); //var posterArray = ([{ SiteId: 1, SiteName: "Royal Mail" }, { SiteId: 2, SiteName: "DSAC"}]); //var posterArray = ([{ SiteId: 1, SiteName: "Royal Mail", ClientSite:[{}] }]); //posterArray.push(objPoster1); // VIEW MODEL START var ViewModel = function () { var self = this; // Poster self.PosterList = ko.observableArray([]); ko.mapping.fromJS(posterArray, null, self.PosterList); self.selectedPoster = ko.observable(null); self.selectedClient = ko.observable(null); self.select1OptionsCaption = ko.computed(function () { if (this.PosterList().length == 0) { return 'No Posters'; } else { return this.PosterList().length == 1 ? '' : 'Select a Poster'; } }, self); self.select2OptionsCaption = ko.computed(function () { if (this.selectedPoster() == null || ko.toJS(this.selectedPoster().ClientSite) == undefined || ko.toJS(this.selectedPoster().ClientSite)[0].ClientName == null) { return 'No Clients'; } else { if (this.selectedPoster() != null &amp;&amp; ko.toJS(this.selectedPoster().ClientSite).length &gt; 1) { return 'Select a client'; } else if (this.selectedPoster() != null &amp;&amp; ko.toJS(this.selectedPoster().ClientSite).length == 1) { return ''; } else if (this.selectedPoster() != null &amp;&amp; ko.toJS(this.selectedPoster().ClientSite).length == 0) { return 'No Clients'; } } }, self); }; // END VIEW MODEL var viewModel = new ViewModel(); $(function () { ko.applyBindings(viewModel); // remove if statement if you wish to display the select tag event if selectedPoster is null }); &lt;/script&gt; &lt;fieldset class="SearchFilter"&gt; &lt;legend&gt;Search Filter&lt;/legend&gt; &lt;div class="SearchItem"&gt; &lt;span&gt;Poster:&lt;/span&gt; &lt;select id="Select1" data-bind="options: PosterList, optionsText: 'SiteName', value: selectedPoster, disable:PosterList().length &lt;= 1, optionsCaption:select1OptionsCaption()" &gt;&lt;/select&gt; &lt;!-- ko if: selectedPoster --&gt; &lt;select id="Select2" data-bind="options: selectedPoster().ClientSite, optionsText: 'ClientName', optionsCaption:select2OptionsCaption(), value: selectedClient, disable: (selectedPoster().ClientSite==undefined) "&gt;&lt;/select&gt; &lt;!-- /ko --&gt; &lt;%--&lt;select id="Select1" data-bind="options: PosterList, optionsText: 'SiteName', value: selectedPoster, disable:PosterList().length &lt;= 1, optionsCaption:select1OptionsCaption" &gt;&lt;/select&gt; &lt;select id="Select2" data-bind="options: selectedPoster().ClientSite, optionsText: 'ClientName', value: selectedClient"&gt;&lt;/select&gt; --%&gt; &lt;%--&lt;select id="Select1" data-bind="options: PosterList, optionsText: 'SiteName', value: selectedPoster, disable:PosterList().length &lt;= 1, optionsCaption: (PosterList().length==0)?'No Posters':(PosterList().length==1)?'':'Select a Poster'" &gt;&lt;/select&gt; &lt;select id="Select2" data-bind="options: selectedPoster().ClientSite, optionsText: 'ClientName', value: selectedClient, disable:(selectedPoster().ClientSite==undefined), optionsCaption: (selectedPoster()==undefined)? 'No Clients': ''"&gt;&lt;/select&gt;--%&gt; &lt;%-- &lt;select id="dllPoster" data-bind="foreach: PosterList, disable:PosterList().length &lt;= 1" onchange="viewModel.refreshClientList();"&gt; &lt;option data-bind="text: SiteName, attr:{value:SiteId}"&gt;&lt;/option&gt; &lt;/select&gt; &lt;select id="ddlClient" data-bind="with: PosterList.ClientSite "&gt; &lt;option data-bind="text: ClientName, attr:{value:ClientId}"&gt;&lt;/option&gt; &lt;/select&gt;--%&gt; &lt;/div&gt; &lt;/fieldset&gt; &lt;input type="button" value="Click me!" onclick="alert(viewModel.selectedPoster().ClientSite())" /&gt; </code></pre> <p></p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USAndrew Андрей Листочкин
    1. USCleyton
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POContinuing with the drop down boxes problems
      1. This table or related slice is empty.
      1. VTUpMod
    1. COAny suggestions please?
      singulars
      1. POContinuing with the drop down boxes problems
      1. USCleyton
    2. COCould you please describe task that you want to implement? Because your code is little bit dirty and not really easy to read. I think there is much easier way to implement your issue. So just describe what you need to do;)
      singulars
      1. POContinuing with the drop down boxes problems
      1. USDmitry Zaets
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload