DataList -

Hello, i´m planning to put form controls inside a data list... how to achieve individual name for each item. I´ve tried to pur a radiobuttonlist and give it a name, but the same name is applied through all rendered component.... I´m planning to do the same for controls like textbox, selectbox, etc...

Thanks
Anderson Szalai

Hi @andersonaskm,

Usually when inside repeating components you should not access inputs by name but bind their Value property to some property of the data item.

Just wanted to add that Angular does not support that feature (dynamic component names).

Hmmm... but for example... I have a datalist with 10 lines... if I put a Radio Group with 3 options, each line must have it ows component... if I select the 2nd option in the 1st line and I go to select the 1st option in line 5.... today it unchecks the option from line 1...

My issue is that each line generated by the datalist could have its owns controls that acts independently.... so I think that the naming... even indexed automatically could be different....

Actually you can use expression for Name like this:

But if attach a change event to control, it breaks...

Will you post more info what you want to achieve? Do you want to update a property of the data item on change? In this case you should bind the value of the component.

Below is without change event attached, just using the suggestion proposed

image
image

Then, trying to bind a change to the radiobuttonlist. It shows compile errors...

image
image

You didn’t answer my question. Why do you want to use change event and not bind the value?

My business case is:

  1. We want to use a datalist to show a list of reviews and the user must classify it from 1 to 5. I guess radiobutton list could be a option.

  2. But when I add that component, and the user checks for example option 1 to line 1 and decide to go on line 5 and check option 4 for example...the option 1 is unchecked. The behavior that we need is each line has it owns option.

  3. Beside that, after a user choose a option, I must change an internal flag for each row that the user selected an option just to separate the lines that the user already answered from the one that not. I thought that use change event attached to the radiobutton list could do the job.

  4. If I use the approach above ({{data.xptoid}}... the behavior on screen is ok, but I cant use the change event.

  5. Do you have any suggestion how to achieve this scenario, using a radio button list inside a datalist?

In my opinion Rating component is much better for your case:
https://angular.radzen.com/rating

OK, I could try it.

Another scenario that arises is giving a marital status choose option, so the same bad behavior arises.... It can be a radio button list? Or is it better to choose another component, such as lookup for example?

Thanks!

Yep, lookup should be better. Maybe you can also use DataGrid with in-line editing (column EditTemplate) instead to avoid multiple input components at the same time.