Creating a custom edit form

[David]

The edit functionality of the grid is not working out for me... 
I have come up with an ajax action link but would like to style it the same as the edit button without it firing the edit. 

so far I have this but it produces one icon in the button and one outside of the button and there is no text, How can I recreate the edit button without it firing the default edit command of the grid?

<a class='k-button k-button-icontext' data-ajax='true' data-ajax-mode='replace' data-ajax-method='Get' data-ajax-update='\\#editorform'  href='/FallsAssessment/Edit?EventID=#=EventID #' data-ajax-success='showModal'><span class='k-icon k-i-pencil'/>Edit</a>

Thanks 

David 

[Kiril Nikolov]

Hello David,

I would suggest you to use the custom command option of the grid. Using this option you can execute your own function, while you will not need to design the button. Please check this demo:

http://demos.kendoui.com/web/grid/custom-command.html


In your case when you create the custom command you need to set these options in order to display it as a normal edit button, but with custom function executing on click:

{ command: {
        text: "CustomText",
        click: showDetails,
        imageClass : "k-icon",
        iconClass: "k-edit"
}}

For your convenience here is a jsBin example which demonstrates a possible implementation.

Regards,
Kiril
Telerik

Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now! 

[David]

cheers, can a custom command do an ajax call to the controller?  I need to return different forms in partial views and display them.  This is why I chose to do it like below. It's a real pain I have to build the link up as a string too, but the ajax options break your javascript if I use them. I can't see any way to do this with a custom command. 

Also I don't see how to add the options you provided in the MVC html helper, only in the javascript examples. I am using the MVC Html helpers.  

I tried the popupedit but cant figure out how to get the model for the renderpartial in the template. 

columns.Bound(m => m).Template(@<text></text>).ClientTemplate("<a class='k-button k-button-icontext' data-ajax='true' data-ajax-mode='replace' data-ajax-method='Get' data-ajax-update='\\#editorform'  href='/FallsAssessment/Edit?ID=#=ID #' data-ajax-success='showModal'><span class='k-i-pencil'/>Edit</a>");

[David]

I got the markup i needed from the example thanks 

<a class="k-button k-button-icontext k-grid-CustomText" href="#"><span class="k-edit k-icon"></span>CustomText</a>