How to change input type dynamically in angular js

See more:

AngularJs

Hello all,

I am working on MVC with angularJS. In which I am generating dynamic HTML controls from angularjs based on database fields.Like

------------------------------------------------
Lable || Type  ||IsRequired || MinLen || MaxLen
------------------------------------------------
Name  || text  ||Yes        || 3      ||10
Mobile|| number||Yes        || 10     ||12
DOB   ||date   ||Yes        || --     ||--
------------------------------------------------

And I am creating controls using javascript function using

document.CreateElement(input);

and checking database values in if else like

if(DatabaseType=="text"){
document.CreateElement(input);
input.type="text";
}else if(DatabaseType=="number"){
document.CreateElement(input);
input.type="number";
}else if(DatabaseType=="date"){
document.CreateElement(input);
input.type="date";
}

and appending those controls to div using

divId.appendChild(input);

like this

But when my values get change then type date gives me a problem

it doesn't allow to enter text or number in that text box

I also used $compile function then also it gives me a problem please suggest me solution


In short I want to change input type dynamically like date to text
but when I do this it doesn't allow.

What I have tried:

if(DatabaseType=="text"){
document.CreateElement(input);
input.type="text";
}else if(DatabaseType=="number"){
document.CreateElement(input);
input.type="number";
}else if(DatabaseType=="date"){
document.CreateElement(input);
input.type="date";
}

divId.appendChild(input);

$compile(divId);