1. #1
    Sencha User
    Join Date
    Jul 2012
    Posts
    12
    Vote Rating
    0
    Himansu is on a distinguished road

      0  

    Default Breaking of comboBox runtime in extjs4

    Breaking of comboBox runtime in extjs4


    Hi,

    I have a problem with comboBox that it is breaking half in runtime which i have explained in the above attachment.

    Thanks in advance.
    Attached Images

  2. #2
    Sencha - Community Support Team sword-it's Avatar
    Join Date
    May 2012
    Location
    Istanbul
    Posts
    1,332
    Vote Rating
    83
    sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough

      0  

    Default


    Hi,

    may you provide your code for better understanding the problem
    sword-it.com, Sencha Developer House in Turkey - Istanbul University Technopark Suite 204.

  3. #3
    Sencha User
    Join Date
    Jul 2012
    Posts
    12
    Vote Rating
    0
    Himansu is on a distinguished road

      0  

    Default Breaking of comboBox runtime in extjs4

    Breaking of comboBox runtime in extjs4


    This is my code:

    {


    xtype: 'combobox',
    margin: '20 0 0 100',
    fieldLabel: 'Related to',
    labelAlign: 'right',


    },
    {


    xtype: 'combobox',
    margin: '20 0 0 100',
    fieldLabel: 'Name',
    labelAlign: 'right'
    }

  4. #4
    Sencha - Community Support Team sword-it's Avatar
    Join Date
    May 2012
    Location
    Istanbul
    Posts
    1,332
    Vote Rating
    83
    sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough

      0  

    Default


    Hi,

    you code is working fine for me try following code:

    Code:
    .Ext.create('Ext.form.Panel', {
        title: 'Simple Form',
        bodyPadding: 5,
        
        items: [
         {
             xtype: 'combobox',
                margin: '20 0 0 100',
                fieldLabel: 'Related to',
                labelAlign: 'right',
            },
            {
             xtype: 'combobox',
                margin: '20 0 0 100',
                fieldLabel: 'Name',
                labelAlign: 'right'
            }
        ],
        renderTo: Ext.getBody()
    });
    sword-it.com, Sencha Developer House in Turkey - Istanbul University Technopark Suite 204.

  5. #5
    Sencha User
    Join Date
    Jul 2012
    Posts
    12
    Vote Rating
    0
    Himansu is on a distinguished road

      0  

    Default Breaking of comboBox runtime in extjs4

    Breaking of comboBox runtime in extjs4


    this code is working fine in design but runtime it is not working breaking combo box .

    {


    xtype: 'combobox',
    margin: '20 0 0 100',
    fieldLabel: 'Related to',
    labelAlign: 'right',


    },
    {


    xtype: 'combobox',
    margin: '20 0 0 100',
    fieldLabel: 'Name',
    labelAlign: 'right'
    }
    Attached Images

  6. #6
    Sencha User
    Join Date
    Jul 2012
    Posts
    12
    Vote Rating
    0
    Himansu is on a distinguished road

      0  

    Default Breaking ComboBox in extjs4

    Breaking ComboBox in extjs4


    Hi All,

    I have created ComboBox in extjs4 sencha tool.When I placing the code from sencha to asp.net mvc3 the comboBox is breaking at the endpoint.The code as follows and Iam attaching screenshot also.

    My Code:


    Ext.define('User', {


    extend: 'Ext.data.Model',
    fields: [
    { name: 'AllDayEvent', mapping: 'AllDayEvent' },
    { name: 'AssignedTo' },


    ]


    });


    var userStore = Ext.create('Ext.data.Store', {
    model: 'User',
    proxy: {
    type: 'ajax',
    url: '/Calendar/GetTasks',
    reader: {
    type: 'json',
    root: 'd'
    }
    },
    autoLoad: false
    });


    userStore.load();




    Ext.ns('CreateTask');
    //Ext.BLANK_IMAGE_URL = '../ext/resources/images/default/s.gif';
    CreateTask.FormTutorial = {


    init: function () {


    //Begin of code here


    Ext.QuickTips.init();


    var form = new Ext.FormPanel({


    title: 'Create Task Form',


    renderTo: 'CreateTask',


    width: 1100,


    //height: 1000,
    collapsible: true,


    // url: '/Employee/UpdateEmployee',


    defaults: { xtype: 'textfield' },


    bodyStyle: 'padding: 10px',


    items: [
    {
    xtype: 'container',
    //height: 55,
    width: 1150,
    layout: {
    type: 'column'
    },
    items: [
    {
    xtype: 'image',
    height: 48,
    width: 34,


    src: '/Images/AlliHome.png'
    },
    {
    xtype: 'label',
    text: 'Task'
    },
    {
    xtype: 'label',
    margin: '17 0 0 -25',
    style: '.x-body {\n font-family: Tahoma;\n font-size: 20px;\n color: #333;\n}',
    text: 'New Task'
    }
    ]
    },
    {
    xtype: 'container',
    border: '3 0 0 0',
    frame: false,
    height: 38,
    margin: '-2 0 0 -10',
    style: '.x-body {\n p\n{\nborder-width:2px;\n\nborder-top-styleolid;\nborder-right-style:null;\nborder-bottom-style:null;\nborder-left-style:null;\n}\n\n}',
    width: 1150,
    maintainFlex: false,
    layout: {
    type: 'column'
    },
    items: [
    {
    xtype: 'label',
    margin: '10 0 0 10 ',
    style: '.x-body {\n font-family: Tahoma;\n font-size: 14px;\n color: #333;\n\n}',
    text: 'Task Edit'
    },
    {
    xtype: 'button',
    margin: '10 5 0 700',
    text: 'Save'
    },
    {
    xtype: 'button',
    margin: '10 5 0 0',
    text: 'Save & New Task'
    },
    {
    xtype: 'button',
    margin: '10 5 0 0',
    text: 'Save & New Event'
    },
    {
    xtype: 'button',
    margin: '10 0 0 0',
    text: 'Cancel'
    }
    ]
    },
    {
    xtype: 'panel',
    height: 270,
    margin: '0 0 0 -10',
    width: 1150,
    layout: {
    type: 'column'
    },
    collapsible: true,
    title: 'Task Information',
    items: [
    {
    xtype: 'textfield',
    margin: '10 0 0 100',
    fieldLabel: 'Assigned To',
    allowBlank: false,
    blankText: 'Please Enter Text',
    labelAlign: 'right',
    dataindex: 'AssignedTo'
    },
    {
    xtype: 'textfield',
    margin: '50 0 0 -267',
    fieldLabel: 'Subject',
    allowBlank: false,
    blankText: 'Please Enter Text',
    labelAlign: 'right',
    dataindex: 'Subject'
    },
    {
    xtype: 'textfield',
    margin: '90 0 0 -267',
    fieldLabel: 'Due Date',
    allowBlank: false,
    blankText: 'Please Enter Date',
    labelAlign: 'right'
    },
    {
    xtype: 'textfield',
    height: 100,
    margin: '130 0 0 -266',
    width: 450,

    fieldLabel: 'Comments',
    labelAlign: 'right',
    labelWidth: 110

    },
    {


    xtype: 'combobox',
    margin: '20 0 0 100',
    fieldLabel: 'Related to',
    labelAlign: 'right',


    },
    {


    xtype: 'combobox',
    margin: '20 0 0 100',
    fieldLabel: 'Name',
    labelAlign: 'right'
    }
    ]
    },
    {
    xtype: 'panel',
    height: 160,
    margin: '0 0 0 -10',
    width: 1150,
    layout: {
    type: 'column'
    },
    closable: false,
    collapseFirst: false,
    collapsed: false,
    collapsible: true,
    title: 'Additional Information',
    titleCollapse: false,
    items: [
    {

    xtype: 'combobox',
    margin: '20 0 0 100',
    fieldLabel: 'Status',
    labelAlign: 'right'
    },
    {
    xtype: 'combobox',
    margin: '50 0 0 -277',
    fieldLabel: 'Priority',
    labelAlign: 'right'
    },
    {
    xtype: 'checkboxfield',
    margin: '100 0 0 -275',
    fieldLabel: '',
    boxLabel: 'Send Notification Email'
    },
    {
    xtype: 'textfield',
    margin: '20 0 0 45',
    fieldLabel: 'Phone',
    regex:'/^\(?(\d{3})\)?[- ]?(\d{3})[- ]?(\d{4})$/',
    allowBlank: false,
    blankText: 'Please Enter Phonenumber',
    labelAlign: 'right'
    },
    {
    xtype: 'textfield',
    margin: '50 0 0 -267',
    fieldLabel: 'Email',
    regex: '/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/',
    allowBlank: false,
    blankText: 'Please Enter Date',
    labelAlign: 'right'
    }
    ]
    },
    {
    xtype: 'panel',
    height: 88,
    margin: '0 0 0 -10',
    width: 1150,
    collapseFirst: false,
    collapsible: true,
    title: 'Recurrence',
    items: [
    {
    xtype: 'checkboxfield',
    margin: '10 0 0 100',
    fieldLabel: '',
    boxLabel: 'Create Recurring Series of Tasks'
    }
    ]
    },
    {
    xtype: 'panel',
    height: 82,
    margin: '0 0 0 -10',
    width: 1150,
    layout: {
    type: 'column'
    },
    collapseFirst: false,
    collapsible: true,
    title: 'Reminder',
    items: [
    {
    xtype: 'label',
    margin: '25 0 0 100',
    text: 'Reminder'
    },
    {
    xtype: 'checkboxfield',
    margin: '20 0 0 15',
    fieldLabel: '',
    boxLabel: ''
    },
    {
    xtype: 'textfield',
    margin: '17 0 0 5',
    width: 77,
    fieldLabel: ''
    },
    {
    xtype: 'combobox',
    margin: '10 0 0 5',
    width: 120,
    fieldLabel: ''
    }
    ]
    },
    {
    xtype: 'panel',
    height: 20,
    margin: '0 0 0 -10',
    width: 1150,
    layout: {
    type: 'column'
    },
    collapseFirst: false,
    collapsible: true,
    title: 'Attachment',
    items: [
    {
    xtype: 'button',
    margin: '20 0 0 100',
    width: 64,
    text: 'Attach'
    },
    {
    xtype: 'gridpanel',
    width: 1000,
    height:150,
    margin: '50 0 0 -70',
    frameHeader: true,
    overlapHeader: false,
    title: 'My Grid Panel',
    titleCollapse: false,
    width: 900,
    hideHeaders: false,
    columns: [
    {
    xtype: 'gridcolumn',
    dataIndex: 'string',
    text: 'String'
    },
    {
    xtype: 'numbercolumn',
    dataIndex: 'number',
    text: 'Number'
    },
    {
    xtype: 'datecolumn',
    dataIndex: 'date',
    text: 'Date'
    },
    {
    xtype: 'booleancolumn',
    dataIndex: 'bool',
    text: 'Boolean'
    }
    ],
    viewConfig: {


    }
    }
    ]
    },
    {
    xtype: 'container',
    height: 30,
    margin: '0 0 0 -10',
    width: 1150,
    layout: {
    type: 'column'
    },
    items: [
    {
    xtype: 'button',
    margin: '5 5 0 770',
    text: 'Save'
    },
    {
    xtype: 'button',
    margin: '5 5 0 0 ',
    text: 'Save & New Task'
    },
    {
    xtype: 'button',
    margin: '5 5 0 0 ',
    text: 'Save & New Event'
    },
    {
    xtype: 'button',
    margin: '5 0 0 0 ',
    text: 'Cancel'
    }
    ]
    }
    ]
    });
    }


    }
    Ext.onReady(CreateTask.FormTutorial.init, CreateTask.FormTutorial);
    Attached Images

  7. #7
    Sencha Premium Member danguba's Avatar
    Join Date
    Feb 2009
    Location
    Kragujevac, Serbia
    Posts
    364
    Vote Rating
    3
    danguba is on a distinguished road

      0  

    Default


    Maybe some of your CSS rules are messing things up. Try using only extjs CSS and see if it will make any difference
    All Best
    ---
    Željko Mitrović
    http://skitanja.blogspot.com/

    "Always code as if the guy who ends up maintaining your code will be a violent psychopath who knows where you live." Martin Golding

  8. #8
    Ext JS Premium Member
    Join Date
    Jun 2010
    Posts
    100
    Vote Rating
    10
    h.wagner@telekom.de will become famous soon enough

      0  

    Default


    Quote Originally Posted by Himansu View Post
    Hi,

    I have a problem with comboBox that it is breaking half in runtime which i have explained in the above attachment.

    Thanks in advance.
    We had a similar problem during migration to Ext 4. This looks to me like you are overriding the default TD styles with margin 2px or something similar (many (reset) css frameworks seem to do this too).

    For some strange reason Sencha decided for ExtJS 4.1.x the combobox parts to be rendered in adjacent table cells, thus your problem.

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar