Page 1 of 2 12 LastLast
Results 1 to 10 of 12

Thread: How to add a tip for multiselect

  1. #1
    Sencha User
    Join Date
    Apr 2010
    Posts
    26
    Vote Rating
    0
      0  

    Question How to add a tip for multiselect

    Hi everybody

    Does anyone know how to add a tip for multiselect?

    like this:
    cc.jpg
    Thank you very much.
    http://www.extjs.com/deploy/dev/exam...lect-demo.html

  2. #2
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,615
    Vote Rating
    54
      0  

    Default

    IIRC, that's a DataView isn't it? Use a DataTip

  3. #3
    Sencha User
    Join Date
    Apr 2010
    Posts
    26
    Vote Rating
    0
      0  

    Question something wrong....

    thanks for your job,but there is something wrong in my project.
    look down pictures:
    1.jpg

    2.jpg

    it looks can't get data...and if data is null it always have tip...

  4. #4
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,615
    Vote Rating
    54
      0  

    Default

    There should not be elements in the DataView which are "null". Check your Store.

    It gets the data for its template from the Record. You have to give it a template just like your DataView.

  5. #5
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    119
      0  

    Default

    Another solution would be to configure your combobox with:
    Code:
    tpl: new Ext.XTemplate(
      '<tpl for="."><div class="x-combo-list-item"',
      '<tpl if="myTipField"> ext:qtip="{myTipField:htmlEncode}"</tpl>',
      '>{myDisplayField:htmlEncode}</div></tpl>'
    )
    (replace red field names with your own field names)

  6. #6
    Sencha User
    Join Date
    Apr 2010
    Posts
    26
    Vote Rating
    0
      0  

    Default

    er...thx condor ,but not combox ,just like combox's effects. i want to implement it in the multiselect
    this is
    http://www.extjs.com/deploy/dev/exam...lect-demo.html
    3.jpg

  7. #7
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,615
    Vote Rating
    54
      0  

    Default

    OK, it needed a tweak.

    Latest DataTip code is in post #1 of the DataTip thread.

    Plus, you must init the plugin on the MultiSelect's view, not the MultiSelect itself, so configure your MultiSelect with

    Code:
                listeners: {
                    render: function(ms) {
                        new Ext.ux.DataTip({
                            tpl: 'Number: {text}'
                        }).init(ms.view);
                    }
                },

  8. #8
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,615
    Vote Rating
    54
      0  

    Default

    OK, it needed a tweak.

    Latest DataTip code is in post #1 of the DataTip thread.

    Plus, you must init the plugin on the MultiSelect's view, not the MultiSelect itself, so configure your MultiSelect with

    Code:
                listeners: {
                    render: function(ms) {
                        new Ext.ux.DataTip({
                            tpl: 'Number: {text}'
                        }).init(ms.view);
                    }
                },

  9. #9
    Sencha User
    Join Date
    Apr 2010
    Posts
    26
    Vote Rating
    0
      0  

    Question

    I really do not know where my code is wrong...

    Code:
    *Ext JS Library 3.0.0
     * Copyright(c) 2006-2010 Ext JS, Inc.
     * licensing@extjs.com
     * http://www.extjs.com/license
     */
    Ext.onReady(function(){
        Ext.QuickTips.init();
        Ext.form.Field.prototype.msgTarget = 'side';
        /*
         * Ext.ux.form.MultiSelect Example Code
         */
        var msForm = new Ext.form.FormPanel({
            title: 'MultiSelect Test',
            width: 700,        
            renderTo: 'multiselect',
            items:[{
                xtype: 'multiselect',
                fieldLabel: 'Multiselect<br />(Required)',
                name: 'multiselect',
                width: 250,
                height: 200,
                allowBlank:false,
                store: [[123,'One Hundred Twenty Three'],
                        ['1', 'One'], ['2', 'Two'], ['3', 'Three'], ['4', 'Four'], ['5', 'Five']],
    //            tbar:[{
    //                text: 'clear',
    //                handler: function(){
    //                 msForm.getForm().findField('multiselect').reset();
    //             }
    //            }],
    //                  listeners: {
    //                  render: function(ms) {
    //                      new Ext.ux.DataTip({
    //                          tpl: 'Number: {text}'
    //                      }).init(ms.view);
    //                  }
    //              },
                plugins: new Ext.ux.DataTip({
                    tpl: '<div class="x-combo-list-item">xxxx</div>'
                }),
       
                ddReorder: true
            }],
            tbar:[{
                text: 'Options',
                menu: [{
                 text: 'Set Value (2,3)',
                 handler: function(){
                     msForm.getForm().findField('multiselect').setValue('2,3');
                 }
             },{
                 text: 'Toggle Enabled',
                 handler: function(){
                     var m = msForm.getForm().findField('multiselect');
                     if (!m.disabled) {
                         m.disable();
                     } else {
                         m.enable();
                     }
                 }
                }]
            }],
            buttons: [{
                text: 'Save',
                handler: function(){
                    if(msForm.getForm().isValid()){
                     Ext.Msg.alert('Submitted Values', 'The following will be sent to the server: <br />'+
                         msForm.getForm().getValues(true));
                    }
                }
            }]
        });
    4.gif

  10. #10
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,615
    Vote Rating
    54
      0  

    Default

    You don;t know? You've commented out the correct bit and left in the incorrect bit!

Page 1 of 2 12 LastLast

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
  •