Results 1 to 9 of 9

Thread: Renderer in panel

  1. #1

    Default Answered: Renderer in panel

    Hi all,
    with grid I can change displayed value in field using function below :

    renderer
    : Function

    A renderer is an 'interceptor' method which can be used transform data (value, appearance, etc.) before it is rendered. Example:

    { renderer: function(value){ if (value === 1) { return '1 person'; } return value + ' people'; }}
    What is the same thing in Ext.form.Panel textfield ?

    Thanks in advance

    Mauro

  2. setRawValue doesn't fire events. I just saw this, but you may be interested in overriding the valueToRaw method instead. See https://docs.sencha.com/extjs/6.0/6....hod-valueToRaw

    It seems more appropriate for your situation.

  3. #2
    Sencha User alex.volfson's Avatar
    Join Date
    Jan 2016
    Posts
    462
    Answers
    60

    Default

    What are you trying to accomplish with textfield?

  4. #3

    Default

    Quote Originally Posted by alex.volfson View Post
    What are you trying to accomplish with textfield?
    Changing the displayed value of textfield.
    For example something like this :

    Code:
    val = timestampnow;
    newValToDisplay = Ext.Date.format(new Date(val*1000), 'Y-m-d');
    or

    if value of textfield is 'FA' i will be displayed as 'Fax' and so on...

    Thanks

  5. #4
    Sencha User alex.volfson's Avatar
    Join Date
    Jan 2016
    Posts
    462
    Answers
    60

    Default

    You could try using the change event or override the setValue method.

  6. #5

    Default

    Using setValue in change event fire a new change event.
    Code:
                              listeners:{
    
                                change: function(field, newValue, oldValue) {
                                  if (newValue != null) {
                                    if (oldValue = "FA")
                                      newValue = "Fax";
                                    else if (oldValue = "ML")
                                      newValue = "Email"
    
                                    field.setValue(newValue);
                                  }
                                },
    There is no other way like grid renderer... is so simple and do not fire change event twice.

    Thanks

  7. #6
    Sencha User alex.volfson's Avatar
    Join Date
    Jan 2016
    Posts
    462
    Answers
    60

    Default

    Would it not make more sense to use a combobox instead? Set the keys to your abbreviations.

  8. #7

    Default

    Quote Originally Posted by alex.volfson View Post
    Would it not make more sense to use a combobox instead? Set the keys to your abbreviations.
    I give it a try, but I don't like to have a combo with all textbox around.

    In another field I have convert a timestamp value to a date like below:

    Code:
         oldValue = mycurrenttimestamp;
         change: function(field, newValue, oldValue) {
              if (newValue != 0) {
                   newValue = Ext.Date.format(new Date(newValue*1000), 'Y-m-d H:i:s')
                   field.setValue(newValue);
              }
         }
    The change event is fired always twice... or have you another trick ?

    Thanks
    Mauro

  9. #8
    Sencha User alex.volfson's Avatar
    Join Date
    Jan 2016
    Posts
    462
    Answers
    60

    Default

    setRawValue doesn't fire events. I just saw this, but you may be interested in overriding the valueToRaw method instead. See https://docs.sencha.com/extjs/6.0/6....hod-valueToRaw

    It seems more appropriate for your situation.

  10. #9

    Default

    ok.
    thanks for help

Similar Threads

  1. Tree Panel with renderer
    By riku351 in forum Ext: Q&A
    Replies: 3
    Last Post: 28 Oct 2012, 6:25 AM
  2. Panel as Grid Cell Renderer?
    By stephenliberty in forum Ext 3.x: Help & Discussion
    Replies: 2
    Last Post: 30 Jan 2010, 12:32 PM

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
  •