Results 1 to 6 of 6

Thread: backspace and arrows keys are not on input textbox

  1. #1
    Sencha User
    Join Date
    Mar 2012
    Posts
    25

    Default backspace and arrows keys are not on input textbox

    Hi,

    I have this issue when i put a textbox in a panel. and here is the code:

    Code:
     var cw = Ext.create('Ext.Viewport', {
            layout: {
                type: 'border'
            },
     .......
    
    ,{
                region: 'center',
                layout: 'border',
                border: false,
                items: [{
                    region: 'center',
                    autoScroll:true,
                    minWidth: 500,
                    title: '<img width="20" height="18" style="vertical-align:middle;" src="images/images-design/icon-folder.png">&nbsp;Folder Contents',
                    dockedItems: [{
                        xtype: 'toolbar',
                        dock: 'top',
                        items: [{xtype: 'panel', id: 'topMenu',border:false,bodyStyle:{'background-color': '#FFF'},width:'100%',height: topMenuHeight}]
                    }]
                },
    and in the panel "topMenu" code:

    Code:
    function writeFolderContentsHeader(){
                
            var browsedoc_header =     '<div style="height:30px;padding-top:5px;width: 100%;">'+
                                         '<div style="float: left; padding: 5px;">'+
                                            'Items found:&nbsp;<span id="resultSizeLabel"></span>&nbsp;'+
                                        '</div>'+
                                        '<div style="float: right; margin-right: 10px;">'+
                                            '<table >'+
                        ......
    
    '<td>'+
                                                        '<input type="text" style="border:1px solid #FFFFFF;width:20px;" id="gotoPageMark" value="" disabled="true"/>&nbsp;of&nbsp;'+
                                                    '</td>'+
    
    ..................
    
    return  browsedoc_header;
    Code:
    $('#topMenu').html(writeMenu()+writeFolderContentsHeader()+writeTableColumnHeader());
    The input text that id of "gotoPageMark", for no apparent reason the backspace key is not functioning but the rest is ok. How can I make it work the backspace?

    Cheers.
    Eman

  2. #2
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,448
    Answers
    3997

    Default

    Are you mixing Ext JS and jQuery together? If so, why?
    Mitchell Simoens @LikelyMitch

    Check out my GitHub:
    https://github.com/mitchellsimoens

    Posts are my own, not any current, past or future employer's.

  3. #3
    Sencha User
    Join Date
    Mar 2012
    Posts
    25

    Default

    Yes, Im using Ext JS and JQuery together, because we have special layouting requirement in our main page, which the resizable pane. I cannot find any good implementation in JQuery that suit our needs as ExtJS does(Viewport and etc...).

    Is there any issues mixing the JQuery and ExtJS together? If so, how can I solve my issue?

    Cheers.

  4. #4
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,448
    Answers
    3997

    Default

    You are making the client download two frameworks and jQuery usually isn't needed for what Ext JS can do. When I see it happen, 100% of the time is because someone is familiar with jQuery and they don't want to or don't have the time to actually learn Ext JS but they need to use Ext JS.
    Mitchell Simoens @LikelyMitch

    Check out my GitHub:
    https://github.com/mitchellsimoens

    Posts are my own, not any current, past or future employer's.

  5. #5
    Sencha User
    Join Date
    Mar 2012
    Posts
    25

    Default

    Most of my teammates knows jQuery and the app is already built using jQuery.
    When I see it happen, 100% of the time is because someone is familiar with jQuery and they don't want to or don't have the time to actually learn Ext JS but they need to use Ext JS.
    - I agree to this, because there is no time to train/learn Ext JS.

    Btw, how can I solve my issue on backspace? I already try .innerHTML and still wont work. There is no error message thrown in firebug.

    cheers.

  6. #6
    Sencha User
    Join Date
    Mar 2012
    Posts
    25

    Default

    I try some extjs domquery to insertHtml:

    Code:
    Ext.get('topMenu').insertHtml('afterEnd',writeMenu()+writeFolderContentsHeader()+writeTableColumnHeader());
    but when rendered, the input and select textbox is not anymore clickable and also in IE it htrows an error saying it has extra ')'?

    any idea on how to resolve this?

    cheers.

Tags for this Thread

Posting Permissions

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