Results 1 to 3 of 3

Thread: Reusable Form Layout

  1. #1
    Sencha User
    Join Date
    Dec 2007
    Location
    Grand Rapids, MI
    Posts
    13
    Vote Rating
    0
      0  

    Default Answered: Reusable Form Layout

    Hi, I would like to know the best practice for defining a form layout that I can reuse in different views but with different field names. So I would have a base layout such as:

    Code:
    Ext.define('App.view.CommonForm', {
      extend: 'Ext.form.Panel'
      ,xtype: 'commonform'
      ,config: {
        title: title
        ,defaults: {
          xtype: 'textfield'
          ,layout: 'hbox'
        }
        ,items: [
          {
            label: label1
            ,name: name1
            ,flex: 2
          }
          ,{
            label: label2
            ,name: name2
            ,flex: 1
          }
        ]
      }
    });
    Imagine, however, that the layout is actually something more complicated than above.

    And then in some view, I could (pseudo code):
    Code:
    ...
    items: [
      {
        xtype: 'commonform'
        ,title: 'Baz'
        ,fields: [
          {label1: 'Foo', name1: 'foo'}
          ,{label2: 'Bar', name2: 'bar'}
        ]
      }
    ]
    This example is rather rigid with a fixed number of fields, but hopefully you get the idea. I've looked at some of the examples like "Touch Tweets", but I'm not sure that's what I'm looking for. Ideally I'd like to be able to define a component template that uses components, similar to how XTemplate uses html.

    Thanks,
    Paul

  2. In your App.view.CommonForm class you can use the applyItems to add the fields array to the items array and return that array.

  3. #2
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,556
    Answers
    3931
    Vote Rating
    1272
      0  

    Default

    In your App.view.CommonForm class you can use the applyItems to add the fields array to the items array and return that array.
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it! Checkout the CODE tag!

    Check out my GitHub, lots of nice things for Ext JS and Sencha Touch
    https://github.com/mitchellsimoens

  4. #3
    Sencha User
    Join Date
    Dec 2007
    Location
    Grand Rapids, MI
    Posts
    13
    Vote Rating
    0
      0  

    Default

    Thanks!

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •