CODEWITHSUNDEEP
knockout.js
user1694105
user1694105

Reputation: 3

Knockout Js: values for table row duplicates in IE9

For example if i have table with column "ID", values under ID will be repeated twice in every row. This issue exists only in Ie9. Please suggest what can be the possible solution for this. My Html markup is as follows.

     <script>
        var viewModels;
        requirejs(
            ["vm.attendanceMarking", "vm.bookcab"],
            function (vmattendanceMarking, vmbookcab) {

                viewModels = {
                    vmattendanceMarking: vmattendanceMarking,
                    vmbookcab: vmbookcab

                };
               vmattendanceMarking.VMobsCabDetails();
               viewModels.vmattendanceMarking.VMinit();
               viewModels.vmbookcab.VMGetCabRequestData();

                $(document).ready(function () {

                    ko.applyBindings(viewModels);
                });
            });


    </script>

       <tbody>
                        <!-- ko foreach: AttendanceList -->
                        <tr id='myrows' data-bind="attr: { id: 'row-' + tripId }">

                            <td>
                                <div style="display:inline-block">
                                    <label data-bind="text: EmployeeId" />
                                </div>
                            </td>
                            <td>
                                <div style="display:inline-block">
                                    <label data-bind="text: slot" />
                                </div>
                            </td>
                            <td>
                                <div style="display:inline-block">
                                    <input type="checkbox" data-bind="checked: IsPresent">
                                </div>
                            </td>
                            <td>
                                <div style="display:inline-block">
                                    <input type="checkbox" data-bind="checked: IsChecked">
                                </div>
                            </td>
                        </tr>
                        <!-- /ko-->
                    </tbody>

Markup of table after generation in IE9:

<tbody>
<tr>
<td>
  <label data-bind="text: EmployeeId" />
Bangalore 
  <label data-bind="text: EmployeeId" />
Bangalore
</td>
</tr>
</tbody>

Upvotes: 0

Views: 81

Answers (1)

janfoeh
janfoeh

Reputation: 10328

Your markup is invalid, which can lead to unpredictable results.

<label> elements are not allowed to be self-closing. Use <label></label> instead.

Upvotes: 1

Related Questions