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

Client Side not rebinding grid

1 Answer 131 Views

Grid

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

Marcel asked on 08 Mar 2011, 04:08 PM

Hello, I am using declaritive client side data binding. I need to rebind the grid when a checkbox (RadButton) is checked. I have verified (using web development helper) that valid JSON is returning from my PageMethods call, but after the tableView.dataBind(); the RadGridPractices_DataBinding function is not invoked and the grid continues to display the old rows and adds the 'No records to display' message at the bottom of the grid. Paging, sorting, filtering all work and i am calling the same webmethod for my rebind. I wonder if it is something to do with the non standard Grid DataBinding parameters? I have looked at various examples and the Client-side binding topic. I am at a loss.

Here is the JSON:

{"d":{"Practices":[{"PracticeID":2,"PTypeID":1,"PracticeDesc":"Storage Tank 1","PracticeType":"Aboveground storage tank","AspectID":4,"luAspectID":3,"Aspect":"Electricity use","ImpactID":0,"luImpactID":0,"Impact":"","IsActive":true,"Score":"11.2","ScoreMax":"55","ScoreAvg":"24.62"},{"PracticeID":2,"PTypeID":1,"PracticeDesc":"Storage Tank 1","PracticeType":"Aboveground storage tank","AspectID":5,"luAspectID":4,"Aspect":"Fire/explosion","ImpactID":0,"luImpactID":0,"Impact":"","IsActive":true,"Score":"55","ScoreMax":"55","ScoreAvg":"24.62"}],"PracticeCount":11}}

Here is some code:

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

<script type="text/javascript">

function RadButtonIncludeAspects_OnClientCheckedChanged(sender, args) {

var aspectsButton = $find("<%= RadButtonIncludeAspects.ClientID %>");

var impactsButton = $find("<%= RadButtonIncludeImpacts.ClientID %>");

if (!aspectsButton.get_checked()) {

// need aspects to select impacts

impactsButton.set_checked(false);

}

var includeAspects = aspectsButton.get_checked().toString();

var includeImpacts = impactsButton.get_checked().toString();

var tableView = $find("<%= RadGridPractices.ClientID %>").get_masterTableView();

var currentPageIndex = tableView.get_currentPageIndex();

var pageSize = tableView.get_pageSize();

var sortExpressions = tableView.get_sortExpressions();

var filterExpressions = tableView.get_filterExpressions();

PageMethods.GetPracticesAndCount(currentPageIndex, pageSize,

"", "", installationID,

installationModifier, environmentalWeight, regulatoryWeight,

publicPerceptionWeight, healthAndSafetyWeight, includeAspects, includeImpacts, bindGrid);

}

function bindGrid(result) {

//debugger;

var tableView = $find("<%= RadGridPractices.ClientID %>").get_masterTableView();

tableView.set_dataSource(result);

tableView.dataBind();

//var grid = $find("<%= RadGridPractices.ClientID %>");

//grid.repaint();

}

function RadGridPractices_OnCommand(sender, args) {

// Handle the RadGrid's Command event here

}

