[Paul45Participant]

Hello, Sorry for this mistake..
this is the right link:
https://stackblitz.com/edit/github-49kpvh

the problem is that I need to call my grid from AppComponent when i click on button REFRESH

[Paul45Participant]

Ok, it works but.. I need to tell at my input what kind of it is (Integer or Float)…
And for that, i need to give a value at my template which can tell me what kind of it is..

Because sometimes it’s a float, and other time an int.. Only a value in my template can tell me when I need to apply my approach for modifying the field or not

I need a field on my template like that :

      {
        bind: 'nubmberBoxValue',
        name: 'nubmberBoxValue',
        type: 'number',
        infoType:'integer',
        label: 'Number input',
        labelPosition: 'left',
        labelWidth: '30%',
        align: 'left',
        width: '250px',
        required: true
      },

And after I can check if infoType is an integer or a float.. If it’s a float I can realize your approach

Do you understand my case?…

[Paul45Participant]

I have Edit my stackblitz to show you :

https://stackblitz.com/edit/github-wzadlj

When i modify my Input Number it doesn’t work…

Sorry for 4 messages but I can’t edit…

Do you understand what I want?
Just a form with an inputNumber which is an integer ..
It’s very complexe to make that I don’t understand why

[Paul45Participant]

I have found a solution… But after iitialization..

In my template type is integer.
And initialized, I loop on my form where type == integer And after I get the component by the name :

var inputValue = form.getComponentByName('puissance')
inputValue.jqxNumberInput({decimalDigits:0, groupSeparator: " ",promptChar:""}) 

But now, my function OnDataChange for the form doesn’t work… Why ?

Thanks a lot

[Paul45Participant]

IS it only possible with getComponentByName and not a the creation of form?
Because it’s more simple at the creation… Because I know if it’s a float or integer only at the initialization…

[Paul45Participant]

it works perfectly !
Thanks a lot for your help
Have a good day !

[Paul45Participant]

i m so sorry, i have sent the wrong stackblitz…

I resolved my problem with appendTo:’body’
But now i have an other problem…

When i want to drag and drop a cell of my grid, this grey column is displayed. an i need to refresh to hide it

HTML :

<div id="main" class= "main">
    <div class ="target">
            <jqxGrid #myGridPosition 
                [width]="510" [autoheight]="true" [columns]="gridColumns" [source]="source" [rowsheight] ="137" [rendered]='rendered'
                [selectionmode]="'singlecell'" [keyboardnavigation]="false" >
            </jqxGrid>

    </div>
</div>

TS :

import { Component, OnInit,ViewChild } from '@angular/core';
import { CompositionComponent } from '../composition.component';
import { jqxGridComponent } from 'jqwidgets-scripts/jqwidgets-ts/angular_jqxgrid';

@Component({
  providers:[CompositionComponent],
  selector: 'app-form-attributes',
  templateUrl: './form-attributes.component.html',
  styleUrls: ['./form-attributes.component.scss']
})
export class FormAttributesComponent {
  @ViewChild('myGridPosition') myGridPosition: jqxGridComponent;

source: any =
        {
            totalrecords: 1,
            unboundmode: true,
            datafields:
                [
                    { name: 'pos1' },
                    { name: 'pos2' },
                    { name: 'pos3' }
                ],
        };

        dataAdapter: any = new jqx.dataAdapter(this.source, {
          downloadComplete: function (data, status, xhr) { },
          loadComplete: function (data) { },
          loadError: function (xhr, status, error) { }
      });

      gridColumns: any[] = [
        { text: 'Position 1', dataField: 'pos1',align: 'center', width: 170 },
        { text: 'Position 2', dataField: 'pos2',align: 'center', width: 170 },
        { text: 'Position 3', dataField: 'pos3',align: 'center', width: 170 }
    ]

    rendered = (type: any): void => {

      let options = {
          revert: true,
          dropAction: 'none',
          appendTo:'body'
          
      };

      let uglyGridDragDropCells = jqwidgets.createInstance('.jqx-grid-cell', 'jqxDragDrop', options);
      

  }
}

I don’t understand why it’s bug, i have follow your demo…
do you understand ?

Thanks a lot !

[Author]

Posts