locked
Parent child screen problems in html client RRS feed

  • Question

  • I will try to keep this brief.  I am creating a LS2013 html client application with a SQL backend. One purpose is to have users complete a profile. There are multiple related tables and I designed the UI with tabs that are initially hidden until the user hits continue to move on.  I am using the save pipeline so the parent and children will all be saved at the same time when the profile is complete.

    I have a few problems that I worked around but my current problem is with validation.

    Problems encountered:

    1. I used the concepts introduced in this post by Beth Massi, http://blogs.msdn.com/b/bethmassi/archive/2013/03/21/master-detail-screens-with-the-lightswitch-html-client.aspx. (I could not download the code due to versioning - I think). It shows how to add related records on the same screen (supposedly without code). When I tried it I got "No Items" for the children instead of the controls. After researching I came across a solution that included these this code (using my entity sets - terminology?):

    var l = new myapp.BusinessLocation
        l.Business = screen.Business;

    This works and I moved on. (with the nagging feeling that I missed something since Beth said no code).

    2. I show/hide based on control values but could not access the contentItem of the child. findContentItem works but the returned object did not have what I needed. I got around this by creating a global variable and assigning the contentItem I needed to it in the post render event of the control. Then when I need to manipulate it I use the global variable.

    3. Now that I got the screen flow and controls to work the way I want I am validating.  I found that the builtin validation (required, length, etc.) on the child controls does not work like the parent. (red box and message). Instead I get a message box with the message: Cannot continue. There are validation errors on the page.  The only way to trap errors in the beforeApplyChanges event is to remove required from all required fields in the children and then validate each.  This is going to be tedious and defeats the purpose.  What's more, although I can iterate through the controls on the child, setting validationresults does NOT apply the appropriate attributes to the control or create the message DIV. (I verified what happens by setting the validatonresults on a control on the parent and inspected the HTML.)

    Trying to trap the errors in the save pipeline Entity_validate doesn't work. It doesn't even get there.

    At this point I think I am going to have code my own save button to control events.

    My Questions are:

    1. Should I have been able to follow Beth's post to the letter and create the parent child screen without the code above? Is that what has caused my contentItem and validation problems?

    2. Is there an entry point to trap builtin validations? They never get to beforeApply changes and produce a dialog box message that is unacceptable.

    3. If I do code my own save button, is there a way of initiating the builtin validation. If not I am back to removing required from all of my required fields and verifying them one by one.

    Thanks one and all for your thoughts. I have screenshots of my content tree and data sources if it helps but and parent child scenario works.

     

    Saturday, September 26, 2015 3:13 PM

Answers

  • Hi Josh,

    Thanks for responding. I figured some things out with help from you and Michael relating my questions.

    I am creating a "wizard like" experience as described here which is why your validation idea is a good look since I want to validate the entire screen before the user continues but don't want to save changes to do it. (the save pipeline is essential for me.)

    My other questions were about the children on the screen. I have had the hardest time accessing the contentItems to do things like hide/show and .validationResults. The same techniques that work on the parent section do not work (for me) on the children.

    Although Beth's article said no code, I do require the code I listed above since the wizard is initiated from myapp.showAddEdit. I now understand that after creating the new record (I still am not fluent with the terminology so I will use old school), you must assign the parent reference to it. It works well because the user can add multiple children on the same screen. Answered.

    The problem with the children of a child required setting the child's selectedItem to the children's parent reference. Answered.

    I cannot get anything to work that requires findContentItem when the contentItem is on the child. I have given up and redesigned to work with the DOM, jquery and javascript. This at least I have a decent grasp of. Willing to share if anyone is interested. Answered.

    Didn't get to trying to implement your validation solution yet. Ran into a problem setting an entity's (terminology??) selectedItem. When I create  a new child I specifically set it as the selectedItem. First time through is fine. When I create the second,  the first selectedItem is still active.  Seems simple enough - screen.entity.selectedItem = new myapp.entity. Researching.

    • Proposed as answer by Angie Xu Tuesday, October 6, 2015 8:07 AM
    • Marked as answer by Angie Xu Thursday, October 8, 2015 2:28 AM
    Tuesday, October 6, 2015 3:27 AM