function RadGridPractices_OnRowDataBound(sender, args) {

//debugger;

if (args.get_dataItem()['Score'] >= 18) {

args.get_item().get_cell('column').style.color='#FF3300';

args.get_item().get_cell('PracticeType').style.color='#FF3300';

args.get_item().get_cell('PracticeDesc').style.color='#FF3300';

args.get_item().get_cell('Aspect').style.color='#FF3300';

args.get_item().get_cell('Impact').style.color='#FF3300';

args.get_item().get_cell('Score').style.color='#FF3300';

args.get_item().get_cell('ScoreAvg').style.color='#FF3300';

args.get_item().get_cell('ScoreMax').style.color='#FF3300';

}

else if (args.get_dataItem()['Score'] >= 11) {

args.get_item().get_cell('column').style.color='#FF9900';

args.get_item().get_cell('PracticeType').style.color='#FF9900';

args.get_item().get_cell('PracticeDesc').style.color='#FF9900';

args.get_item().get_cell('Aspect').style.color='#FF9900';

args.get_item().get_cell('Impact').style.color='#FF9900';

args.get_item().get_cell('Score').style.color='#FF9900';

args.get_item().get_cell('ScoreAvg').style.color='#FF9900';

args.get_item().get_cell('ScoreMax').style.color='#FF9900';

}

else if (args.get_dataItem()['Score'] >= 7) {

args.get_item().get_cell('column').style.color='#00CC00';

args.get_item().get_cell('PracticeType').style.color='#00CC00';

args.get_item().get_cell('PracticeDesc').style.color='#00CC00';

args.get_item().get_cell('Aspect').style.color='#00CC00';

args.get_item().get_cell('Impact').style.color='#00CC00';

args.get_item().get_cell('Score').style.color='#00CC00';

args.get_item().get_cell('ScoreAvg').style.color='#00CC00';

args.get_item().get_cell('ScoreMax').style.color='#00CC00';

}

else {

args.get_item().get_cell('column').style.color='#000000';

args.get_item().get_cell('PracticeType').style.color='#000000';

args.get_item().get_cell('PracticeDesc').style.color='#000000';

args.get_item().get_cell('Aspect').style.color='#000000';

args.get_item().get_cell('Impact').style.color='#000000';

args.get_item().get_cell('Score').style.color='#000000';

args.get_item().get_cell('ScoreAvg').style.color='#000000';

args.get_item().get_cell('ScoreMax').style.color='#000000';

}

function RadGridPractices_DataBinding(sender, args) {

alert('databinding');

var aspectsButton = $find("<%= RadButtonIncludeAspects.ClientID %>");

var includeAspects = aspectsButton.get_checked().toString();

var impactsButton = $find("<%= RadButtonIncludeImpacts.ClientID %>");

var includeImpacts = impactsButton.get_checked().toString();

var methodArguments = args.get_methodArguments();

var myMethodArguments = methodArguments;

myMethodArguments.installationID = installationID;

myMethodArguments.installationModifier = installationModifier;

myMethodArguments.environmentalWeight = environmentalWeight;

myMethodArguments.regulatoryWeight = regulatoryWeight;

myMethodArguments.publicPerceptionWeight = publicPerceptionWeight;

myMethodArguments.healthAndSafetyWeight = healthAndSafetyWeight;

myMethodArguments.includeAspects = includeAspects;

myMethodArguments.includeImpacts = includeImpacts;

args.set_methodArguments(myMethodArguments);

};

function RadGridPractices_OnRowSelected(sender, args) {

// alert('TODO: Highlight associated Commands and Locations');

};

function RadGridPractices_OnRowDeselected(sender, args) {

// alert('TODO: Highlight associated Commands and Locations');

};

</script>

</telerik:RadCodeBlock>

<table style="width: 100%;">

<tr>

<td>

<telerik:RadButton ID="RadButtonIncludeAspects" runat="server"

ButtonType="ToggleButton" Text="Include Aspects" ToggleType="CheckBox"

Checked="True"

onclientcheckedchanged="RadButtonIncludeAspects_OnClientCheckedChanged"

AutoPostBack="False">

</telerik:RadButton>

<telerik:RadButton ID="RadButtonIncludeImpacts" runat="server"

ButtonType="ToggleButton" Text="Include Impacts" ToggleType="CheckBox"

Checked="True"

OnClientCheckedChanged="RadButtonIncludeImpacts_OnClientCheckedChanged"

AutoPostBack="False">

</telerik:RadButton>

</td>

</tr>

<tr>

<td>

<telerik:RadGrid ID="RadGridPractices" runat="server" AllowPaging="True"

GridLines="None" PageSize="2" AllowFilteringByColumn="True"

AllowSorting="True" AllowMultiRowSelection="True">

<HeaderContextMenu CssClass="GridContextMenu GridContextMenu_Default"></HeaderContextMenu>

<MasterTableView AutoGenerateColumns="False">

<CommandItemSettings ExportToPdfText="Export to Pdf"></CommandItemSettings>

<RowIndicatorColumn FilterControlAltText="Filter RowIndicator column">

<HeaderStyle Width="20px"></HeaderStyle>

</RowIndicatorColumn>

<ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column">

<HeaderStyle Width="20px"></HeaderStyle>

</ExpandCollapseColumn>

<Columns>

<telerik:GridClientSelectColumn FilterControlAltText="Filter column column"

UniqueName="column">

</telerik:GridClientSelectColumn>

<%-- <telerik:GridBoundColumn DataField="PracticeID" DataType="System.Int32"

FilterControlAltText="Filter PracticeID column" HeaderText="ID"

ReadOnly="True" SortExpression="PracticeID" UniqueName="PracticeID">

</telerik:GridBoundColumn>--%>

<telerik:GridBoundColumn DataField="PracticeType"

FilterControlAltText="Filter PracticeType column" HeaderText="Practice Type"

ReadOnly="True" SortExpression="PracticeType" UniqueName="PracticeType">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="PracticeDesc"

FilterControlAltText="Filter PracticeDesc column" HeaderText="Practice"

ReadOnly="True" SortExpression="PracticeDesc" UniqueName="PracticeDesc">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Aspect"

FilterControlAltText="Filter Aspect column" HeaderText="Aspect"

ReadOnly="True" SortExpression="Aspect" UniqueName="Aspect">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Impact"

FilterControlAltText="Filter Impact column" HeaderText="Impact"

ReadOnly="True" SortExpression="Impact" UniqueName="Impact">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Score"

FilterControlAltText="Filter Score column" HeaderText="Score"

ReadOnly="True" SortExpression="Score" UniqueName="Score">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="ScoreAvg"

FilterControlAltText="Filter ScoreAvg column" HeaderText="Avg"

ReadOnly="True" SortExpression="ScoreAvg" UniqueName="ScoreAvg">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="ScoreMax"

FilterControlAltText="Filter ScoreMax column" HeaderText="Max"

ReadOnly="True" SortExpression="ScoreMax" UniqueName="ScoreMax">

</telerik:GridBoundColumn>

</Columns>

<EditFormSettings>

<EditColumn FilterControlAltText="Filter EditCommandColumn column"></EditColumn>

</EditFormSettings>

</MasterTableView>

<ClientSettings>

<DataBinding Location="PAI.aspx"

SelectMethod="GetPracticesAndCount" FilterParameterType="Linq"

CountPropertyName="PracticeCount" DataPropertyName="Practices"

FilterParameterName="filterExpressions" MaximumRowsParameterName="rowCount"

SortParameterName="sortExpressions" SortParameterType="Linq"

StartRowIndexParameterName="startIndex">

</DataBinding>

<Selecting AllowRowSelect="True" EnableDragToSelectRows="true" />

<ClientEvents OnDataBinding="RadGridPractices_DataBinding"

OnRowSelected="RadGridPractices_OnRowSelected"

OnRowDeselected="RadGridPractices_OnRowDeselected"

OnRowDataBound="RadGridPractices_OnRowDataBound"

OnCommand="RadGridPractices_OnCommand" />

</ClientSettings>

<FilterMenu EnableImageSprites="False"></FilterMenu>

</telerik:RadGrid>

</td>

</tr>

</table>

Client Side not rebinding grid

1 Answer, 1 is accepted