Note that there are some explanatory texts on larger screens.

plurals
  1. POknock template binding issue
    text
    copied!<pre><code>&lt;script type="text/x-jquery-tmpl" id="conditionTemplate"&gt; &lt;tr&gt; &lt;td style="padding-left: 5px;"&gt; &lt;span data-bind="visible: $index()==0"&gt;IF&lt;/span&gt; &lt;select data-bind="attr: {id: 'ddlJoinOperator_'+ $index() } ,visible: $index()&gt;0" style="width:50px;height:25px;"&gt; &lt;option value="and"&gt;AND&lt;/option&gt; &lt;option value="or"&gt;OR&lt;/option&gt; &lt;/select&gt; &lt;/td&gt; &lt;td style="padding-left: 25px;"&gt; &lt;table&gt; &lt;tr&gt; &lt;td&gt; &lt;select data-bind="attr: {id: 'ddlleftparam_'+ $index() }" style="width:50px;height:25px;"&gt; &lt;option value="("&gt;(&lt;/option&gt; &lt;option value=" "&gt;&lt;/option&gt; &lt;/select&gt; &lt;/td&gt; &lt;td style="padding-left: 30px;"&gt; .Answer &lt;select data-bind="attr: {id: 'ddloperator_'+ $index() }" style="width:50px;height:25px;"&gt; &lt;option value="=="&gt;==&lt;/option&gt; &lt;option value="!="&gt;!=&lt;/option&gt; &lt;option value="In"&gt;In&lt;/option&gt; &lt;option value="Not In"&gt;Not In&lt;/option&gt; &lt;/select&gt; &lt;/td&gt; &lt;td style="padding-left: 5px;"&gt; &lt;select data-bind="attr: {id: 'ddlOptions_'+ $index() }" style="width:240px;height:25px;"&gt; &lt;/select&gt; &lt;/td&gt; &lt;td style="padding-left: 5px;"&gt; &lt;select data-bind="attr: {id: 'ddlRightParam_'+ $index() }" style="width:50px;height:25px;"&gt; &lt;option value=")"&gt;)&lt;/option&gt; &lt;option value=" "&gt;&lt;/option&gt; &lt;/select&gt; &lt;/td&gt; &lt;td style="padding-left: 5px;"&gt; &lt;input type="button" data-bind="attr: {id: 'btnAdd_'+ $index() }"&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;/td&gt; &lt;td&gt; &lt;input type="button" data-bind="attr: {id: 'btndelete_'+ $index() },visible: $index()&gt;0"&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/script&gt; </code></pre> <p>Above template is binding to the table as below.</p> <pre><code> &lt;table id="tblConditions" data-bind="template: {name:'conditionTemplate', foreach: 'CondiotionXml'}"&gt; &lt;/table&gt; $(function () { $.ajax({ url: "/api/BranchSurvey/GetBranchLogicConditions", success: function (lst) { alert(lst.length); BranchSurveyViewModel = ko.mapping.fromJS(lst); ko.applyBindings(BranchSurveyViewModel, document.getElementById('tblConditions')); return false; } }); }); </code></pre> <p>My problem is in alert(lst.length); is giving value as 1. but in browser i am getting 12 rows repeating the template. As the length of list iam binding is 1 then why 12 times the template loop running.</p>
 

Querying!

 
Guidance

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