admin管理员组

文章数量:1287661

Below is the code for a table with a collapse panel. The click event handler is throwing an error message that "m.apply is not a function".

Quux.CollapseExpandCustom.ToggleSection('+id+') is the function which accepts a dynamic id.

Please let me know what the mistake I am making. I need to bind the click event as mentioned in the code.

<table id="EditFooList">
    <thead>
        <tr>
            <th>User</th>
            <th>Started Date</th>
            <th>Foo</th>
            <th>Action</th>
        </tr>
    </thead>
    <tbody data-bind="foreach: EditedDataArray">
        <tr>
            <td data-bind="text: $data.UserName"></td>
            <td data-bind="text: $data.TimeStampString"></td>
            <td>
                <div>
                    <p data-bind="text: $data.Title, click: $root+'.'+'Quux.CollapseExpandCustom.ToggleSection('+$data.Baz+')'">Foos<img src="~/Images/Collapse.png" /></p>
                    <div>
                        <div data-bind="attr:{id: $data.Baz}">
                            <ul data-bind="foreach: $data.FooDetailViewModels">
                                <li>
                                    <input type="button" data-bind="value: 'Resume -   ' + $data.TimeDate,click: $root.ClickResume , attr:{fooStudyId:$data.FooStudyId}" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                    <input type="button" data-bind="value: 'Plan -   ' +$data.TimeDate, click: $root.ClickPlan , attr:{fooStudyId:$data.FooStudyId}" />
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </td>
            <td>
                <input type="button"value="New" data-bind="attr:{id: $data.Baz} , click: $root.FooCLick"/>
            </td>
        </tr>
    </tbody>
</table>

Below is the code for a table with a collapse panel. The click event handler is throwing an error message that "m.apply is not a function".

Quux.CollapseExpandCustom.ToggleSection('+id+') is the function which accepts a dynamic id.

Please let me know what the mistake I am making. I need to bind the click event as mentioned in the code.

<table id="EditFooList">
    <thead>
        <tr>
            <th>User</th>
            <th>Started Date</th>
            <th>Foo</th>
            <th>Action</th>
        </tr>
    </thead>
    <tbody data-bind="foreach: EditedDataArray">
        <tr>
            <td data-bind="text: $data.UserName"></td>
            <td data-bind="text: $data.TimeStampString"></td>
            <td>
                <div>
                    <p data-bind="text: $data.Title, click: $root+'.'+'Quux.CollapseExpandCustom.ToggleSection('+$data.Baz+')'">Foos<img src="~/Images/Collapse.png" /></p>
                    <div>
                        <div data-bind="attr:{id: $data.Baz}">
                            <ul data-bind="foreach: $data.FooDetailViewModels">
                                <li>
                                    <input type="button" data-bind="value: 'Resume -   ' + $data.TimeDate,click: $root.ClickResume , attr:{fooStudyId:$data.FooStudyId}" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                    <input type="button" data-bind="value: 'Plan -   ' +$data.TimeDate, click: $root.ClickPlan , attr:{fooStudyId:$data.FooStudyId}" />
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </td>
            <td>
                <input type="button"value="New" data-bind="attr:{id: $data.Baz} , click: $root.FooCLick"/>
            </td>
        </tr>
    </tbody>
</table>
Share Improve this question edited Mar 19, 2019 at 2:25 bvpb 1,47622 silver badges31 bronze badges asked Aug 12, 2015 at 5:25 Ananda Prasad JaisyAnanda Prasad Jaisy 3011 gold badge7 silver badges17 bronze badges 4
  • 2 you would be better off creating a function on your $root that takes a parameter that does what you want than trying to build it up in the HTML – Nathan Fisher Commented Aug 12, 2015 at 6:00
  • 1 Please don't vandalize the question, people have taken time to answer it for the benefit of future users. – Petter Friberg Commented Mar 13, 2019 at 12:13
  • @PabloAlbornoz - mate can you please remove your post. As per the pany policy we can't put the pany name on stackoverflow- Appreciated Thank you. – San Jaisy Commented Mar 14, 2019 at 5:04
  • @SanJaisy I don't know what are you referring to. Is something wrong? – fixmycode Commented Mar 14, 2019 at 17:24
Add a ment  | 

2 Answers 2

Reset to default 9

This answer may help: Knockout click binding strange behavior

Basically, if you wrap this in an anonymous function it should stop the error:

<p data-bind="text: $data.Title, click: function() { $root.Quux.CollapseExpandCustom.ToggleSection($data.Baz); }">Foos<img src="~/Images/Collapse.png" /></p>

However, as mentioned by @Nathan Fisher, you may be better off creating a function in your viewmodel that handles doing this process.

Also, i'm not sure why you're building a string with the call to the function. ie.

click: $root.Quux.CollapseExpandCustom.ToggleSection($data.Baz)

instead of

click: $root+'.'+'Quux.CollapseExpandCustom.ToggleSection('+$data.Baz+')'

Since you seem to be using a function, I assume you might have a variable($scope.variable) which has same name as function, in which case it would overwrite function already existing on the scope.

本文标签: javascriptKnockout TypeError mapply is not a functionStack Overflow