This is a migrated thread and some comments may be shown as answers.
Is there a complete example of a Form using Kendo UI?
23 Answers 2424 Views
This is a migrated thread and some comments may be shown as answers.
This question is locked. New answers and comments are not allowed.
Guy
Top achievements
Rank 1
Guy asked on 27 Jun 2012, 03:32 PM
Your examples show your controls.  How about one that shows a whole form?

23 Answers, 1 is accepted

Sort by
0
Iliana Nikolova
Telerik team
answered on 29 Jun 2012, 09:45 AM
Hi Guy,

I am not quite sure if I understand correctly what do you mean with "complete example of a Form using Kendo UI". If you are looking for a starting point for your project, I will recommend going through our online demos and examining the source code. Also, the widget configuration options and various other features of the framework are explained in our documentation. I think that the Widget Fundamentals section would be very useful for you.  

Please let me know if I missed something.

Greetings,
Iliana Nikolova
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Ben Hayat
Top achievements
Rank 2
answered on 30 Jun 2012, 11:37 PM
Iliana, I think what "Guy" is asking for, a Page that has a Form (like a ASP.Net Ajax WebForm) that shows a series of input entry controls, like First Name, Last name, Phone, Email and then this form is to get/set data to a backend server (i.e. an ASP.net MVC or Web API for JSON data) to perform CRUD operations. When he says "Complete" sample, he means and "end-to-end" sample how to get data, show it, change it and save it back to database.
This is a very needed type of sample to show the full cycle rather than just the client side.
Hope this helps!
..Ben
0
Peter Bulloch
Top achievements
Rank 1
answered on 02 Jul 2012, 04:23 PM
I'm still struggling with the basics that Guy is looking for.  In my case I am using CRUD with .NET 4.5 WEBAPI.  I have read (GET) and the update (PUT) working but cannot figure out the destroy (DELETE). Create is next (POST).  So I too would like to see a simple but complete form example containing say, a typical contact list on a remote server with crud examples.
0
Iliana Nikolova
Telerik team
answered on 04 Jul 2012, 03:26 PM
Hello guys,

I am afraid at this stage we do not have such a full end-to-end example in Kendo UI, because it is a client-side library.

Regarding the remote CRUD operations - I would suggest to check this code library project, which illustrates such operations in Kendo UI Grid bound to ASP.NET MVC action methods. 

Regards,
Iliana Nikolova
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Peter Bulloch
Top achievements
Rank 1
answered on 04 Jul 2012, 04:23 PM
Thx Iliana,

My understanding of the latest webAPI (at least using MS MVC 4.5) is that all CRUD calls to the server use proper HTTP verbs such as POST (create) / GET (read) / PUT (update) / DELETE (delete).  Your examples all use POST. (Perhaps this is was the standard before webAPI/MVC 4.5?)

Further, in the thread for the demo you suggested, Atanas said: "You need to save the changes to commit the destroy operations to the server. Clicking the "Delete" button will not hit the server."  Can you expand on that statement - maybe with an snippet?  Using other examples I simply see "dataset.remove" (conceptually) being called when Delete is clicked.
0
Daniel
Telerik team
answered on 09 Jul 2012, 11:04 AM
Hello Peter,

Using the MVC 4 WebAPI with the Kendo Grid should be similar to using it with a web service. Besides setting the request type, you should also set the content-type and convert the data to JSON in the transport parameterMap function when updating, deleting or creating records. I attached a sample project which shows the basic configuration. 
Regarding your other question - when using batch editing, a request will not be sent to save the data immediately after the Delete button is clicked. Instead, all records that were deleted will be sent with a single request when the user clicks  "Save Changes" button.

Kind regards,
Daniel
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Peter Bulloch
Top achievements
Rank 1
answered on 09 Jul 2012, 12:11 PM
Thx Daniel

I look forward to digging into your attached sample (and watching the Q2 launch).

Peter
0
Christophla
Top achievements
Rank 1
answered on 10 Oct 2012, 09:18 PM
I am sick of grid examples. Applications aren't entirely comprised of GRIDS!!. I've wasted too many hours on this.

Please, show some form examples. Read and Update a form, and, simply submit a new form that wasn't bound to existing data.
0
Joseph
Top achievements
Rank 1
answered on 24 Oct 2012, 04:59 AM
Definitely agree with Christophla. I do not understand the concept of using grid to replace the form which usually includes lot of functionality.
0
Koen
Top achievements
Rank 1
answered on 29 Oct 2012, 09:54 AM
Using just a form, not a datagrid ... here's a simple way to send the validated form.

http://www.kendoui.com/forums/framework/validation/send-form-data-to-server.aspx
0
mac
Top achievements
Rank 1
answered on 08 Nov 2012, 02:48 AM
I agree with Peter Bullock. We have been resisting kendo ui due to the fact that there will be huge learning curve for developers. It would be a great help if kendo ui team creates a sample application like ajax controls.

A simple contact form will be of help using mvc3+.
0
Marcus
Top achievements
Rank 1
answered on 08 Nov 2012, 09:12 AM
I suggested a general Show Case Gallery but either a) No such applications exist yet b) No one is really interested.

It would be nice to see real world applications instead of some twitter or todo apps :).
0
David
Top achievements
Rank 1
answered on 08 Nov 2012, 07:31 PM
Telerik needs to provide a series of tutorials that result in real-world widgets as output and can be used as building blocks to solve common patterns to drive adoption

