BoldSignEasily embed eSignatures in your .NET applications. Free sandbox with native SDK available.
Hi Carlo,
Thanks for contacting Syncfusion Support.
Query 1: How to do so the button in the template column is present/visible based on Boolean column.
When the “Boolean” column is true, we will render the button by using “JsRender If condtion” in the jsrender template and refer to the code example and jsRender documentation link.
<script type="text/x-jsrender" id="columnTemplate"> {{if Verified }} <input type="button" class="buttontemp" value ="{{:OrderID}}" /> {{/if}} </script> @(Html.EJ().Grid<ButtonTemp.OrdersView>("FlatGrid")
.Columns(col => { col.HeaderText("Button").Template(true).TemplateID("#columnTemplate").Width(100).Add(); })) |
https://www.jsviews.com/#iftag
We have used the event “TemplateRefresh” of Grid to render the ejButton and bind the click event to post the data to the server. Please refer to the code example and online documentation link.
@(Html.EJ().Grid<ButtonTemp.OrdersView>("FlatGrid") .ClientSideEvents(eve => { eve.TemplateRefresh("refreshTemplate"); }) ) function refreshTemplate(args) { var id = args.data.OrderID $(args.cell).find(".buttontemp").ejButton({ click: function (args) { . . . } }); } |
http://help.syncfusion.com/js/api/ejgrid#events:templaterefresh
Query 2: Is it correct / best practice to perform a page redirect this way?
If you post the data to the server using “window.location.rel='nofollow' href”, the data will expose on the address bar. If you want to hide the data on the address bar while posting the data, use $.post or $.ajax on the click event of Button. Please refer to the below Jquery API documentation link.
http://api.jquery.com/jquery.post/
http://api.jquery.com/jquery.ajax/
Regards,
Saravanan A.
<script type="text/x-jsrender" id="columnTemplate">
<input type="button" class="buttontemp" value="{{:OrderID}}" /> </script> @(Html.EJ().Grid<SyncfusionMvcApplication1.OrdersView>("FlatGrid") .Datasource((IEnumerable<object>)ViewBag.datasource) .AllowPaging() /*Paging Enabled*/ .EditSettings(edit=>{edit.AllowAdding().AllowDeleting().AllowEditing(); }) .ClientSideEvents(eve => { eve.TemplateRefresh("refreshTemplate"); }) .Columns(col => { col.Field("OrderID").HeaderText("Order ID").IsPrimaryKey(true).TextAlign(TextAlign.Right).Width(75).Add(); col.Field("EmployeeID").HeaderText("Employee ID").EditTemplate(a => { a.Create("create").Read("read").Write("write"); }).TextAlign(TextAlign.Right).Width(75).Add(); col.HeaderText("Button").Template(true).TemplateID("#columnTemplate").Width(100).Add(); })) <script type="text/javascript"> function create() { return $("<input>"); }
function write(args) { obj = $('#Edittemplate').ejGrid('instance'); //custom datasource var data = [{ value: "1", text: "1" }, { value: "2", text: "2" }, { value: "3", text: "3" }, { value: "4", text: "4" }, { value: "5", text: "5" }, { value: "6", text: "6" }, { value: "7", text: "7" }, { value: "8", text: "8" }, { value: "9", text: "9" }] args.element.ejDropDownList({ width: "100%", dataSource: data, value: args.rowdata !== undefined ? args.rowdata["EmployeeID"] : "" }); }
function read(args) { return args.ejDropDownList("getValue"); } function refreshTemplate(args) { var id = args.data.OrderID $(args.cell).find(".buttontemp").ejButton({ click: function (args) { var obj = $("#FlatGrid").ejGrid("instance"); obj.selectRows(obj.selectedRowsIndexes[0]); obj.startEdit() } }); } |
Thanks for your update.
We are happy that your requirement is achieved.
Regards,
Ragavee U S.