JSFiddle - React, Tailwind, and code Playground
by siliconsoul
HTML
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.913/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.913/styles/kendo.default.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.913/styles/kendo.mobile.all.min.css">
<script src="http://cdn.kendostatic.com/2012.2.913/js/kendo.all.min.js"></script>
<script id="EditFacilityServiceStatusList" type="text/x-kendo-template">
<div>
<div class='ListTemplateStyle'>${ServiceName} :
<input class="ddlServiceStatus" />
</div>
<div>
<span class='ListTemplateStyle'>Comments :</span>
<input type='text' class='k-textbox statusCombo ListTemplateStyle1' />
</div>
# initCombo(data)#
</div>
</script>
<div data-role="view" data-model="viewModel">
<ul data-template="EditFacilityServiceStatusList" data-role="listview" data-bind="source: serviceStatuses"></ul>
</div>
JavaScript
var ServiceStatusUpdateSrc = [{
Comments: "Hi",
FacilityName: "Bhagath Facility",
ServiceId: "String content",
ServiceName: "Bhagat",
ServiceStatusId: "String content",
ServiceStatusReasonId: "String content",
StatusId: "String content",
StatusName: "Yes",
StatusValue: "String content",
Statuses: [{
Abbrevation: "String content",
Id: "1",
Name: "Yes",
Reasons: [{
Id: "3",
Name: "Test reason"
}],
ServiceId: "1"
},
{
Abbrevation: "String content",
Id: "2",
Name: "No",
Reasons: [{
Id: "3",
Name: "Test111111 reason"
}],
ServiceId: "2"
}]
},
{
Comments: "Hi",
FacilityName: "Bhagath Facility",
ServiceId: "String content",
ServiceName: "Ram",
ServiceStatusId: "String content",
ServiceStatusReasonId: "String content",
StatusId: "String content",
StatusName: "Yes",
StatusValue: "String content",
Statuses: [{
Abbrevation: "String content",
Id: "1",
Name: "Test",
Reasons: [{
Id: "6",
Name: "Test reason"
}],
ServiceId: "1"
},
{
Abbrevation: "String content",
Id: "7",
Name: "Test1",
Reasons: [{
Id: "3",
Name: "Test111111 reason"
}],
ServiceId: "2"
}]
}
];
viewModel = kendo.observable({
serviceStatuses : new kendo.data.DataSource({
transport: {
read: {
url:'/echo/json/',
type: "POST",
data: {
json: kendo.stringify(ServiceStatusUpdateSrc)
}
}
}
})
})
function initCombo(d){
setTimeout(function(){
$("li[data-uid='" + d.uid +...