Wijmo [wordWrap]=true is not working if using ng-templete inside wj-flex-grid

Wijmo [wordWrap]=true is not working if using ng-templete inside wj-flex-grid

Posted by: nilesh_nichal on 3 May 2023, 7:06 am EST

• 

  nilesh_nichal

  • Post Options:
  • Link
    Copy

  Posted 3 May 2023, 7:06 am EST

  Hi Wijmo team,

  I have refer this link - https://www.grapecity.com/wijmo/demos/Grid/Sizing/Auto-sizeRows/angular
  
  In the referred link there is basic example on how to resizes rows to fit their content.
  
  I have set autoRowHeights property to true and wordWrap = true
  
  In our use case we are using ng-templete, for example below code:

  <wj-flex-grid #flexGrid
  
  [autoRowHeights]=“true”
  
  [autoGenerateColumns]=“false”
  
  [itemsSource]=“data”>

  <wj-flex-grid-column [binding]="'countries'"
                       [header]="'Countries'"
                       [width]="'9*'"
                       [wordWrap]=true>
    <ng-template wjFlexGridCellTemplate>
      *************//***********
    </ng-template>
  
    <ng-template wjFlexGridCellTemplate
                 [cellType]="'CellEdit'"
                 let-cell="cell">
      <div class="edit-mode ">
        <input type="text" />
      </div>
    </ng-template>
  </wj-flex-grid-column>
  

  <wj-flex-grid-column [binding]=“‘sales’” [header]=“‘Sales’”>
  
  <wj-flex-grid-column [binding]=“‘expenses’” [header]=“‘Expenses’”>
  
  

  So, for the second ng-template in the above example where we are using input type as text, I want to edit the input and accordingly it will resize rows to fit their content in the cell/table but writing above code is not working please let us know how to proceed.
  
  I am using wijmo version of 5.20193.637

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 4 May 2023, 3:58 pm EST

  Hi,
  
  As per our investigation, there was some issue in version 5.20193.637 which was then addressed in later releases. As per your case and version, if the editor is added using wjFlexGridCellTemplate then, there may sometimes arise problems while editing the cell. So, as a workaround, we have to manually add an editor using the formatItem event and then we have to commit edited data to the data source.
  
  Please refer to this sample for reference: https://stackblitz.com/edit/angular-caqofn
  
  However, for the latest version (5.20222.877), there is no need to provide any workaround and only a small modification is required in the cell template.

   <ng-template wjFlexGridCellTemplate [cellType]="'CellEdit'" let-cell="cell">
        <div class="edit-mode">
          <input
            type="text"
            [value]="cell.value"
            (focusout)="editedCell($event, cell)"
          />
        </div>
      </ng-template>

  Since, the HTML input element is used as an editor so, we need to bind the cell’s value to the value property of input element. Also, when the data is entered and focus is removed then we need to manually update the value of the cell.

  editedCell(e, cellInfo) {
      cellInfo.value = e.target.value;
    }

  Also, if in place of element, if we use combobox as a textbox like,

   <wj-combo-box [(text)]="cell.value"></wj-combo-box> 

  then there will be no need of manually changing the data.
  
  Please refer to this sample for reference: https://stackblitz.com/edit/angular-marwnb

  Regards,
  
  Manish Gupta

• 

  nilesh_nichal

  • Post Options:
  • Link
    Copy

  Posted 9 May 2023, 12:32 am EST - Updated 9 May 2023, 12:37 am EST

  Hi Team,

  We are using 5.20193.637 wijmo version(and have valid license for version 5.20193.637) and if I want to update it to current version i.e. 5.20222.877, but after updating to latest version we are getting the below error message of "The Wijmo license in the application is not valid for the version in use. The license version is 5.20193 ; the product version is 5.20222.877. Please create a license or contact Grapecity."*
  
  I have also attached the screenshot for the same

  

  1920×1080 266 KB

  Please let us know the steps or process so that we can update wijmo current version to 5.20222.877.

  Thanks

• 

  sonu.pandey

  

  • Post Options:
  • Link
    Copy

  Posted 9 May 2023, 1:58 am EST

  Hello,

  Your license doesn’t have a subscription for the latest Wijmo build, which results in this license issue. You would be required to purchase a new license key for the latest build(5.20222.877). Then after registering the key on your account, you can generate a distribution key of the latest build for your application.

  To purchase a new license you can contact our sales team from the below contact details, you can ask any license-related queries there:

  Tel: 1.800.858.2739 | 412.681.4343
  
  E-mail: us.sales@grapecity.com

  Regards

• 

  sonu.pandey

  

  • Post Options:
  • Link
    Copy

  Posted 9 May 2023, 8:32 am EST

  Hi Nilesh,

  It appears that you accidentally shared your account’s confidential license information on this forum ticket. To protect your privacy, I have removed that response from this post and created a new case under your account. You can access it by logging into your Grapecity account and going to “My Support” > “My Cases.” Please feel free to continue sharing your concerns there, as our support team will keep them confidential.

  In case you have any doubts then please let us know.

  Regards