Hi Jeffrey,
Thanks for contacting Syncfusion support.
We can render the ejRating control through ‘Edit Template’ feature of the Grid.
Edit Template has three functions.
•Create – It is used to create the control at the time of initializing.
•Read – It is used to read the input value at the time of saving.
•Write – It is used to assign the value to control at the time of editing.
Please refer to the below code example for further details.
.Columns(col =>
{
col.Field("OrderID").HeaderText("Order ID").IsPrimaryKey(true).TextAlign(TextAlign.Right).Width(75).Add();
col.Field("CustomerID").HeaderText("Customer ID").Width(80).Add();
col.Field("EmployeeID").HeaderText("Rating").EditTemplate(a => { a.Create("create").Read("read").Write("write"); }).TextAlign(TextAlign.Right).Width(175).Add();
col.Field("Freight").HeaderText("Freight").TextAlign(TextAlign.Right).Width(175).Format("{0:C}").Add();
col.Field("ShipCity").HeaderText("Ship City").Width(110).Add();
}))
<script type="text/javascript">
function create() {
return $("<input>"); // Create the input element
}
function write(args) {
var gridId = args.element.parents(".e-grid").attr("id");
args.element.ejRating({ value: args.rowdata !== undefined ? args.rowdata["EmployeeID"] : "", modelType: "picker" }); // Render the rating control
$("#" + gridId + "Color_Presets").css("display", "none");
}
function read(args) {
var a = $("#FlatGridEmployeeID").ejRating("instance");
return a.getValue(); // Read the rating value
}
</script> |
Please refer to the below UG Documentation and online demo link to know more about EditTemplate in Grid.
We have created a sample which can be downloaded from the below link.
If we have misunderstood your requirement, please share more details about your requirement.
Regards,
K. Karthick