I have a delete object command working in my ViewModel. The command is bound to the button. So far, so good. When I click the button the object is deleted from the db. Now, obviously, this needs to be validated, so I am using DisplayAlert to show a "Are you sure you want to delete?" to the user. This displays, but the item deletes anyway on the button click which makes sense. I am struggling to understand how to only run my command in the ViewModel if the user chooses "Yes".
XAML Button:
<Button Text="Delete player" Command="{Binding DeleteCommand}" Clicked="DeletePlayerEvent"></Button>
Clicked Event:
private async void DeletePlayerEvent(object sender, EventArgs e)
{
bool answer = await DisplayAlert("Notification", "Are you sure you want to delete this player?", "Yes", "No");
//if (answer == true)??????
// {
//Can I run the command from here?
//}
}
ViewModel Command
public Command DeleteCommand
{
get
{
return new Command(async () =>
{
var playerServices = new PlayerServices();
await playerServices.DeletePlayerAsync(_Player.Id);
});
}
}
The problem here is that you are doing Command binding and Event subscribing together.
These both are getting fired individually and not dependent to each other.
One way you can wire them up together is call the ViewModel's DeleteCommand from your button click event when the user selected "Yes"
To get hold of the DeleteCommand property in your click event (assuming that is written in your codebehind file):
var viewModel = this.BindingContext as YouViewModel
viewModel.DeleteCommand.Execute();
Hope that helps!
Related
I have a scenario where i have 5 buttons which call the same method when clicked. These buttons are clicked in various conditions, but now i want to know how we determine that which particular button has been clicked, from the called method.
For example, i have been calling chocolate() method when i click the buttons, eclairs, dailrymilk, cadbury, snickers and kitkat. Now i will click anyof these buttons from the UI and i want to know which one is clicked. this event has to be handled in the chocolate() method only.
Please suggest me how can i implement this. I am using Adobe Flex 3
If you are not using the addEventListeners but are setting the click property in your buttons you could do something like that:
<s:Button id="snickers"
click="{chocolate('snickers')}"
label="snickers"/>
<s:Button id="kitkat"
click="{chocolate('kitkat')}"
label="kitkat"/>
private function chocolate(type:String):void
{
trace("button", type, "was clicked");
if(type == "snickers")
{
// do stuff
}
else if(type == "kitkat")
{
// do something else
}
}
if you are working with event listeners you could determine the buttons from their ids, for example:
<s:Button id="snickers"
label="snickers"/>
<s:Button id="kitkat"
label="kitkat"/>
// add your event listeners somewhere like in onCreationComplete
snickers.addEventListener(MouseEvent.CLICK, chocolate);
kitkat.addEventListener(MouseEvent.CLICK, chocolate);
private function chocolate(e:MouseEvent):void
{
// e.target is the component that has dispatched the event (a button in this case)
var type:String = e.target.id;
trace("button", type, "was clicked");
if(type == "snickers")
{
// do stuff
}
else if(type == "kitkat")
{
// do something else
}
}
I'm working on a Leave Request form on our Google site. If I comment out the app.createServerHandler line it is fine. What am I missing from the below code?
var app = UiApp.createApplication().setTitle('OIT Leave Request');
//Create a panel to hold the form elements
var panel = app.createVerticalPanel().setId('panel');
//Create event handlers for form
var AllDayBoxHandler() = app.createServerHandler('AllDayBoxEvent');
Check this link.
I believe what you're trying to do is depreciated. But either way I think your setting the handler wrong. Something like:
function doGet(e) {
var app = UiApp.createApplication().setTitle('OIT Leave Request');
//Create a panel to hold the form elements
var panel = app.createVerticalPanel().setId('panel');
app.add(panel);
//Create event handlers for form
var AllDayBoxHandler = app.createServerHandler('AllDayBoxEvent');
//Not exactly sure what events a panel can get
//A button would have a .addClickHandler method
panel.addOpenHandler(AllDayBoxHandler);
return app;
}
//The event handler method
function AllDayBoxEvent(e) {
// your code
}
This is how I create the dropdown menu with checkboxes using dijit.
layerList.reverse();
var menu = new dijit.Menu({
id : 'layerMenu'
});
dojo.forEach(layerList, function(layer) {
menu.addChild(new dijit.CheckedMenuItem({
label : layer.title,
id : layer.title.replace(" ",""),
checked : layer.visible,
onChange : function(evt) {
if (layer.layer.featureCollection) {
//turn off all the layers in the feature collection even
//though only the main layer is listed in the layer list
dojo.forEach(layer.layer.featureCollection.layers, function(layer) {
layer.layerObject.setVisibility(!layer.layerObject.visible);
});
} else {
layer.layer.setVisibility(!layer.layer.visible);
}
}
}));
});
var button = new dijit.form.DropDownButton({
label : i18n.tools.layers.label,
id : "layerBtn",
iconClass : "esriLayerIcon",
title : i18n.tools.layers.title,
dropDown : menu
});
dojo.byId('webmap-toolbar-center').appendChild(button.domNode);
I can access the individual dijit.CheckedMenuItem at runtime when the onChange event fired because I know their id. Since dijit does not has a RadioButton for MenuItem, is there a way I can change the checked status in runtime. Using "this.Id" and "evt", I can know which one is being check/uncheck by the user. Technically I can try to uncheck the other checked items if necessary to simulate the radio button behavior.
Can someone tell me how I can check/uncheck dijit.CheckedMenuItem in runtime? What properties and functions I need to call?
You should be able to just set checked to false on the other CheckedMenuItem widgets
checkedMenuItemWidget.set('checked',false)
To uncheck any given checkedMenuItem.
I am creating a dynamic context menu and as it is expected I would like to menu to be closed when the mouse leaves the menu box. I have used :
var dlg = new dijit.Menu({
onMouseLeave: function(event){
dijit.popup.close(dlg);
}
});
But when i go out side the box nothing happens. If I put same function inside the MenuItems then when I leave the MenuItem box it closes the box.
Any comment?
This would be because the dijit.Menu does not register onMouseLeave on its domNode.
To do this manually, following is all you need: (havent sampled a test though should work)
var myconnects = []
var dlg = new dijit.Menu({
destroy: function() { // for a neat garbage collections, remove listeners
var ch;
while(ch = myconnects.pop()) ch.disconnect();
this.inherited();
}
...
});
myconnects.push(dojo.connect(dlg.domNode, "onmouseleave", dojo.hitch(dlg, function() {
dijit.popup.close(this);
});
Dear All,
I've created a new Dojo button programatically. I'm doing that in one of my custom dojo class. While creating the button, I've defined an onClick method which should be called when the button is clicked. This method is part of the class. I'm not able to invoke that method, since the scope of "this" is different when the button is clicked. Can some one please help me to do fix this?
dojo.declare("CustomClass",null,{
createCustomButton:function(){
var button = new dijit.form.Button({onClick:function(){
removetrack();
testDataGrid.filter({status:"COMPLETED"});
}},"testButton1");
},
removetrack:function(){
//some logic
}
});
var customObj=new CustomClass();
customObj.createCustomButton();
I need removetrack() method to be called when I click on the Button created.
Use dojo.hitch();
dojo.declare("CustomClass",null,{
createCustomButton:function(){
var button = new dijit.form.Button({
onClick:dojo.hitch(this, function(){
this.removetrack();
testDataGrid.filter({status:"COMPLETED"});
})
},"testButton1");
},
removetrack:function(){
//some logic
}
});
var customObj=new CustomClass();
customObj.createCustomButton();
I cannot manage to do better way, in case you need urgent fix
var button = new dijit.form.Button({
label: "Custom!",
onClick:function(){
CustomClass().removetrack();
}},"result");
Hope someone can give you better option.