locked
ShowAddEdit Screen HTML Client RRS feed

  • Question

  • Hi,

    I'm creating a screen to create a new service of an asset. What I would like to do if the asset doesn't happen to exist already is add a new one.

    On my AddEditServiceAsset screen I've added a button in the command bar and told it to open "showAddEditAsset" creating a new entity:


    I now run my app and from the browse screen click Add Asset Service.

    If the asset the engineer is servicing doesn't exist in the drop down we need to create a new one so the user would press Show Add Edit Asset:

    When the Add Edit Asset screen opens there isn't a save button, just a tick button. Also the form has also been validated and the required fields are in red:

    Rather than just add this asset I need to save it too because in the Asset_Inserting method a friendly record number is created which is the display name for the entity so that when the engineer clicks the drop down the record makes sense to him/her.

    Am I misunderstanding the workings here or am I doing something wrong? When the tick is clicked the entity is only added to the collection not saved so when the user clicks the drop down box the added entity is blank because the inserted method hasn't fired and created our friendly name for the user.

    I hope I've not over complicated the post but couldn't think of a better way to describe my scenario. Any pointers would be appreciated.

    Thanks,

    Paul.



    • Edited by Paul Pitchford Friday, November 22, 2013 10:50 PM More spelling :/
    Friday, November 22, 2013 10:47 PM

Answers

  • One more thing, when I simply don't like the way LightSwitch wants my "program flow" to go

    Michael,

    "Every day is a school day."

    It's just a pity it took a few days to learn enough not to have solved this earlier. This line quoted that you wrote in your last post really resonated with me. Originally I thought I was doing something wrong. As someone who doesn't really have much interaction with other developers, I have always worked on my own on small to medium sized projects. I've never had a proper programming job so to speak. So when I stumble across a problem, I always assume I'm doing something wrong rather than the tool not necessarily doing what I would like.

    Here I think it was two fold. I found the reason validation was firing. For some reason I had set the required fields to null. I have no idea nor do I remember why I did this and can only assume I was testing something at some point. As soon as I removed this code, the screen loads fine.

    With regards to the tool not doing what I needed, I adapted what I should do in this case. Going back to my initial brief that I wanted Asset_Inserting to fire so that I could set a friendly Asset Description (Asset Id & " - " & Description), I went back to your first new button JavaScript example and thought about what I could do to make it fit my requirements. In the end I came up with this:

    myapp.AddEditAssetService.NewAsset_execute = function (screen) {
    
        if (screen.AssetService.Customer != null) {
            myapp.showAddEditAsset(null, {
                beforeShown: function (AddEditAssetScreen) {
                    // Make a new Asset
                    var newAsset = new myapp.Asset();
                    newAsset.setCustomer(screen.AssetService.Customer);
                    AddEditAssetScreen.Asset = newAsset;
                },
                afterClosed: function (AddEditAssetScreen, navigationAction) {
                    // Set the asset description
                    AddEditAssetScreen.Asset.AssetDescription = "New - " + AddEditAssetScreen.Asset.Make + " " + AddEditAssetScreen.Asset.UnitType;
                }
            });
        }
    };

    Basically for the user this add's "New" to the beginning of the description so when they load the modal view, it makes sense to them. After this when the AssetService and Asset get inserted, my desired Inserting code fires and set's the description as we'd like it long term. This in actual fact is quite desirable anyway, so I'm happy with the result.

    Thanks for your persisted help Michael, I read most of your blog posts and have purchased your book in the past. Your help in the Lightswitch community is invaluable and really helps me develop wonderfully useful applications.

    Kind Regards,

    Paul.

    Sunday, November 24, 2013 1:38 PM

