I have this script inside my index.cshtml.
<script id="meterGrid_ActionPanel" type="text/html">
<div class='btn-group'>
<a class='btn btn-primary btn-xs dropdown-toggle' data-toggle='dropdown'>
<span class='caret'>
</span>
</a>
<ul class='dropdown-menu'>
<li>
<a class='open-dynamic-modal-link'
data-title='Profile Capture Period for #=MeterNo#'
data-url='@Url.Content("~/Meters/LoadProfileCapturePeriodPartial?meterno=#=MeterNo#")'
data-large='false'
data-onload='initCheckboxes'
data-close='Close'
data-primary='Submit'>Set Profile capture Period </a>
</li>
</ul>
</div>
</script>
And this code then used in kendo grid column template using javascript function.
function getMetersActionPanel(data) {
return kendo.template($("#meterGrid_ActionPanel").html())(data);
}
Here is the kendo MVC grids basic representation
.Columns(c =>
{
c.Template(m => @Html.ActionLink("", "", "", null))
.Width(75)
.ClientTemplate("#= getMetersActionPanel(data) #");
})
What I want to do?
Now what I really want do it to move this script #meterGrid_ActionPanel
to seperate file as it has lots of content and separating the HTML template from main view file will make the code cleaner and more modular.
What I tried So far?
I tried to load this html through partial view and ajax call, but I think it’s not a proper way to have server side call for each column. I have around 28000 columns in each grid so. I have also checked the js and html file options but no luck with that.
Main complexity that I need to handle along with this implementation
- the script has parameters that I need to pass from javascript function
getMetersActionPanel
side, checkdata
parameter which contains around 11-12 properties.
Any help or suggestion would be highly appreciated!