How to target a specific div by knockout js

105 views
Skip to first unread message

Tridip Bhattacharjee

unread,
May 28, 2015, 2:40:48 PM5/28/15
to knock...@googlegroups.com

here i am pasting a code which slide toggle a child div but if parent div contains many child div and each child div has unique id then how could slide toggle a specific div by id using knockout js.

here is full working code

<!DOCTYPE html>
<html>
<head>
    <!-- Step 2 - Include jquery and knockout -->
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script>
    <script type="text/javascript" src="http://knockoutjs.com/downloads/knockout-3.0.0.js"></script>

    <!-- Step 3 - Add script to run when page loads -->
    <script type="text/javascript">
        $(document).ready(function(){

            <!-- Step 4 - Create a ViewModel -->
            function viewModel() {
                _self = this;
                _self.showHide = function(viewModel, event) {
                    $(event.currentTarget).children('div').slideToggle();
                };
            };

            <!-- Step 5 -  Activates knockout.js bindings -->
          ko.applyBindings(new viewModel());
        });
    </script>
</head>
<body style="">
    <div>
        Option 1
        <!-- Step 6 - Create a HTML Elements with bindings -->
        <div data-bind="click: showHide" style="border:2px solid;">
        Click me
            <div style="display: none;">
              Now you see me!
            </div>
        </div>
    </div>
</body>
</html>

just see this line and tell me how could i slide toggle a specific child dib div by id

$(event.currentTarget).children('div').slideToggle();  

thanks

Gunnar Liljas

unread,
May 28, 2015, 5:42:32 PM5/28/15
to knock...@googlegroups.com
That's not how Knockout applications work. You should control the toggling using observables and handle them using bindings

http://knockoutjs.com/examples/animatedTransitions.html

--
You received this message because you are subscribed to the Google Groups "KnockoutJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to knockoutjs+...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Reply all
Reply to author
Forward
0 new messages