This is a migrated thread and some comments may be shown as answers.

Grid height inside a Tab control.(not rendered correctly)

0 Answers 130 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Ole
Top achievements
Rank 1
Ole asked on 09 Oct 2012, 02:58 PM
Hi,

My problem is as follows , I have a grid inside a tab which I am setting it height via the on select event of the tab.
function onSelect() {
//var reviewCategoryGrid = $("#ReviewCategoryGrid").data("kendoGrid");
//reviewCategoryGrid.dataSource.read();
var gridItem = $("#ReviewItemGrid");
var gridItemGrid = $("#ReviewItemGrid").data("kendoGrid");
var gridCategory = $("#ReviewCategoryGrid");
var gridCategoryGrid = $("#ReviewCategoryGrid").data("kendoGrid");
var dataAreaCategory = gridCategory.find(".k-grid-content");
var dataArea = gridItem.find(".k-grid-content");
var newGridHeight = 600;
var newDataAreaHeight = newGridHeight - 100;
dataArea.height(newDataAreaHeight);
gridItem.height(newGridHeight);
// gridItemGrid.refresh();
dataAreaCategory.height(newDataAreaHeight);
gridCategory.height(newGridHeight);
// gridCategoryGrid.refresh();
}
This works well when I am clicking directly on the tabs.

However when I want to make it a little more advanced by clicking a button i tab 1, it should load some new data in a grid in tab 2 and tab 2 should be displayed. Here is the code I use for that

function selectReviewCategory(reviewCategoryID, category) {
        reviewCategoryId = reviewCategoryID;
        //reviewCategoryTitle = Title;
        var reviewItemGrid = $("#ReviewItemGrid").data("kendoGrid");
        reviewItemGrid.dataSource.read();
        var tabstrip = $("#tabstrip").data("kendoTabStrip");
        //var tabContent = $("#tabStrip").data("kendoTabStrip").contentElements(0);
        var tabReview = $("#reviewCategoriesTab");
        tabReview.children(".k-link").text(category);
        
         
        tabstrip.select("#reviewItemsTab");
}

This will then trigger the onSelect function.  But the rendering is not working. I have noticed that removing the

reviewItemGrid.dataSource.read(); line the rendering is ok (but of course with no data).

I have tried to move the tabstrip.select statement to the change event of the datasource of the grid. But that did not have an effect. What shall I do ?

Thanks

Ole


 

No answers yet. Maybe you can help?

Tags
Grid
Asked by
Ole
Top achievements
Rank 1
Share this question
or