All replies

  • Hi Josh,

    Thanks for responding. I read your post and think it is the answer to one of the questions I asked and by extension one I didn't. I would like to reiterate your solution in my own words to ensure I have the concept correct.

    You are iterating over the database table (entity set?) to retrieve the entities that have builtin validation (isRequired, etc.) and storing them in an array (with a naming convention that I will figure out in the debugger).

    From there you use the array entries to create a new validate method that uses the builtin validation but you don't have to press save to initiate it.

    My screens have few enough required fields so I plan to validate the entire screen at the same time, but with your solution I could customize my submit button and iterate through the required fields before calling save changes, thereby trapping the errors and control the error message. I could also validate the screen when a tab or the continue button is clicked.

    Thank again for your response.

    Any thoughts on the parent/child screens? I ran into another problem. The solution to the "No Items" for the child I described in my original post does not work for a child of a child. I have Businesses (Parent) who have Clients (Child of Business, Parent of Social Media Accounts) who have social media accounts (Child of Clients).

    Thanks again

    Tuesday, September 29, 2015 12:51 AM
  • Hi Will,

    I replied about the validation solution in that thread here:

    https://social.msdn.microsoft.com/Forums/vstudio/en-US/f84e841d-d5fe-4c63-84d8-9e3d25e7615d/best-place-to-put-client-side-property-validation-code-html-client?forum=lightswitch

    Any thoughts on the parent/child screens? I ran into another problem. The solution to the "No Items" for the child I described in my original post does not work for a child of a child. I have Businesses (Parent) who have Clients (Child of Business, Parent of Social Media Accounts) who have social media accounts (Child of Clients).

    Beth's article does indeed not require code.  The Add Button dialog in the screen designer does the magic of adding a new child to the collection of the parent, but you have to use the add button dialog exactly the way she does and select the suggested methods from the list ie: addEditNew under Clients grouping.  I usually just create my own methods and use beforeShown to create the new entity and set the parent nav prop. 

    Either way, this is not related to the validation issues and I;m not sure I understand your #2 contentItem issue.

    HTH,

    Josh

    • Proposed as answer by Angie Xu Monday, October 5, 2015 8:32 AM
    Wednesday, September 30, 2015 8:54 PM
  • Hi Josh,

    Thanks for responding. I figured some things out with help from you and Michael relating my questions.

    I am creating a "wizard like" experience as described here which is why your validation idea is a good look since I want to validate the entire screen before the user continues but don't want to save changes to do it. (the save pipeline is essential for me.)

    My other questions were about the children on the screen. I have had the hardest time accessing the contentItems to do things like hide/show and .validationResults. The same techniques that work on the parent section do not work (for me) on the children.

    Although Beth's article said no code, I do require the code I listed above since the wizard is initiated from myapp.showAddEdit. I now understand that after creating the new record (I still am not fluent with the terminology so I will use old school), you must assign the parent reference to it. It works well because the user can add multiple children on the same screen. Answered.

    The problem with the children of a child required setting the child's selectedItem to the children's parent reference. Answered.

    I cannot get anything to work that requires findContentItem when the contentItem is on the child. I have given up and redesigned to work with the DOM, jquery and javascript. This at least I have a decent grasp of. Willing to share if anyone is interested. Answered.

    Didn't get to trying to implement your validation solution yet. Ran into a problem setting an entity's (terminology??) selectedItem. When I create  a new child I specifically set it as the selectedItem. First time through is fine. When I create the second,  the first selectedItem is still active.  Seems simple enough - screen.entity.selectedItem = new myapp.entity. Researching.

    • Proposed as answer by Angie Xu Tuesday, October 6, 2015 8:07 AM
    • Marked as answer by Angie Xu Thursday, October 8, 2015 2:28 AM
    Tuesday, October 6, 2015 3:27 AM
  • Hi Will. Glad your getting answers. For the contentitem thing I'd suggest starting a new thread in the forums with a specific example like 'when this has that value then hide the other thing'' and include some code you've tried. My guess is dataBind will be an important part of learning the lightswitch way. Josh
    Tuesday, October 6, 2015 4:53 AM