'Normal' scenario: populating a local grid with remote loaded data

[Andrea]

Hi.
I'm evaluating your beautiful instrument, but I'm arriving at places where I need some help to understand how things can be done.
I have this (I think normal enough) scenario: I have to populate a form to submit to the server, and one of the fields is a list of, say, customers. They can be hundreds, and I don't want to handle context problems when paginating them, and I already saw that the grid can handle a whole bunch of local items paginating them without going to the server. Ok.
What I now need is to let the user populate this grid (locally) searching data on the server, for example with the substring inserted, the ID, etc.
I would like the user to add a new row, insert some text, and then trigger the search on the server, exactly how it happens using for example the autocomplete widget.
I saw I can intercept 'Save' event (I'm using ASP.NET MVC), and insert code like this, to create a new record:

$("#grid").data("kendoGrid")
            .dataSource
            .insert(0, {
                ID: 123,
                Name: "John Smith"
            });

But I see that the record being inserted is still there, and moreover I don't know how to show a search box like in the AutoComplete...
Please, can you help?
Thanks in advance.
Andrea Bioli

[Andrea]

...I have to add that I don't need a way to populate a single field, of the new row I'm inserting, but to choose a whole record from the server (the target table), using for example the ID field (so searching for a very specific record), or the Name field (where I have to show the result of a search on the server, where to choose from).
Again,
Andrea Bioli

[Petur Subev]

Hello Andrea,


What I now need is to let the user populate this grid (locally) searching data on the server, for example with the substring inserted, the ID, etc

To filter the Grid you should either use the filter method of the dataSource, the same way it is used here. It is not needed to use the Toolbar template or the DropDownList, but the idea remains the same - use the filter method of the dataSource.

I would like the user to add a new row, insert some text, and then trigger the search on the server, exactly how it happens using for example the autocomplete widget.

I do not understand the question, what do you mean by "trigger the search on the server"? You want to add new record and then filter the Grid, whats behind this idea?

Could you please try to clarify your questions?

Kind Regards,
Petur Subev
Telerik

[Andrea]

Hi Peter,
    first of all, thanks for your kind reply.
Ok, I realize I was not clear, so let's sketch a 'real' case: on the server, I have 20.000 customers, and the user wants to choose some of these customers, to send an advertising email.
So I have to create a form, where (locally) the user can compose the email, *and* select some of the customers (by ID, by substring search).
I don't want to *filter* customers, I want to give the user the ability to select a subset of the customers, one by one.
So my thought is to create a local grid, where the user adds dynamically customers, and then send them to the server, together with other data.
I hope it is clear now... :-)
Thanks again
Andrea Bioli

[Andrea]

I got no new answer, for this question...

[Petur Subev]

Hello again Andrea,

The Grid Widget is used to display data not to submit data from it to the server. However you can use a checkbox column and and thus send the selected rows to the server. Basically you can use the exact same approach as in this demo (no matter it uses the old Extensions) - check how the selected records are send to the server.

To create template column with a checkbox inside of a Kendo Grid you can use the exact same approach - only the client expression are slightly different:

you should use:

.ClientTemplate("<input type='checkbox' name='checkedRecords'
                       value='#= OrderID #' />")

Instead of:

.ClientTemplate("<input type='checkbox' name='checkedRecords'
                       value='<#= OrderID #>' />")

Kind Regards,
Petur Subev
Telerik

[Andrea]

Thank you again.
So, let me try to understand it: the grid can be bound to the model only if the model *IS* the IEnumerable of the (grid) data, *NOT* if I want to bind it to an (IEnumerable) attribute of the model.
Is it right, what I'm saying?
Andrea

[Petur Subev]

Hello again,

The Grid is designed to bind to a collection. No matter if the collection is the model of the view (ASP.NET MVC View page) or if the collection is a property of the model of the view.

Kind Regards,
Petur Subev
Telerik

[Andrea]

...now I'm totally confused! :-)
I have a Deal object, that I use as model for the razor page, and inside of it I have a list of secondary customers, to choose from a table on the server (classical 'ID', 'Name' combination).
The user compiles the Deal, *and* populates a local grid choosing items on the server (I'm already working on it, using your ComboBox, for which I have another question, on the relative section of this forum). When then the user posts data, I would like to get the Deal already bound to the form fields, but from your previous answer, I thought I had to read manually the grid, on the server.
If now you say it's possible to bind it to the collection, I would like to know how this can be done...
Andrea

[Petur Subev]

Hello Andrea,

It seems I misunderstood one of your questions. Basically if you want to submit the records of the Grid to the server along with other input elements on the page you can also use the approach covered in this code library artcile:

http://www.kendoui.com/code-library/mvc/grid/submit-form-containing-grid-along-with-other-input-elements.aspx


I hope this is what you are searching for.

Kind Regards,
Petur Subev
Telerik