Get item that caused context menu to open? - kendo-ui

Is there a way to get the element the user right clicked on to open a context menu?
( The only method i see is looking for an item with .k-state-focused.. hopefully, there is a better way )
edit: in my code context menus are created using a filter and not a target.

You can find it in target field of the event object received by you Event Handler.
Example:
$("#container").on("contextmenu", function(e) {
console.log("target", e.target);
});
See an example here: http://jsfiddle.net/OnaBai/crobgjyf/

Related

Coded UI Test - Set UI property not returning (hanging indefinitely)

I am getting crazy with a problem that I found when executing a Visual Studio Coded UI Test.
The scenario is as follows.
I recorded a Coded UI Tests that do the following steps in a Web Application (Microsoft Dynamics CRM 2011):
Login into an application
Navigate into a page
On the page set the selected value of a html combobox
The test is able to do all those steps without a problem, even selecting the value in the combobox.
The web application have a piece of Javascript that is executed when the selected item changes.
if one of the values is selected then an alert message is presented to the user and the application will set the selected item to a default one!
The javascript code look like this:
switch (Xrm.Page.getAttribute("status").getValue()) {
case 3: //Authorised
alert("Please use the method XPTO to update the record status to Authorised!");
Xrm.Page.getAttribute("status").setValue(1);
Xrm.Page.getControl("tatus").setFocus(true);
return false;
The UI Test method that is performing the change in the combobox is as follows:
/// <summary>
/// Select a value in the Status dropdown box
/// </summary>
public void SelectStatus()
{
#region Variable Declarations
HtmlComboBox uIStatusComboBox = this.UIHttpsappWindow200.UIModuleUITEDocument5.UIWorkplaceDashboardsFrame.UIModuleUITEDocument.UIStatusComboBox;
// Select 'Authorised' in 'Status' combo box
uIStatusComboBox.SelectedItem = this.SelectStatus_SPParams.UIStatusComboBoxSelectedItem;
}
The test method is able to change the value in the combobox, and an alert message is displayed to the user. However this part of the code uIStatusComboBox.SelectedItem = this.SelectStatus_SPParams.UIStatusComboBoxSelectedItem;
never returns and the test just hangs there until it timeouts!
I have no ideia how to work arround this issue! I was thinking that maybe the problem could be in the fact that we have javascript code that is executed after the alert is displayed to the user. I changed the JS so that the alert message is the last thing to be displayed but it also didn´t help!
I also noticed that if I click Ok on the alert message the test Pass!
If I select other value that dont trigger any JS the test also Pass!
Does anyone have any idea about this issue?
Edit 1:
I noticed another thing, I can use the BrowserWindow object to send a JS script to the browser. If I try to create an alert message the call also gets blocked until I click on the Ok button, on the alert!
BrowserWindow bw = BrowserWindow.Locate("My window");
bw.ExecuteScript("alert('This is just a simple alert.');");
The ExecuteScript statement also gets blocked until I click on the OK button!
This seems very very strange!
I believe I have found a workaround.
I was googling to find anything that could help me with this issue and I end up finding this question on StackOverflow Coded ui test - Select an item from a combobox without using mouse coordinates
I try to select the same item in the Dropdown without using the "SelectedItem" property of the HtmlComboBox element.
I try to use the keyboard to select the element in the dropdown box, first I click on the Dropdown and then I use the Down key and Enter key to select the element that I want:
public void SelectStatus_SP(string SelectedItem)
{
#region Variable Declarations
HtmlComboBox uIStatusComboBox = this.UIHttpsappWindow200.UIpopupUITEDocument5.UIWorkplaceDashboardsFrame.UIpopupUITEDocument.UIStatusComboBox;
#endregion
Mouse.Click(uIStatusComboBox);
Keyboard.SendKeys(uIStatusComboBox, "{Down}{Down}{Enter}", ModifierKeys.None);
}
In my case the element that I want to select is the 3rd one, so I go down 2 times and then hit enter on the element I want to select.
This workaround is not so good because if the element changes position I will select the worng one! But this was the only way I got for the test not to be stock in that part!
I wonder if anyone had a similar issue. Because to me this seems like a bug in the Coded UI Test engine, It doesn´t make any scence for the test to be stocked while the alert is not closed!

How can i verify if a Contextmenu exists upon right click?

I need to verify if a right click menu/Context menu appears on clicking a specific element in my WPF application.
At present, my script fails when i use the entire reference of the Context menu after the right-click. Is Find Child a good option?
I am using TC9 and jscript.
Thanks in advance!
Yes, you can use the FindChild method to make sure that an object exists and visible. For example:
function Test1()
{
var orders = Sys.Process("Orders");
var listView = orders.WPFObject("HwndSource: MainForm").WPFObject("MainForm").WPFObject("gridMain").WPFObject("OrdersView");
listView.ClickR(106, 82);
var menu = orders.FindChild(["NativeClrObject.Name", "VisibleOnScreen"], ["ViewContextMenu", true], 10);
if (menu.Exists)
Log.Message("The menu is displayed");
else
Log.Error("The menu is not displayed");
}
A tricky thing here can be getting the properties of the context menu object since it can be not listed in the Object Browser while the menu is not displayed. To overcome this, use the Object Spy tool with the Point to the object and fix feature.

MvvmCross : databinding programmatically

I think I need to bind data programmatically to solve my problem.
I use a TabHost which hosts 2 Tabs.
I need to load the MvxBindableListView in the second tab when TabHost appears and keep the first tab as default tab.
What I'm doing is starting the second tab activity without problem because I check the process using this code:
protected override void OnViewModelSet()
{
SetContentView(Resource.Layout.Page_ActivityView);
System.Diagnostics.Debug.WriteLine("activityView started");
MvxBindableListView mvxBindableListView = FindViewById<MvxBindableListView>(Resource.Id.mvxBindableListView);
mvxBindableListView.ChildViewAdded += new System.EventHandler<Android.Views.ViewGroup.ChildViewAddedEventArgs>(mvxBindableListView_ChildViewAdded);
}
"activityView started" is displayed in output debugger, but MvxBindableListView.ChildViewAdded event isn't raised, only when I click the second tab.
So I suppose that MvxBindableListView is not databound.
Thanks in advance to help me loading my second tab programmatically.
I think ChildViewAdded is an event that occurs when the ListView is rendered - at that time when it needs to 'draw list items', then it will ask its adapter for child Views for the screen. As you scroll down the list, it will then ask for more child views - but it will also reuse views - so for a simple list you should only ever (hopefully) get N+1 calls on ChildViewAdded for a list which shows N items at one time.
So it's perfectly possible for a list to be databound but never to call ChildViewAdded - that won't get called until the list is 'drawn'
Sadly the Xamarin docs aren't helpful here - http://docs.mono-android.net/monodoc.ashx?link=E%3AAndroid.Views.ViewGroup.ChildViewAdded
Note: if you do actually want to bind programatically, then you can do this to - using Bind() methods and extension methods. However, I haven't expanded on that here - as it doesn't sound like that's actually what you need!

jQuery 'on' not registering in dynamically generated modal popup

I was under the impression that jQuery's on event handler was meant to be able to 'listen' for dynamically created elements AND that it was supposed to replace the behavior of live. However, what I have experienced is that using on is not capturing the click event whereas using live is succeeding!
The tricky aspect of my situation is that I am not only dynamically creating content but I'm doing it via an AJAX .get() call, and inserting the resultant HTML into a modal .dialog() jQueryUI popup.
Here is a simplified version of what I was trying to accomplish (wrapped in $(document).ready(...) ):
$.get("getUserDataAjax.php", queryString, function(formToDisplay) {
$("#dialog").dialog({
autoOpen: true,
modal: true,
buttons...
}).html(formToDisplay);
});
$(".classThatExistsInFormToDisplay").on("click", function() {
alert("This doesn't get called");
});
From the documentation for on I found this which which was how I was approaching writing my on event:
$("p").on("click", function(){
alert( $(this).text() );
});
However, for some reason, live will work as I expect -- whereas on is failing me.
This isn't a question for "how can I make it work" because I have found that on will succeed (capture clicks) if I declare it inside the function(formToDisplay) callback.
My question is: what is wrong with on that it isn't finding my dynamically created elements within a modal popup? My jQuery instance is jquery-1.7.2. jQueryUI is 1.8.21.
Here are two jsFiddles that approximate the issue. Click the word "Test" in both instances to see the different behavior. The only difference in code is replacing on for live.
Where the click is captured by live.
Where the click is NOT captured by on (click 'Test - click me' to see nothing happen).
I realize I may just be using on inappropriately or asking it to do something that was not intended but I want to know why it is not working (but if you have something terribly clever, feel free to share). Thanks for your wisdom!
Update / Answer / Solution:
According to user 'undefined', the difference is that on is not delegated all the way from the top of the document object whereas live does/is.
As Claudio mentions, there are portions of the on documentation that reference dynamically created elements and that what you include in the $("") part of the query needs to exist at runtime.
Here is my new solution: Capture click events on my modal dialog, which, although it does not have any content when the event is created at runtime, will be able to find my content and element with special class that gets generated later.
$("#dialog").on("click", ".classThatExistsInFormToDisplay", function() {
... //(success! Event captured)
});
Thanks so much!
live delegates the event from document object, but on doesn't, if you want to delegate the event using on method, you should delegate the event from one of static parents of the element or document object:
$(document).on("click", ".clickHandle", function() {
alert("Content clicked");
});
The problem is that the element to which you attach the event has to exist.
You have to use on like this to capture clicks on p tags created dynamically
$("#existingContainerId").on("click", "p", function(){
alert( $(this).text() );
});
if you have no relevant existing container to use, you could use $("body") or $(document)
If selector is omitted or is null, the event handler is referred to as direct or directly-bound. The handler is called every time an event occurs on the selected elements, whether it occurs directly on the element or bubbles from a descendant (inner) element.
When a selector is provided, the event handler is referred to as delegated. The handler is not called when the event occurs directly on the bound element, but only for descendants (inner elements) that match the selector. jQuery bubbles the event from the event target up to the element where the handler is attached (i.e., innermost to outermost element) and runs the handler for any elements along that path matching the selector.
Event handlers are bound only to the currently selected elements; they must exist on the page at the time your code makes the call to .on(). To ensure the elements are present and can be selected, perform event binding inside a document ready handler for elements that are in the HTML markup on the page. If new HTML is being injected into the page, select the elements and attach event handlers after the new HTML is placed into the page. Or, use delegated events to attach an event handler, as described next
Take a look to section Direct and delegated events here for more details

How to call the same function that the ToolBar editbutton does

So I have created a context box upon right click that has Add/Edit/Delete Rows. I also have a bunch of code launched before the Dialog is shown. My problem is that when I use the context menu it doesn't go through some of the code. I have tried to call on the functions directly but it doesn't format correctly.
I am mainly concerned with the edit button, here is the code I am using to bring up the edit Dialog
function editRow() {
var grid = jQuery("#<%= Jqgrid1.ClientID %>");
var rowKey = grid.getGridParam("selrow");
if (rowKey) {
// I have tried calling functions here and it still doesn't work
grid.editGridRow(rowKey, grid.editDialogOptions);
}
else {
alert("No rows are selected");
}
}
So if I use this to display the editform it isn't formatted correctly nor does it go through the functions all correctly.
I am using the ASP Webforms version of Jqgrid so I call the function by doing this
<cc1:JQGrid1 ID="Jqgrid1
//other attributes
ClientSideEvents-BeforeEditDialogShown="ChangeMonitor"
//Rest of code />
So this works just fine, and I'm trying to get the Edit button on the context menu to display correctly.
My thought was to use Jquery to trigger a click on the actual Edit button once someone used the context menu. I couldn't find an ID that would work however.
Is there an easy way to connect my context menu Edit button, with the actual Edit button in the toolbar?
Well I found a solution to my problem.
The id field of the button was edit_ct100_cpMainContent_Jqgrid1_top so I just triggered a click with this code.
$("td[id^=edit][id$=top]").trigger("click")
For some reason when I used the _ct100_cpMainContent_Jqgrid1 it wasn't working, but now it does. Hope this helps someone.

Resources