I would like to be able to listen on the show event on an itemView from a CollectionView. The following snippet does not work. Perhaps this isn't possible?
#on 'itemview:show', (itemView) =>
console.log "Showed itemView"
The comment that you made in your question is the only way to make this work, at the moment.
This is a limitation in how the onShow method can be called on item views, because there's no guarantee of when an item view will be shown.
Related
$('#my-view').on('show', showHandler)
Doesn't work. Using data-show is not an option either because the code that sets/unsets the event is within class that is instantiated later. Also creating the view programatically and passing in the event handler doesn't work because I need to set the event on/off at different times.
Is this not possible with kendoUI? If not, why? This seems like such an incredibly obvious feature to relay those events to the element themselves similar to what is possible with jquery ui widgets.
This works:
var view = $('#my-view');
var widget = kendo.widgetInstance(view);
widget.bind('show', showHandler);
Better answer, just delegate the events yourself so the code in the question actually works:
<div data-role="view" ... data-show="onShow">...</div>
and
function onShow () {
this.element.trigger('show');
}
Now the it works :). The problem I still has was that 'show' isn't triggered when a view is first shown if it is the first view shown. Er, so yeah I had to add some extra code for that too like this:
if ($('#my-view').is(':visible')) {
$('#my-view').trigger('show');
}
Lame but it works.
To avoid calling applyBindings multiple times on the same DOM element, I wrap my various viewmodels in an observable. then just change that observable to whatever view model i wanna see and BAM...that works.
until i do something like this:
<div data-bind="if:$data">
...some bindings in here
</div>
when i change view models, the bindings inside any "if:$data" blocks do not update.
here's a fiddle to really demonstrate this: http://jsfiddle.net/btrauma8/2TxME/
This would have worked properly prior to KO 2.2. In 2.2, we made if and ifnot more efficient by only re-rendering the section when the value actually changes between truthy/falsy.
There were many cases where people would bind against something like if: items().length and the entire section would be re-rendered everytime that an item was added.
In your case, you can overcome this pretty easily by just using the with binding instead of if. Since, you are binding against $data, it will not actually change the context and will give you the result that you are after.
My site is:
http://econrespuestas.com.ar
And i'm having trouble with AJAX page loader integration. When you click on a link in "secondary-menu", it adds it the "current-menu-item" class, but it doesn't remove de "current-menu-item" class from the other ones.
I'm trying to do it with this code:
// highlight the current menu item
jQuery('secondary-menu li').each(function() {
jQuery('thiss').removeClass('current-menu-item');
});
jQuery(thiss).parents('li').addClass('current-menu-item');
but it isn't working. There must be something wrong with the removeClass selector. Could you help me?
Firstly, thiss doesn't exist (unless declared somewhere else). It must be this. In addition try something more like...
jQuery('.current-menu-item').removeClass('current-menu-item');
jQuery(this).parents('li').addClass('current-menu-item');
This is saying "Remove the class current-menu-item from any objects with the class current-menu-item, then add the class current-menu-item to the parent li of the clicked item"
In addition, make sure that in your CSS, .current-menu-item{...} appears after any styling for the non-currently selected item.
See Fiddle: http://jsfiddle.net/6hR9K/2/
Also, unless you have a specific conflict with using the $ sign in place of jQuery, I suggest doing exactly that.
$('.current-menu-item').removeClass('current-menu-item');
$(this).parents('li').addClass('current-menu-item');
Yesterday I was introduced to the CListView and could manage to display all the information i want about my records, and in the format i want. I have a 'create' button (add a new contact), which opens a modal pop up window with the corresponding fields. When this window is closed, i return to the CListView, and here is my issue: i've been trying to update the CListView (without any luck, clearly).
I believe it should be easy to update the clistview with this call: $.fn.yiiListView.update('CListViews's ID'), but i can't find the proper event that should trigger this call.
Next, i post what i would think is the relevant code:
Button
echo CHtml::ajaxButton ("Create",
CController::createUrl('/contacts/create'),
array('onclick'=>'
$("#createContact").dialog("open");
return false;',
'update'=>'#createContact'),
array('id'=>'showCreateContactDialog'));?>
CListView
$this->widget('zii.widgets.CListView', array(
'dataProvider'=>new CArrayDataProvider($model->contacts, array('pagination'=>array('pageSize'=>5,),)),
'itemView'=>'_view',
'emptyText'=>'empty',
'template'=>"{items}\n{pager}",
'pagerCssClass'=>'page-number',
'id'=>'ajaxListView',
));?>
Any help is more than welcome!! Hope this helps someone eventually as well.
If I understand correctly, your problem is finding what to trigger the CListView update with (the JS update snippet you provide should work fine).
Probably the jQuery dialog event close is what you are looking for; it will get triggered after the dialog has been closed. Alternatively, there is also a beforeClose event that has the additional capability to prevent the dialog from closing.
I wonder if anybody else is having this issue. I'm using Firefox 4 and I'm debugging a function from an onclick event using Firebug. Now, to be sure, I checked the stack and it clearly shows that an onclick event was fired. However, when I type "event" (without quotse) in the watch pane, it says it's undefined. Why? Now it recognizes "Event", but not "event". Is anybody else having this issue?
Thank you.
When debugging inside of your event function, add a watch for arguments[0]; this is the event object you are looking for.
Modern, standards-compliant browsers don't use a window.event object in the manner that some versions of Internet Explorer do.
In these browsers, the event is passed to the event handler as an argument. So if you do something like the following...
function foo(bar) {
// do stuff
}
document.getElementById("myElement").onclick = foo;
...then when #myElement is clicked, the browser will execute foo(bar), where bar is the event object. If you need to see the event object's details, you would have to set a breakpoint inside of foo and add a watch for bar or for arguments[0].