Demos are nice too but are to tutorials what uncommented code is to code reviews.

Its been 6 months since I first looked at Kendo and I don't see anything new on that front. Hopefully I missed something?
0
Christophla
Top achievements
Rank 1
answered on 16 Nov 2012, 01:50 AM
Koen,
  You posted a link to a thread that has no solution.... par for the course, I suppose. Telerik has always been thorough with examples - but they are dropping the ball with Kendo.
0
Linus
Top achievements
Rank 1
answered on 16 Nov 2012, 02:31 PM
Hi Folks

I am also concerned with forms using KendoUI.
If you are using a Kendo Grid or a Kendo ListView there is a direct support of inline editing with Edit and Update, resp.. cancel buttons. Please refer to Kendo UI Web Examples: "Grid Inline Editing" and "ListView Edititng".
I wish to have something similar for forms: A form container hosting by form elements and the Edit, Update, Cancel buttons which is dealing with the templates and events. Ev. with the option inline or popup editing. That would be nice!

Linus  
0
John
Top achievements
Rank 1
answered on 28 Nov 2012, 05:12 PM
Hello All,

I've been playing with KendoUI for a couple of weeks, and forms management is still a bit of a concern for me as well.  Most of the demos and examples take a completely different approach to displaying input forms, using a background image for the labels and then overlaying them with the actual input fields.  I find this somewhat misleading, although to be fair, I'm also exploring the possibility that it might be a useful technique in certain scenarios.

For more mainstream scenarios, however, we still need a few simple examples for declaring input forms and input panels containing various controls.  Perhaps just a page that includes all of the available widgets?

John
0
Atanas Korchev
Telerik team
answered on 29 Nov 2012, 08:22 AM
Hi,

 At the time being Kendo UI does not feature any form management capabilities. One can use the Kendo UI widgets as replacements of HTML elements - <input type="textbox/> , <select>, <textarea> etc.

 Here is a sample demo showing how you can use Kendo UI widgets in a form: http://jsbin.com/owulaj/3

Regards,
Atanas Korchev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Rick Atkinson
Top achievements
Rank 1
answered on 10 Dec 2012, 05:49 PM
Atanas, I understand that Kendo does not have any built in form management capabilities.  What I am looking for is some type of 'best practices' related to a form.

For a form that requires CRUD operations, should I use MVVM and and a DataSource to manage the form?

I am trying to determine the best data access strategy if using KendoUI.  Should I use standard jQuery ajax calls?  A third party library such as AmplifyJS?  Or, can the Kendo DataSource combined with MVVM meet my needs.  

I would like to just use Kendo for simplicity.  However, as mentioned earlier, most of the examples of CRUD operations center around Grids.  That is good, but not the complete picture for me.

Any advice on the above is appreciated.

Thanks, Rick
 
0
Michael
Top achievements
Rank 1
answered on 13 Dec 2012, 10:49 AM
Despite the original post to this form 6 months ago there has been no response from Telerik to answer a simple question. If there is no official demo can one of the Kendo developers not knock up something in a few minutes, zip it up and post it here?

I too am struggling to figure this out. Using MVC I have created a kendo mobile page with a simple login and password elements. This renders correctly when I run the page. However if I add @using (Html.BeginForm()) around the form controls then the CSS completely disappears and I am left with a non-kendo ui page. 

My limited knowledge of MVC relies on creating the form tag so I can post back the data.. Can this not be done with kendo ui mobile?

Thanks
0
Holger
Top achievements
Rank 1
answered on 13 Dec 2012, 03:02 PM
Hi,

I have attached a small demo project that shows how to handle HTML forms with ASP.NET MVC and Kendo UI.

Hope this helps,
Holger
0
Michael
Top achievements
Rank 1
answered on 13 Dec 2012, 03:24 PM
Thanks Holger, much appreciated! Will look over it now.
0
Holger
Top achievements
Rank 1
answered on 13 Dec 2012, 07:11 PM
FYI: In order to decrease the size of the zip-file I had to remove the the NuGet packages files from the project. To get the project running you will have either to manually restore these files or allow NuGet to download them during the build.

Regards,
Holger
0
Jason Marshall
Top achievements
Rank 1
answered on 11 Jun 2013, 03:23 PM
Was this ever followed up by Telerik for anyone.  Wow, I really want to use Kendo, but the "demos" are not cutting it, and the tutorials are sparse.  I am concerned only with MVC + Kendo Mobile UI + using Open Access. 
Asked by
Guy
Top achievements
Rank 1
Answers by
Iliana Nikolova
Telerik team
Ben Hayat
Top achievements
Rank 2
Peter Bulloch
Top achievements
Rank 1
Daniel
Telerik team
Christophla
Top achievements
Rank 1
Joseph
Top achievements
Rank 1
Koen
Top achievements
Rank 1
mac
Top achievements
Rank 1
Marcus
Top achievements
Rank 1
David
Top achievements
Rank 1
Linus
Top achievements
Rank 1
John
Top achievements
Rank 1
Atanas Korchev
Telerik team
Rick Atkinson
Top achievements
Rank 1
Michael
Top achievements
Rank 1
Holger
Top achievements
Rank 1
Jason Marshall
Top achievements
Rank 1
Share this question
or