1. #1
    Ext JS Premium Member
    Join Date
    Jul 2008
    Location
    Miami, FL
    Posts
    56
    Vote Rating
    1
    omarc is on a distinguished road

      0  

    Default MVC Design Question

    MVC Design Question


    Hey all,

    I am trying to implement a form panel that displays customer information (company name, contact, etc) along the top and customer invoices (this is a hasMany association) along the bottom.

    I wanted to know what the best way to implement this was using the MVC in ST2.

    I thought of doing it this way:

    Implement a controller that listens to a form panel event for when a customer record is loaded, I update the customer information panel along the top (using the Ext.Component.setData method) and load the hasMany associations for the customer invoices. Problem with this is that I don't see any event in FormPanel that gets fired when a record is loaded (with Ext.FormPanel.setRecord).

    Am I correct in where I want to load the customer info and invoices?

    Is the event in FormPanel not present because this is a preview release?

    Thanks for any tips on this,

    Omar

  2. #2
    Sencha User
    Join Date
    Nov 2011
    Posts
    5
    Vote Rating
    0
    teslin is on a distinguished road

      0  

    Default


    I too had recently been wondering as to what was the most plausible method to implement a form panel. Using the MVC in ST2 had hit me so many times and I am looking forward to try out the method you have suggested here orelse will contact the hr services of sencha and will update you after the same.

  3. #3
    Ext JS Premium Member
    Join Date
    Jul 2008
    Location
    Miami, FL
    Posts
    56
    Vote Rating
    1
    omarc is on a distinguished road

      0  

    Default


    I asked one of the Sencha guys directly about this.

    He told me the best way to do it is to create a setter in the FormPanel that you can call from the list.

    So for example, in your form panel you might have something like this:

    Code:
    setCustomer: function(record) {
        this.setRecord(record);
        //Update any other panel, such as a to-many list or XTemplate from here
    
        //Display the form panel in the viewport here
    }
    Then from the list controller you might want to listen to the "select" event like so:

    Code:
    select: function(list, record) {
        var formPanel = this.getMain().down("myFormPanel");
        inspect.setCustomer(record);
    }
    That was what was suggested to me, I think it works rather well.

    I asked if maybe I should just override setRecord in the FormPanel, but he recommended I don't do that.

    Hope that helps you.

    Omar

Thread Participants: 1