All replies

  • I would use the BeforeShown as described here:

    Visual Studio LightSwitch Screen Navigation and Advanced JavaScript Examples.

    The Add Button Wizard works fine for most situations but I sometimes use beforeShown and AfterClosed like this:

    myapp.AddEditOrder.DynamicAddOrderDetail_execute = function (screen) { myapp.showAddEditOrderDetail(null, { beforeShown: function (AddEditOrderDetailScreen) { // Make a new OrderDetail var newOrderDetail = new myapp.OrderDetail(); // Set the Order property newOrderDetail.setOrder(screen.Order); // Set the Quantity newOrderDetail.OrderQuantity = 0; // Try to find a Product screen.details.dataWorkspace.ApplicationData.Products .load().then(function (results) { // Try to get the first Product var FirstProduct = results.results[0]; // Did we find a first Product? if (FirstProduct != undefined && FirstProduct != null) { // Set the first Product as the Product for the OrderDetail newOrderDetail.setProduct(FirstProduct); } AddEditOrderDetailScreen.OrderDetail = newOrderDetail; }); }, afterClosed: function (AddEditOrderDetailScreen, navigationAction) { // Update the last cached OrderDetailRowParent item ColorOrderDetail(AddEditOrderDetailScreen.OrderDetail.OrderQuantity); } });

    };



    Unleash the Power - Get the LightSwitch HTML Client book

    http://LightSwitchHelpWebsite.com


    Friday, November 22, 2013 11:48 PM
  • Hi Michael,

    Yes I'd seen the example and used the beforeShown. I just can't figure out how to save the new Asset so that the inserting method fires so that when they return to the Asset Service screen the new asset shows with the entity summary property (ID & Description) in the drop down. At the moment it looks like this:

    It really would be a pain for the user to have to exit out of these screens to add a new asset another way. I really need to allow them to create a new one whilst adding the service. If you understand?

    Thanks,

    Paul.


    • Edited by Paul Pitchford Saturday, November 23, 2013 12:46 AM Spelling, dam you fat fingers! :)
    Saturday, November 23, 2013 12:45 AM
  • You can always get the save button to appear on a screen by clicking on the root element on the screen and changing the Behavior / Screen Type to Edit.

    Start there and see if that improves the situation.


    Unleash the Power - Get the LightSwitch HTML Client book

    http://LightSwitchHelpWebsite.com

    Saturday, November 23, 2013 1:56 AM
  • I'd checked that already and it's set to edit but the save icon doesn't show but the tick does.

    Cheers.

    Saturday, November 23, 2013 2:16 AM
  • In the before open you want to create a new Asset entity and then set it as the data for the window. I think you also need to set a default customer for the Asset. That is why I posted my code sample because I am doing something similar (newOrderDetail.setProduct(FirstProduct)).

    Unleash the Power - Get the LightSwitch HTML Client book

    http://LightSwitchHelpWebsite.com

    Saturday, November 23, 2013 2:28 AM
  • This is the code behind for my button:

    myapp.AddEditAssetService.NewAsset_execute = function (screen) {
    
        if (screen.AssetService.Customer != null) {
            myapp.showAddEditAsset(null, {
                beforeShown: function (AddEditAssetScreen) {
                    // Make a new Asset
                    var newAsset = new myapp.Asset();
                    newAsset.setCustomer(screen.AssetService.Customer);
                    AddEditAssetScreen.Asset = newAsset;
                }
            });
        }
    };

    Similar to before, it opens a new Asset window. Sets the customer. You can see it's triggered validation as some of the required fields are highlighted (why is it doing this?). There is no save icon it's a tick. When you commit the changes the new asset hasn't been saved, just added to the asset collection therefore my all important Asset_Inserting method hasn't triggered.

    Saturday, November 23, 2013 12:15 PM
  • I do not see the Customer being set in your screen shot.

    1) Can you set a break point on "AddEditAssetScreen.Asset = newAsset" and make sure there is an "newAsset" with a customer?

    2) Are you sure that the root entity on the "AddEditAssetScreen" is "Asset"?


    Unleash the Power - Get the LightSwitch HTML Client book

    http://LightSwitchHelpWebsite.com

    Saturday, November 23, 2013 2:13 PM
  • Here is a later screen shot where the customer gets set:

    Here is the debug:

    Here is the AddEditAsset screen:

    • Edited by Paul Pitchford Saturday, November 23, 2013 2:32 PM Images wrong
    Saturday, November 23, 2013 2:26 PM
  • Can you set default values for Make, Unit Type, and Serial number?

    If not then the interface is correct to show the red validation boxes. The person should not be able to click the check button until they are filled in. If they don't want to continue they click the X button.


    Unleash the Power - Get the LightSwitch HTML Client book

    http://LightSwitchHelpWebsite.com

    Saturday, November 23, 2013 2:37 PM
  • No, they are to be input by the user. I do not know what they would be at design time.

    The fact that validation has occurred before the user has entered any data is some what confusing. Along with the fact the screen is for new data and isn't actually saving the data to the database when it commits.

    Saturday, November 23, 2013 2:44 PM
  • As far as the validation firing, is there any code on the Add Edit Asset screen?

    As far as the data being saved, your situation should be like my "Cache an Element to be Updated Later" example on: http://lightswitchhelpwebsite.com/Blog/tabid/61/EntryId/1196/Visual-Studio-LightSwitch-Screen-Navigation-and-Advanced-JavaScript-Examples.aspx.

     

    Unleash the Power - Get the LightSwitch HTML Client book

    http://LightSwitchHelpWebsite.com

    Saturday, November 23, 2013 2:53 PM
  • One more thing, when I simply don't like the way LightSwitch wants my "program flow" to go, I use WCF RIA Services to create Entities that match what I want on the screen to show and allow me to save data when I want to:

    LightSwitch Survey: Handling Complex Business Logic Using WCF RIA Services

     

    Unleash the Power - Get the LightSwitch HTML Client book

    http://LightSwitchHelpWebsite.com

    Saturday, November 23, 2013 2:55 PM
  • One more thing, when I simply don't like the way LightSwitch wants my "program flow" to go

    Michael,

    "Every day is a school day."

    It's just a pity it took a few days to learn enough not to have solved this earlier. This line quoted that you wrote in your last post really resonated with me. Originally I thought I was doing something wrong. As someone who doesn't really have much interaction with other developers, I have always worked on my own on small to medium sized projects. I've never had a proper programming job so to speak. So when I stumble across a problem, I always assume I'm doing something wrong rather than the tool not necessarily doing what I would like.

    Here I think it was two fold. I found the reason validation was firing. For some reason I had set the required fields to null. I have no idea nor do I remember why I did this and can only assume I was testing something at some point. As soon as I removed this code, the screen loads fine.

    With regards to the tool not doing what I needed, I adapted what I should do in this case. Going back to my initial brief that I wanted Asset_Inserting to fire so that I could set a friendly Asset Description (Asset Id & " - " & Description), I went back to your first new button JavaScript example and thought about what I could do to make it fit my requirements. In the end I came up with this:

    myapp.AddEditAssetService.NewAsset_execute = function (screen) {
    
        if (screen.AssetService.Customer != null) {
            myapp.showAddEditAsset(null, {
                beforeShown: function (AddEditAssetScreen) {
                    // Make a new Asset
                    var newAsset = new myapp.Asset();
                    newAsset.setCustomer(screen.AssetService.Customer);
                    AddEditAssetScreen.Asset = newAsset;
                },
                afterClosed: function (AddEditAssetScreen, navigationAction) {
                    // Set the asset description
                    AddEditAssetScreen.Asset.AssetDescription = "New - " + AddEditAssetScreen.Asset.Make + " " + AddEditAssetScreen.Asset.UnitType;
                }
            });
        }
    };

    Basically for the user this add's "New" to the beginning of the description so when they load the modal view, it makes sense to them. After this when the AssetService and Asset get inserted, my desired Inserting code fires and set's the description as we'd like it long term. This in actual fact is quite desirable anyway, so I'm happy with the result.

    Thanks for your persisted help Michael, I read most of your blog posts and have purchased your book in the past. Your help in the Lightswitch community is invaluable and really helps me develop wonderfully useful applications.

    Kind Regards,

    Paul.

    Sunday, November 24, 2013 1:38 PM
  • One more thing, when I simply don't like the way LightSwitch wants my "program flow" to go

    Michael,

    "Every day is a school day."

    It's just a pity it took a few days to learn enough not to have solved this earlier. This line quoted that you wrote in your last post really resonated with me. Originally I thought I was doing something wrong. As someone who doesn't really have much interaction with other developers, I have always worked on my own on small to medium sized projects. I've never had a proper programming job so to speak. So when I stumble across a problem, I always assume I'm doing something wrong rather than the tool not necessarily doing what I would like.

    Here I think it was two fold. I found the reason validation was firing. For some reason I had set the required fields to null. I have no idea nor do I remember why I did this and can only assume I was testing something at some point. As soon as I removed this code, the screen loads fine.

    With regards to the tool not doing what I needed, I adapted what I should do in this case. Going back to my initial brief that I wanted Asset_Inserting to fire so that I could set a friendly Asset Description (Asset Id & " - " & Description), I went back to your first new button JavaScript example and thought about what I could do to make it fit my requirements. In the end I came up with this:

    myapp.AddEditAssetService.NewAsset_execute = function (screen) {
    
        if (screen.AssetService.Customer != null) {
            myapp.showAddEditAsset(null, {
                beforeShown: function (AddEditAssetScreen) {
                    // Make a new Asset
                    var newAsset = new myapp.Asset();
                    newAsset.setCustomer(screen.AssetService.Customer);
                    AddEditAssetScreen.Asset = newAsset;
                },
                afterClosed: function (AddEditAssetScreen, navigationAction) {
                    // Set the asset description
                    AddEditAssetScreen.Asset.AssetDescription = "New - " + AddEditAssetScreen.Asset.Make + " " + AddEditAssetScreen.Asset.UnitType;
                }
            });
        }
    };

    Basically for the user this add's "New" to the beginning of the description so when they load the modal view, it makes sense to them. After this when the AssetService and Asset get inserted, my desired Inserting code fires and set's the description as we'd like it long term. This in actual fact is quite desirable anyway, so I'm happy with the result.

    Thanks for your persisted help Michael, I read most of your blog posts and have purchased your book in the past. Your help in the Lightswitch community is invaluable and really helps me develop wonderfully useful applications.

    Kind Regards,

    Paul.


    I am glad you worked it out. The beforeShown/afterClosed is very powerful. When I look though my code I am using it everywhere.

    Unleash the Power - Get the LightSwitch HTML Client book

    http://LightSwitchHelpWebsite.com

    Sunday, November 24, 2013 2:06 PM