In the following example, the width of the filter boxes are much bigger than the data for that column.  For example, the max number of digits for Order ID is 5.  Therefore, the filter box only needs to be wide enough to hold 5 digits. 

https://demos.telerik.com/aspnet-core/grid/filter-row

How do you reduce the width of the filter boxes?

Thanks,

Robert

I have a page using ListView paging which is well.
Problem is that the pager shows a dropdown instead of numeric links, unless the width of div containing listview is increased (to 50% in my case)

This is how it looks when div is wide (50% width)

This is how I need it to be. with numeric links

But this is how it looks now (with width at 30%)

Unfortunately I need the width at 30% due to the content on the right side of the listview.

My question is how do I force the listview to show pager as numeric links only?

Hi,

I have the requirement where I need to get the confirmation from the user when they click on the delete button in the listview before proceeding to destroy action. I am trying to subscribe to the click event on the delete button to cancel the destroy action. But I am unable to do so as Kendo has already bound the delete button click to destroy action.

Please suggest/guide on how I can get a confirm box displayed before proceeding to destroy action.

Thanks,

Ashwini

I have a grid worth of data coming from 2 different data sources that I smash together on the server side and send to the grid. Data from one of my sources is fine (ish... it is pretty slow too), data from the other source is brutally slow. So I want to send all of the data from source one and the first page worth of data from source 2 to the grid on page load, and then use JQuery/ajax to do a deferred load on the remaining data in the background.

I do not want to do an AJAX call per page because data source 1 isn't fast enough for that.

Since the second data source is so slow, I am chunking the unpopulated data into page sized chunks (blocks of 10) and letting the async goodness do its thing. I can do the ajax and get the supplemental data without a problem. I just can't seem to get the grid to respect the updated data. I can't replace the whole datasource's data set at once because we are doing this all async and we will have data pouring in all willy nilly and we don't want to have potential over writes. So we have to update it per row.

const fieldsToUpdate = ["field1", "field2", "field3", "field4"];

$.ajax({
.... blah blah blah ....
success: function(responseData) {

     const accounts = responseData.Data.AccountList;
     for (let idx = 0; idx < accounts.length; idx++) {
              const curAccount = accounts[idx];
              const dataItem = theGrid.dataSource.get(curAccount.AccountNumber);
              if (dataItem) {
			console.log(`Deferred data load for: ${curAccount.AccountNumber}`);
			for (let propIdx = 0; propIdx < fieldsToUpdate.length; propIdx++) {
				const key = fieldsToUpdate[propIdx];

                                // because the set method will ignore anything that isn't marked as 'editable' and I don't care about that
                                let hasEdit = false;
				if (dataItem.fields[key].hasOwnProperty("editable")) {
					dataItem.fields[key].editable = hasEdit = true;
				}

				// actually set the value
				dataItem.set(key, curAccount[key]);

                                // set it back to whatever it was
                                  if (hasEdit) {
					dataItem.fields[key].editable = false;
				}
			}

                        // we don't care
			dataItem.dirtyFields = {};
                        dataItem.dirty = false;
	}
     }
}
});
				
				

So the above kinda sorta works. It will display the right data until you attempt to move to a different page. Then it looses it mind and the data reverts back to what it was originally (unset) and the paging breaks and the grid just stops working all together. There are no errors visible in the console.

What is the proper way to update individual rows of data in a grid that may or may not be visible on the current page of the grid?

We  seem to be seeing a mis-match in paging options on grids used across our system.

The majority have the following default: 

However, we're seeing a couple grids with the drop-down version used:

What could cause this? There's no paging options set on either of the grids however both are showing different paging options.

For reference, here's a snippit of the grid displaying the paging drop-down: 

I use Grids with both popup and inline editing.  My application is in English and I have not configured any localization at all.  I have the problem of unwanted localization when editing, buttons (inline and popup) and Window header (popup, see image) are getting localized. In my case with Swedish translations. It seems to be the same as the server Windows setting. If I use a client with English OS and settings, the popup is still in server localization. If I install on a English OS, the buttons and headers are in English.

This always shows "en-US" as result, whatever combination of Swedish/english server/client browser I use.

var culture = kendo.culture();
console.log(culture.name); 

How do I turn off this "default" OS unwanted localization and make everything in English regardless of OS language?

How you do bind a value to an input when using a responsive columns template? The value wont be saved from the input when trying to save. E.G: Row is added, I edit the value, but when I save, it goes back to 0.

        columns.Template("#=resColTemplate(data)#").Title("Items").Media("(max-width: 475px)");

<script id="responsive-column-template" type="text/x-kendo-template">
    <strong>Amount</strong>
    <p class="col-template-val">
        <input class="numeric" data-bind="#: Amount #" value="#: Amount#" required />
    </p>
</script>

Hi!

I have tried following the Asynchronous upload documentation, but whenever I try to upload file(s), it always fails and the server responded with a status of 404.

Thanks in advance for your help.

My code is as follows:

HTML:

<div>
    @(Html.Kendo().Upload()
        .Name("files")
        .Async(a => a
            .Save("SaveAsync", "Home")
            .Remove("RemoveAsync", "Home")
            .AutoUpload(true)
        )
    )
</div>

Controller:

public class HomeController : Controller
    {
        private IWebHostEnvironment _WebHostEnvironment;
        
        public HomeController(IWebHostEnvironment webHostEnvironment)
        {
            _WebHostEnvironment = webHostEnvironment;
        }

        public async Task<ActionResult> SaveAsync(IEnumerable<IFormFile> files)
        {
            // The Name of the Upload component is "files".
            if (files != null)
            {
                foreach (var file in files)
                {
                    var fileContent = ContentDispositionHeaderValue.Parse(file.ContentDisposition);

                    // Some browsers send file names with full path.
                    // We are only interested in the file name.
                    var fileName = Path.GetFileName(fileContent.FileName.ToString().Trim('"'));
                    var physicalPath = Path.Combine(_WebHostEnvironment.WebRootPath, "App_Data", fileName);

                    using (var fileStream = new FileStream(physicalPath, FileMode.Create))
                    {
                        await file.CopyToAsync(fileStream);
                    }
                }
            }

            // Return an empty string to signify success.
            return Content("");
        }

        public ActionResult RemoveAsync(string[] fileNames)
        {
            // The parameter of the Remove action must be called "fileNames".

            if (fileNames != null)
            {
                foreach (var fullName in fileNames)
                {
                    var fileName = Path.GetFileName(fullName);
                    var physicalPath = Path.Combine(_WebHostEnvironment.WebRootPath, "App_Data", fileName);

                    // TODO: Verify user permissions.

                    if (System.IO.File.Exists(physicalPath))
                    {
                        System.IO.File.Delete(physicalPath);
                    }
                }
            }

            // Return an empty string to signify success.
            return Content("");
        }

        
    }

Greetings,

Is it possible to drag items from another control such as a list and drop them on the TaskBoard similar to how you can drag items from the grid control and drop them on a calendar? Very interested in this functionality.

Thanks,

Scott

Hello,

I create a ListBox that I bind to a list of SelectListItem. In this list i use the Group property. But i don't know how to render groups in Html.Kendo().ListBox()

I'm using mvc core and Telerik.UI.for.ASP.Net.Core version 2021.2.511 package

Regards