How to extend a backend view (Insert) of a custom module

HI,

I have created a custom module with several fields and registered within my SF4 website. Now I want to have a button next to one of the fields on the backend insert view. Currently the backend views has been created only within Sitefinity but not phisically. So I need to know how I should extend the generated backend insert view to have a button next to an input field and implement the event handler of the button to do something.

My requirement is add a button called "Lookup" next to the ID field on the view and upon clicking that button will lookup an item containing a matching ID and auto populates the remaining fields on the insert view.

Can something like this be done and how?

Thanks!
Duneel

Hi Duneel,

I suggest that you should create a custom field that will handle your logic. Here is a blog post that shows how to do this.

Kind regards,
Ivan Dimitrov
the Telerik team

Hi Ivan,

I went through the blog post (Thumbnail selector) you sent me about creating custom fields. What I'm not clear is how we can get access to a different field on the Insert backend view. As I have explained my requirement in the original post, I should be able to set the values of other fields. So I'm not clear how to do that using custom fields. Can you send me some sample code which demonstrate the following behavior so I can use the same approach and implement the behavior I need.

Key thing: The behavior is required on the Backend Insert view of a custom module that was auto generated when registering the module in SF4.

The module contains the following fields:
PlayerID :
Name :
Age :

Behavior:
I need to have a button called "Lookup" next the PlayerID field on the Insert backend view. After typing the PlayerID and upon clicking the "Lookup" button it should set values for Name and Age fields.

Could you please create a sample code for the above behavior and share with me?

The idea behind this is to let the user to lookup for a player on a different database and populate the rest of the fields with the values returned. So that they wont have to type everything manually.

Thanks!
Duneel

Hello Duneel,

All fields in the Insert view of your module are represented by Field Controls. Their values are populated by a FieldControlsBinder on the page, which receives the dataItem and maps its properties to the field controls. To achieve what you want, you need to rebind this FieldControlsBinder with a custom dataItem that you've created. We don't have a code sample for this yet. We're going to work on one and let you know when it's ready.

Hi Slavo,

Thanks for getting back on this. Would be great if you can send me some sample code as soon as possible. My customer really wants to have that functionality on the back-end INSERT/EDIT view, and I have no idea how to implement that.

Thanks,
Duneel

Hi,

I am also looking for something similar. I have a custom module inheriting from the generic content module. On the create/insert view, I want to add a file uploader and give it a custom onclick function. 

Also, instead of defining all controls for edit/insert/view in a definitions class like shown in the ProductsModule that came with the SDK, is it possible to use individual class files that use a user control as embedded layout template??

A sample code would be really helpful.
Thanks,
-Nidhi

Hi Duneel,

You can download a sample, which illustrates how to implement this scenario in the Products module from the Sitefinity SDK from here.

This sample creates a custom Lookup field for the Products module, similar to the scenario described in this blog post.
When the user closes the dialog, a dummy product is generated in the code (it is not in the dialog user interface), and set as the value of the lookup field. Addinionally, there is an extension for the DetailFormView (this is the dialog used to create and edit items). This extension subscribes to an event that fires every time the lookup field changes its value. When this happens, the extension code rebinds the whole DetailFormView with the dummy product constructed from the dialog.

All relevant files are in the ProductCatalogSample project, under the path Web.UI.CustomLookupField.
The file representing the extension of the DetailFormView is called ProductsDetailExtension.js.

What you should then do is provide the UI in LookupFieldDialog, through which you will select your existing items. This depends on your particular case.

@Nidhi Your request is much more easily achievable, since you don't have to pre-populate all fields. All you need is to create a custom field control. Just follow the example in the blog post I mentioned above. You can of course use standalone controls instead of definitions, but you would have to implement all things that you use out of the box yourself (all UI, calling the manager methods, persistence in the DB). This would be much more cumbersome compared to definitions.

Let us know if you have any further questions.

Hi Slavo,

When I started making the custom module, I inherited from the Jobs Intermediate module because I thought the process of making backend controls would be similar to the front end widget in that example.
So right now I have one overview page with very basic placeholders with the edit/insert functionality. I don't understand where I will implement the customfield.

In future, when we are trying to create a new module inheriting from any of the other modules, where can we get the base of an entire module? like its templates and class files so we can extend it?? It didn't come with the SDK. I have sitefinity 4.0 Sp1.

Thanks
Nidhi

Hi Nidhi,

The custom filed can be added to the module definition class. You can take a look at the Products sample definition class.

Inheriting from one of the built-in modules directly is currently do not supported, because of an issue with the OA. I hope that we will manage to fix the issue after Q1.

Greetings,
Ivan Dimitrov
the Telerik team

Hi Slavo,

You mentioned and linked to a sample that extends DetailFormView at dl.dropbox.com/.../DetailFormViewExtension.zip. This is currently unavailable, would it be possible to get that sample from you?

Hi,

The sample that Slavo has referred in the post is part of the Sitefinity Product Catalog sample module in the latest version of the SDK. There is a field that associates a product item with an image.

Greetings,
Radoslav Georgiev
the Telerik team