Submit to REST service

[Ryan]

Looking for an example on how to modify the submit to

 

 

-POST to a REST service

-Not redirect the page

weak attempt.. 

        //add to existing dom

ui.content.find('#add').append('<form id="addFrm" method="POST" onsubmit="svc.addResource();return false;"></form>'.format(_host.service));
page.addForm = $("#addFrm").kendoForm({
            formData: {
                id: 0,
                modifiedBy: _user.email,
                projectName: page.project.name,
                role: '',
                resourceType: '',
                upn: '',
                userDisplayName: ''
            },
            items: [{     editor: 'DropDownList', field: 'role', label: 'Project Role',
                    validation: { required: true, message: "must specific resource role" },
                    hint: "Hint: Solution Architect, Project Manager, Technical Lead, etc..",                
                    editorOptions: { optionLabel: 'select project role...',dataSource: page.roles, dataTextField: 'role', dataValueField: 'role'}  },

                 { editor: 'DropDownList', field: 'resourceType', label: 'Resource Type',

                    validation: { required: true, message: "must specific type resource of resource" },

                    hint: "Hint: Vendors existing supplier, Contractors are independently hired, Any if TBD..",
                    editorOptions: {
                        optionLabel: 'select type of resource...',
                        dataSource: [{ text: 'Any' }, { text: 'Employee' }, { text: 'Vendor' }, { text: 'Contractor' }],
                        dataTextField: 'text',
                        dataValueField: 'text'
                    }
                }
            ]
        });

 

[Dimitar]

Hello Ryan,

You can subscribe to the Form submit event and use e.preventDefault() to prevent it and then manually send an $.ajax request as follows:

$("#exampleform").kendoForm({
   ...
   submit: function(e) {
      // prevent submit
      e.preventDefault();
                    
      // send ajax request
      var model = e.model;
      console.log(model);

       $.ajax({ ... })
    }              
});

Here is a simple Dojo example where preventing the Submit as explained above is also demonstrated.

I hope this helps.

Regards,
Dimitar
Progress Telerik