1. #1
    Sencha User
    Join Date
    Dec 2011
    Posts
    2
    Vote Rating
    0
    GoodNewsDesign is on a distinguished road

      0  

    Default Unanswered: Form rendering

    Unanswered: Form rendering


    I am having a bit of trouble coming up to speed. I started writing an app by hand so switching over to the SDK is out at this point.
    I have written a bunch of screens to render as cards. Problem happened when I realized I was going to have to write my forms as Sencha objects. Some of my code is below. Form input labels do not render. Also, if I take add layout: 'form', to the form card item, it produces an error. Help is greatly appreciated.

    var Clickbid = new Ext.Application({
    // Ext.require([ 'Ext.form.*']);
    name:'ClickBid',
    useLoadMask : true,
    launch:function(){
    Clickbid.views.login = new Ext.form.FormPanel({
    xtype: 'container',
    //layout:'form',
    labelWidth: 75,
    frame: true,
    waitMsgTarget: true,
    monitorValid: true,
    items: [
    { html:'<div>'+
    '<div class="center"My Organizationā€˜s Name or Affiliation</div>'+
    '<div class="center">'+big_logo+'</div>'+
    '</div>'+
    '<div class="main">'+
    '<div class="pad centered two-seventeen">'
    },
    {
    fieldLabel: 'Bidder Number',
    xtype: 'textfield',
    cls: 'gray',
    layout: 'form',
    name: 'bid',
    anchor:'100%' // anchor width by percentage
    },
    {
    xtype: 'textfield',
    fieldLabel: 'Password',
    name: 'pwd',
    cls: 'gray',
    layout: 'form',
    anchor: '100%' // anchor width by percentage
    },

    {
    xtype: 'field',
    autoCreate: {
    tag: 'input',
    type: 'image',
    src: 'lib/btns/login.png',
    //alt: 'Login',
    //size: '61,26'
    },
    name: 'login',
    layout: 'form',
    id: 'login',
    value: 'login',
    listeners: {
    click: function(){
    //get_data(1);
    }
    }
    },

    {html:'<div class="vpad">'+
    '<a class="lpad aside absm" href="/forgot" rel="8" title="Forgot?">'+
    'I Forgot. Help!</a>'+
    '</div>'+
    '<div class="vpad">'+
    '<a href="#" title="Register">'+
    '<img src="lib/btns/register.png" alt="Register">'+
    '<span class="lpad aside absm">Get a bidder number.</span>'+
    '</div>'+
    '<div class="vpad">'+
    '<a href="preview" title="Preview" rel="2">'+
    '<img src="lib/btns/preview.png" alt="Preview"/>'+
    '</a><span class="lpad aside absm">a list of our items.</span>'+
    '</div>'+
    '</div>'+
    '</div>'}
    ]
    });
    /*
    a bunch of other new Ext.form.FormPanels...
    */
    Clickbid.views.viewport = new Ext.Panel({
    layout : 'card',
    fullscreen : true,
    cardAnimation : 'slide',
    items: [
    Clickbid.views.index,
    Clickbid.views.login,
    Clickbid.views.list,
    Clickbid.views.cnfrm,
    Clickbid.views.history,
    Clickbid.views.checkout,
    Clickbid.views.details,
    Clickbid.views.logout,
    Clickbid.views.forgot

    ],
    listeners:
    {
    afterrender: function(card){
    if(uid===0){ this.setActiveItem(1); }
    card.body.on('click', function(e, t){
    if( a = e.getTarget("a", 2) ) {
    var page = e.getTarget("a").rel;
    var target = e.getTarget("a").href;
    if (page!=='undefined'){
    var i = parseInt(page);
    Clickbid.views.viewport.setActiveItem(i);
    get_data(i);
    e.stopEvent();
    }
    }
    })
    }
    }

    });
    }
    });

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,330
    Answers
    3541
    Vote Rating
    846
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Are you sandboxing Ext JS 3 and Ext JS 4?
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Dec 2011
    Posts
    2
    Vote Rating
    0
    GoodNewsDesign is on a distinguished road

      0  

    Default Sandbox...

    Sandbox...


    Just serving the app from localhost and using Web browser and emulator. Trying to open the index file in the IDE in 3.3 0r 4 yields the following: However, I have dropped out my data script so I have no idea what JSON is being referred to unless it is the actual JavaScript object notation???

    You're trying to decode an invalid JSON String:
    Source Class: Ext.JSON
    Source Method: decode


    Too bad there are no file attachments here so that I could send you a nicely formatted code file...

Thread Participants: 1

Tags for this Thread