Part 10 MDriven Designer Overview. Actions and navigation
    No edit summary
    (Updated Edited template to July 12, 2025.)
     
    (16 intermediate revisions by 4 users not shown)
    Line 1: Line 1:
    <message>Write the content here to display this box</message>
    <html>
    <html>
    <h4>In depth overview on how to navigate between views with actions and how root object expression works. You will find this pattern recurring over and over, while trying to solve real business problems. You will get the access to the data as we show the objects and navigate into various views for more detailed information. This skills help you develop efficient model infrastracture once it grows.</h4>
    <h4>This is an in-depth overview of how to navigate between views with actions and how root object expressions work. You will find this
      pattern recurring over and over while trying to solve real business problems. You will get access to the data as we
      show the objects and navigate into various views for more detailed information. These skills help you develop an efficient
      model infrastructure once it grows.</h4>


    <p>
    <p class="video-warn">
    <em>To make your experience more comfortable, we set the main tags mentioned in the video to the right bar menu of this mini player. Choose the interesting subtitle on the list and immediately get to the exact theme timeplace in the video. Now you can pick any topic to be instructed without watching the whole video.</em>
      <em>To make your experience smooth, we set the main tags mentioned in the video to the right bar menu of this mini-player. Choose an interesting subtitle on the list and immediately get to the exact theme navigation item place in the
    <style type="text/css">
        video. Now you can pick any topic to be instructed on without watching the whole video.</em>
    p {
    opacity: 0.7;
    text-align: justify;
    width: 90%
    }
    </style>
    </p>
    </p>


    <style>
    <div class="video">
    #video12 {
       <div class="video__wrapper">
      position: relative;
        <iframe src="https://www.youtube.com/embed/fiuwP-KTmls?rel=0&autoplay=0" frameborder="0" allowfullscreen></iframe>
      height: 500px;
       </div>
      width:560px;
      <div class="video__navigation">
      padding-bottom: 10px;
         <span class="navigation-item" data-video="fiuwP-KTmls" data-start="111" tabindex="0">Actions </span>
    }
          <span class="navigation-item" data-video="fiuwP-KTmls" data-start="125" tabindex="0"> &bull; Global actions</span>
    #video12 iframe {
          <span class="navigation-item" data-video="fiuwP-KTmls" data-start="633" tabindex="0"> &bull; ViewModel Action </span>
      position: absolute;
          <span class="navigation-item" data-video="fiuwP-KTmls" data-start="775" tabindex="0"> &bull; Class actions </span>
      min-height: auto;
         <span class="navigation-item" data-video="fiuwP-KTmls" data-start="179" tabindex="0"> ViewModel Root Object </span>
      min-width: auto;
         <span class="navigation-item" data-video="fiuwP-KTmls" data-start="367" tabindex="0"> Create Repository Researcher </span>
    }
         <span class="navigation-item" data-video="fiuwP-KTmls" data-start="605" tabindex="0"> Action Definitions </span>
    #video12 div {
         <span class="navigation-item" data-video="fiuwP-KTmls" data-start="650" tabindex="0"> Execute Expression </span>
      position: absolute;
         <span class="navigation-item" data-video="fiuwP-KTmls" data-start="715" tabindex="0"> Change the root of the View </span>
      top: 0;
         <span class="navigation-item" data-video="fiuwP-KTmls" data-start="1010" tabindex="0"> "VM does not require a root object" </span>
      left:760px;
         <span class="navigation-item" data-video="fiuwP-KTmls" data-start="1131 " tabindex="0"> Execute expression OnShow </span>
      width: 260px;
          <span class="navigation-item" data-video="fiuwP-KTmls" data-start="1173" tabindex="0"> vSender variable </span>
      height: 100%;
      padding-left: 10px;
      overflow-y: auto;
    }
    span {
        font-size: 18;
        display:block;
       padding: 2px 10px 2px 10px;
        padding-bottom: 0.5;
        padding-top: 0.5;
      opacity: 0.7;
    }
    span:hover {
      color: #0000FF;
      cursor: pointer;
    }
    span:focus {
      color: blue;
    </style>
    </br>
    <div id="video12">
    <iframe width="740" height="500" src="https://www.youtube.com/embed/-kJdpTsCadw?rel=0&autoplay=0" frameborder="0" allowfullscreen></iframe>
       <div>
         <span data-video="-kJdpTsCadw" data-start="106" tabindex="0">Actions </span>
        <ul> <span data-video="-kJdpTsCadw" data-start="120" tabindex="0"> &bull; global actions</span>
        <span data-video="-kJdpTsCadw" data-start="628" tabindex="0"> &bull; ViewModel Action </span>
        <span data-video="-kJdpTsCadw" data-start="770" tabindex="0"> &bull; class actions </span> </ul>
         <span data-video="-kJdpTsCadw" data-start="174" tabindex="0"> ViewModel Root Object </span>
         <span data-video="-kJdpTsCadw" data-start="362" tabindex="0"> Create Repository Researcher </span>
         <span data-video="-kJdpTsCadw" data-start="600" tabindex="0"> Action Definitions </span>
         <span data-video="-kJdpTsCadw" data-start="645" tabindex="0"> Execute Expression </span>
         <span data-video="-kJdpTsCadw" data-start="710" tabindex="0"> Change the root of the View </span>
         <span data-video="-kJdpTsCadw" data-start="1005" tabindex="0"> "VM does not require a root object" </span>
         <span data-video="-kJdpTsCadw" data-start="1126 " tabindex="0"> Execute expression OnShow </span>
        <ul> <span data-video="-kJdpTsCadw" data-start="1168" tabindex="0"> vSender variable </span> </ul>
       </div>
       </div>
    </div>
    </div>


    <script>
    var IMG = document.querySelectorAll('#video12 span'),
        IFRAME = document.querySelector('#video12 iframe');
    for (var i = 0; i < IMG.length; i++) {
      IMG[i].onclick = function() {
        IFRAME.src = 'http://www.youtube.com/embed/' + this.dataset.video + '?rel=0&autoplay=1';
        if(this.dataset.end) IFRAME.src = IFRAME.src.replace(/([\s\S]*)/g, '$1&end=' + this.dataset.end);
        if(this.dataset.start) IFRAME.src = IFRAME.src.replace(/([\s\S]*)/g, '$1&start=' + this.dataset.start);
        this.style.backgroundColor='rgba(0,0,0,.2)';
      }
    }
    </script>
    </html>
    </html>
     
    [[Category:MDriven Designer]]
    '''Raw subtitles text'''
    [[Category:MDriven Designer Sessions]]
     
    [[Category:View Model]]
    hi and welcome, I've promised to do a
    [[Category:Navigation]]
     
    [[Category:Expressions]]
    video on windows and navigation or
    [[Category:Actions]]
     
    {{Edited|July|12|2025}}
    views and navigation, now, let's start from the beginning
     
    let's say we have nothing and we have
     
    this single class with an attribute, this is all we have and
     
    well we have the definition of information
     
    but we have nothing else, so in order to view this information
     
    we need a view model and let's do that
     
    so that's the view this and we say what
     
    kind of class it is and when we have
     
    done that, we can add attribute1 that
     
    would be our view, since the debugger
     
    or the prototyper, when the field is next to the end like this,
     
    it's expanded, so let's make this a little bigger
     
    so it's not next to the end, 2 by 3, like that
     
    ok, so now we have information and a view
     
    but we don't have any way to get here
     
    that's where the actions come in
     
    they should be here, of course this is called repetition, so far
     
    let's do a global action, which are the
     
    actions, that show up in the main menu
     
    and this global action, let's make it
     
    bring up the ViewModel1, so all we have
     
    said now is that the main menu
     
    should have a action called new global action
     
    and it should bring a ViewModel1
     
    let's see what happens and when around
     
    that, so we have the new global action 1
     
    and it brings up a viewmodel, but this is a bit treacherous
     
    it's a viewmodel, but we don't have any object in it
     
    we know, it should be of class1
     
    but there really isn't any object of class1
     
    as of yet and why is that, well it's
     
    because the viewmodel root object expression is empty, so we really need to
     
    provide object, so that this expression
     
    has something to work with and let's
     
    make this a bit clearer by adding a
     
    generic column with a expression, that we say
     
    self.isnull, that would be bulean
     
    if in end show the checkbox
     
    that would be checked, if this is null
     
    so, is this really null and let's make
     
    a little bit bigger  then
     
    so re-fresh the model and new global action, is this really null
     
    yeah, so that one is checked, so that's a
     
    problem for us right now, we need to fill
     
    the root object, but what should we fill
     
    it with, well let's try first to just
     
    do class1.create, that will be ok then we
     
    at least would have one, so, when the action is executed it should
     
    bring up ViewModel1, but the root of
     
    ViewModel1 should be set to the
     
    result of this expression class1.create
     
    so what happens then refreshing the model and then it isn't
     
    null anymore, so we're okay to wright here
     
    and then that will show, right, but
     
    we can do as many of these as we want
     
    holding down ctrl, while I press
     
    the action brings up another tab, so I
     
    can do this one and that one and this one, etc
     
    that won't help much, because there is
     
    actually no way to see them all or
     
    to open up perform with an existing class1 right
     
    the only thing we can do is actually
     
    just create new one in this view, so
     
    normally all applications and
     
    all system has some kind of repository
     
    researcher, where you could find things
     
    to start with and maybe you browse all
     
    the things you have and you grab one of those
     
    so let's do a view that is our browser
     
    add a viewmodel and since it's
     
    gonna be our browser, let's call it BrowserView
     
    and give it the type Class1
     
    and that's the only class we have currently
     
    so why not and as add a nested view model class
     
    we'd fast pick class1.allinstunces
     
    what it does is generic column with class1.allinstunces
     
    and it states something showing class1
     
    soб change these expression to, what do we
     
    have, we have attributes, like that
     
    so this would be a good view to show
     
    from the main menu, so, if we just stand
     
    on it and say add a global action for
     
    show what happens then is that this action was created
     
    let's see, what it does actually what did
     
    I do, I think the wrong thing and you want
     
    to press ctrl+z for undo, I take it by
     
    the menu, so you see what I do, undo and
     
    then it disappeared, what I wanted to do
     
    was to add not the class action for show
     
    I wanted to add a global action for show
     
    like that, so what it what happened was
     
    show browser view it's named and then it
     
    brings up the browser view and this one
     
    doesn't have a root object expression
     
    because it doesn't need one, because it
     
    shows all class1 instances, so returning here and refreshing the model
     
    and now show browser view, this one will
     
    show al, since I restarted the system
     
    with the model refresh, let's see
     
    what happens if I press the one that creates, aaa, abb
     
    then we see that there really are two objects
     
    of class1 and we can change this one
     
    here and see that they are realy the same
     
    but then this was a limitation we really
     
    want to be able to create things here
     
    so, let's head back here and add
     
    but I press this button action
     
    definitions, that same action edit or
     
    action definitions for shows, but it's
     
    filtered on the view, I stand on and it
     
    only shows the viewmodel actions and the
     
    class actions that match, so this is
     
    a good way to reduce the amount of
     
    actions as they might be many/ yet
     
    so what I want to do is to add a view
     
    model action here and say that this one
     
    can create new class1 object, like that
     
    and the execute expression should just do what
     
    we saw before class1.create
     
    so if I refresh the model and show the browser view I have
     
    a action that actually can create things
     
    and now it shows on two levels and we'll
     
    do the same thing, it's obvious here is
     
    the only browser view level and also on
     
    the allclass1 here, but I want to
     
    opt that out because that is unnecessary and
     
    so now we're on one object and we could
     
    write something here what we want to do
     
    now is to open up one of these in our
     
    other view, so this one that we did that
     
    first new global action, this one will
     
    just create yet another one, see we have
     
    no way currently to open up this one in this
     
    well, if you really use the properties of
     
    the prototype you can drag this one to
     
    this green dot and then it will show it
     
    so this is a way to change the root of
     
    of the overview, like this and you can
     
    see that it really changed
     
    switch to object, like that, right, but and
     
    we really want to add an action
     
    available whenever we have class1 and
     
    that kind of action is class actions
     
    so new class action, class actions will always pop up whenever
     
    you have a context of that class so
     
    let's call this one create new, no
     
    that wasn't what we wanted to do, what I am to do, it it's view class1
     
    ok, that was what I wanted to do and that
     
    this action should be on this class1, what should it do,
     
    it should bring up the ViewModel1
     
    in fact, let's rename the viewmodel1 to
     
    let's call it the class1 object view
     
    class1 object view, so it should
     
    bring it up and now we have a chance to
     
    set the road object, what we
     
    want and what do we want
     
    well we know that this is
     
    class action, so it will only be in the context
     
    of the class1 objects, so that would be
     
    great just to set itself in this case
     
    and the required type, required return type
     
    is class1, because that is what
     
    the form of you expect and the context is also class1
     
    because that was the class that we
     
    made an action for, so now we have a way to
     
    let's do this again, model refresh
     
    show browser view, now we're able to
     
    this one is disabled, because there is
     
    nothing selected, we can create one and
     
    if I selected I can view it, also this
     
    class action is in two places and I see
     
    this here and that's because it's on
     
    this level and since this is class1
     
    even though it is not assigned,
     
    it doesn't require a root object, but it also on this level
     
    so this first level will always be null
     
    also I will opt that out and refresh and show
     
    browser view, so now I can create a new
     
    class and when I select it
     
    I can view that class and I can write
     
    something and I can go back, like that, create
     
    and view it and go back, like that,
     
    so this is how you root and why you root windows or views
     
    if, we were to check his model, we will get
     
    some warnings and they are fairly long
     
    let's see if I can get them on screen
     
    so there's a new global action warning
     
    the view model does not require root object
     
    so this is just the information to help
     
    us out doing the right thing, new global object
     
    new global action, let's go to this one new global action
     
    it brings up class1 object view
     
    sets the view model root object, if we go to
     
    this view, we see that we will
     
    assign root today's but it hasn't
     
    checked the check box requires root object
     
    and that is what that warning is about
     
    so, if I do that and head back and
     
    check again, there's alone, super, so and
     
    this is how basic navigation works when
     
    you work with the MDriven and there
     
    are a few other things you can do with
     
    actions, but these, this is how you use
     
    them for navigation, you state what the
     
    view model to open up and what root object
     
    if any it should have, of course we can do
     
    few other things, so if we use the show
     
    browser view or other, the view class1 object
     
    let's take this one, it sets the root object to cell
     
    but there's also an expression
     
    execute expression on show and what it
     
    will do is to execute this expression
     
    whenever the view shows, so let's
     
    experiment, self and we
     
    in this case we will be in the context of
     
    the sending, of the receiving form
     
    so, the form  as vCurrent class1 object view
     
    it's the root to the variable representing the root, but
     
    we also have this strange variable vSender
     
    that state context from their calling action
     
    so this is actually this self
     
    that since this is a class action
     
    is a class1 so sender self and this
     
    is what we set as the root, what if we
     
    were to set attribute1 and we
     
    would simply sign itself plus one, what
     
    would happen then, refresh model, show
     
    the browser, create a new one this is
     
    empty, but as we selected and she was the
     
    new one, it says one and if we go back
     
    and show it again it says 11, because we have this
     
    execute expression on show, what it is
     
    what I'm supposed to use this for
     
    well, maybe you have some variable that
     
    you want to set, some context where you
     
    come from that you want to set in the view
     
    when you open it then this expression is great, but it does not in
     
    any way replace the root object expression
     
    the root object expression is
     
    really important with working with view that are rooted
     
    it's the only way to set the root on the object
     
    well, as you know now it's not the only way
     
    because you can also change
     
    the root by draging to this dot and ok so
     
    I'm going to wrap this up, feel free
     
    to test these things out

    Latest revision as of 06:00, 20 January 2025

    This page was created by Alexandra on 2017-01-08. Last edited by Edgar on 2025-01-20.

    This is an in-depth overview of how to navigate between views with actions and how root object expressions work. You will find this pattern recurring over and over while trying to solve real business problems. You will get access to the data as we show the objects and navigate into various views for more detailed information. These skills help you develop an efficient model infrastructure once it grows.

    To make your experience smooth, we set the main tags mentioned in the video to the right bar menu of this mini-player. Choose an interesting subtitle on the list and immediately get to the exact theme navigation item place in the video. Now you can pick any topic to be instructed on without watching the whole video.

    Actions • Global actions • ViewModel Action • Class actions ViewModel Root Object Create Repository Researcher Action Definitions Execute Expression Change the root of the View "VM does not require a root object" Execute expression OnShow vSender variable

    Retrieved from "https://wiki.mdriven.net/index.php?title=Documentation:Part_10_MDriven_Designer_Overview._Actions_and_navigation&oldid=25372"

    © MDRIVEN . All Rights Reserved

    API Docs
    MDriven World | Portal | Blog | YouTube | StackOverflow | Facebook

    © MDRIVEN . All Rights Reserved