Questions on UI for ASP.NET AJAX Forum

3 answers

2.1K+ views

Hi,

Please excuse my confusion on this! What I am attempting to do is to place a checkbox column in a grid, allow the user to select one or more checkboxes, then have a button on the page that kicks off an Ajax call to the code behind. The code behind would loop through the grid and if the checkbox for that row is checked read a column that contains the unique key value and do something with it. I have tried with the various column types to no avail, maybe I have a setting wrong...not sure. Anyway can someone provide some assistance?

Here is what my simple test column looks like...the second column is the ID column
<telerik:RadGrid ID="RadGridAdHoc" runat="server" Width="100%" Height="160px" CssClass="center" AllowPaging="true" AllowSorting="true" AllowCustomPaging="False" PageSize="30" EnableAJAX="False" EnableAJAXLoadingTemplate="true" EnableEmbeddedSkins='true' Skin="Office2007" EnableViewState='false'>
<PagerStyle AlwaysVisible='true' Mode='NextPrevAndNumeric' />
<ClientSettings>
<ClientEvents />
<Selecting AllowRowSelect="true" EnableDragToSelectRows="false" UseClientSelectColumnOnly='true' />
<Scrolling UseStaticHeaders="True" AllowScroll="true" SaveScrollPosition="false" />
<Resizing AllowColumnResize="False" />
</ClientSettings>
<MasterTableView AllowAutomaticUpdates="true" AutoGenerateColumns="false" AllowMultiColumnSorting="False" TableLayout="fixed" >
<Columns>
<telerik:GridTemplateColumn HeaderText="Select" UniqueName="ConfirmOrder" DataField='DataIDValue'>
<ItemTemplate>
<asp:CheckBox ID="CheckBox1" runat="server" />
</ItemTemplate>
</telerik:GridTemplateColumn>
<telerik:GridBoundColumn DataField="DataIDValue" UniqueName="DataIDValue" Display='false'>
</telerik:GridBoundColumn>

</Columns>

</MasterTableView>
</telerik:RadGrid>

Here is what is in my code behind looks like..The ajax call on the button click works fine and it gets the the sub holding the code below however it does not ever enter the loop....the RadGridAdHoc.MasterTableView.Items count = 0 so skips over it.

For Each item As GridDataItem In RadGridAdHoc.MasterTableView.Items
For Each col As GridColumn In RadGridAdHoc.MasterTableView.RenderColumns
If col.UniqueName = "Confirm" Then
Dim chkbx As CheckBox = DirectCast(item("ConfirmOrder").Controls(0), CheckBox)
If chkbx.Checked = True Then
'Get ID value from row with checked checkbox
'How do I get the value if the DataID column here?
End If
End If
Next
Next

I guess also not really sure what column type is best to use...I have tried the GridCheckBoxColumn and the GridClientSelectColumn without success....and now GridTemplateColumn.....the maybe one type is better to use?

How can I retrieve the value of the DataID column once the checkbox is identified as checked?

Any assistance anyone could provide would be greatly appreciated! Thanks in advance,

Kelvin

Grid

answered on 25 Sep 2012

6 answers

972 views

How to set Cell to ReadOnly

Hi,

I'm trying to set various properties of cells conditionally in the ItemDataBound event. So far I've been able to get values and adjust their styles, but have not found a ReadOnly property in the GridDataItem.

Here is my test code within RadGrid1_ItemDataBound...

if (e.Item is GridDataItem)

{

foreach (DataRow row in Headers.Rows)

{

String columnName = row[0].ToString();

String groupColumnHeader = row[1].ToString();

String columnHeader = row[2].ToString();

String attributeType = row[3].ToString();

String targetValue = row[4].ToString();

GridDataItem gridRow = (GridDataItem)e.Item;

String ReportID = gridRow.GetDataKeyValue("report_id").ToString();

if (ReportID.Equals(today) && attributeType.Equals("ManualEntry")) // report_id is a string in the format "yyyyMMdd"

{

gridRow[columnName].BorderColor = System.Drawing.Color.Green;

gridRow[columnName].BorderWidth = new Unit("1px");

columnValue = ((DataRowView)gridRow.DataItem)[columnName].ToString();

Label1.Text += "GridDataItem::columnName=" + columnName + "::columnValue=" + columnValue + " <br>";

}

else if (attributeType.Equals("ManualEntry"))

{

gridRow[columnName].BackColor = System.Drawing.Color.LightGray;

//gridRow[columnName].ReadOnly = false;

}

Thanks,
David

Grid

answered on 25 Sep 2012

4 answers

106 views

Client-Side paging not working in telerik radgrid

I am binding radgrid in client-side with AllowPagging="true" and page-size=5. My requirement is to hide the paging panel if there are 5 or less than 5 records (or you can say if there is only one page).

For this i have tried PagerStyle-AlwaysVisible="true". It works well if there are 5 or less than 5 records. But if the number of records are 8 then i will display 2 page. First page displays 5 records and the second page display 3 records.

Now, the problem is on second page it hides the paging panel because the number of records are less than 5.

Grid

answered on 25 Sep 2012

4 answers

102 views

Remove slider item client-side?

Is it possible to remove an item from a slider via Javascript? Essentially, I'm looking for a way to limit the number of slider items based on the user's screen resolution but can't figure out how to remove a slider item and have it repaint correctly. Any help is greatly appreciated!

Slider

answered on 25 Sep 2012

1 answer

105 views

WCF Client Side Grid Binding

Hello,

I am trying to bind a WCF service to my grid (client side). I believe I have checked all the boxes to make this happen but what I see in a grid with empty rows (which match the # of rows returned).

I added a break point at the radgrid_databinding event and at that point the grid says "11 items in 2 pages" but once I click OK on the alert message the grid says No Items to be Displayed.

What am I missing here? Your response will be greatly appreciated. I have gone through every example and followed it as well as I could.

The JSON response in my Firebug returns the following

GetPublisherQueueResult: {Count:11,…}
1. Count: 11
2. Data: [{Delimeter:|, FileNamePrefix:GLB_CON_EOD_, Id:2, Name:EOD Constituent,…},…]
  1. 0: {Delimeter:|, FileNamePrefix:GLB_CON_EOD_, Id:2, Name:EOD Constituent,…}
  2. 1: {Delimeter:|, FileNamePrefix:GLB_IDX_EOD_, Id:3, Name:EOD Index,…}
  3. 2: {Delimeter:|, FileNamePrefix:GLB_IDX_DIV_EOD_, Id:4, Name:EOD Divisor,…}
  4. 3: {Delimeter:|, FileNamePrefix:GLB_IDX_DIV_SOD_, Id:5, Name:NSOD Divisor,…}
  5. 4: {Delimeter:|, FileNamePrefix:GLB_CON_SOD_, Id:6, Name:SOD Constituent,…}
  6. 5: {Delimeter:|, FileNamePrefix:GLB_IDX_CHG_, Id:7, Name:Change,…}
  7. 6: {Delimeter:|, FileNamePrefix:GLB_CON_EOD_, Id:8, Name:EOD Constituent,…}
  8. 7: {Delimeter:|, FileNamePrefix:GLB_IDX_EOD_, Id:9, Name:Index,…}
  9. 8: {Delimeter:|, FileNamePrefix:GLB_IDX_DIV_EOD_, Id:10, Divisor,…}
  10. 9: {Delimeter:|, FileNamePrefix:GLB_IDX_DIV_SOD_, Id:11, Divisor,…}
  11. 10: {Delimeter:|, FileNamePrefix:GLB_CON_SOD_, Id:12, Name:Constituent,…}

Here are my code snippets:

ASPX

<telerik:RadGrid ID="PublisherGrid" runat="server" AllowSorting="true" AllowPaging="true" AllowMultiRowSelection="true" AutoGenerateColumns="false">

<MasterTableView ShowFooter="false" ItemStyle-Height="30px" AlternatingItemStyle-Height="30px">

<Columns>

<telerik:GridClientSelectColumn UniqueName="Select" ItemStyle-Width="30px" HeaderStyle-Width="30px"></telerik:GridClientSelectColumn>

<telerik:GridBoundColumn HeaderText="Id" ItemStyle-Width="30px" HeaderStyle-Width="30px" DataField="Id" HeaderStyle-Wrap="false" ItemStyle-Wrap="false"/>

<telerik:GridBoundColumn HeaderText="Name" DataField="Name" HeaderStyle-Wrap="false" ItemStyle-Wrap="false"/>

<telerik:GridBoundColumn HeaderText="FileNamePrefix" ItemStyle-Width="120px" HeaderStyle-Width="120px" DataField="FileNamePrefix" HeaderStyle-Wrap="false" ItemStyle-Wrap="false" />

<telerik:GridBoundColumn HeaderText="Delimeter" ItemStyle-Width="70px" HeaderStyle-Width="70px" DataField="Delimeter" HeaderStyle-Wrap="false" ItemStyle-Wrap="false" ItemStyle-HorizontalAlign="Center"/>

<telerik:GridBoundColumn HeaderText="OutputLocation" DataField="OutputLocation" HeaderStyle-Wrap="false" ItemStyle-Wrap="false" />

<telerik:GridBoundColumn HeaderText="TimeStamp" ItemStyle-Width="120px" HeaderStyle-Width="120px" DataField="TimeStamp" HeaderStyle-Wrap="false" ItemStyle-Wrap="false" />

<telerik:GridBoundColumn HeaderText="Status" ItemStyle-Width="70px" HeaderStyle-Width="70px" DataField="Status" HeaderStyle-Wrap="false" ItemStyle-Wrap="false" ItemStyle-HorizontalAlign="Center"/>

</Columns>

<PagerStyle Mode="NextPrevAndNumeric" Position="Bottom" AlwaysVisible="true"></PagerStyle>

</MasterTableView>

<ClientSettings EnableRowHoverStyle="true">

<Selecting AllowRowSelect="true"/>

<Resizing AllowColumnResize="true"/>

<DataBinding SelectMethod="GetPublisherQueue"

Location="http://localhost/Oyster.WCF/publisher.svc">

</DataBinding>

<ClientEvents OnDataBinding="RadGrid1_DataBinding" OnDataBindingFailed="function () {alert('binding failed');}" />

</ClientSettings>

<SelectedItemStyle CssClass="SelectedItem" />

</telerik:RadGrid>

This is the WCF code :

[ServiceContract]

public interface IPublisher

{

[OperationContract(Name = "GetPublisherQueue")]

[WebInvoke(Method="POST"

, RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json, BodyStyle = WebMessageBodyStyle.Wrapped)]

PublisherQueueData GetPublisherQueue(int startRowIndex, int maximumRows);

}

[DataContract]

public class PublisherQueue

{

[DataMember]

public int Id { get; set; }

[DataMember]

public String Name { get; set; }

[DataMember]

public String FileNamePrefix { get; set; }

[DataMember]

public String Delimeter { get; set; }

[DataMember]

public String OutputLocation { get; set; }

[DataMember]

public String TimeStamp { get; set; }

[DataMember]

public String Status { get; set; }

}

public class PublisherQueueData

{

public int Count

{

get;

set;

}

public List<PublisherQueue> Data

{

get;

set;

}

/////

[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]

[KnownType(typeof(PublisherQueue))]

public class Publisher : IPublisher

{

List<PublisherQueue> publisherQueueList = new List<PublisherQueue>();

PublisherQueueData publisherQueueData = new PublisherQueueData();

public PublisherQueueData GetPublisherQueue(int startRowIndex, int maximumRows)

{

PopulatePublisherQueue();

publisherQueueData.Data = publisherQueueList;

publisherQueueData.Count = publisherQueueList.Count;

return publisherQueueData;

}

private void PopulatePublisherQueue()

{

Morningstar.Indexes.ETL.PublisherDataAccess publisherDataAccess = new PublisherDataAccess();

using (DataTable publisherQueueDataTable = publisherDataAccess.GetPublisherData())

{

for(int i = 0; i < publisherQueueDataTable.Rows.Count - 1; i++)

{

PublisherQueue publisherQueueRecord = new PublisherQueue();

publisherQueueRecord.Id = Convert.ToInt32(publisherQueueDataTable.Rows[i]["PUBLISHER_ID"]);

publisherQueueRecord.Name = publisherQueueDataTable.Rows[i]["PUBLISHER_NAME"].ToString();

publisherQueueRecord.FileNamePrefix = publisherQueueDataTable.Rows[i]["FILE_NAME"].ToString();

publisherQueueRecord.OutputLocation = publisherQueueDataTable.Rows[i]["OUTPUT_LOCATION"].ToString();

publisherQueueRecord.Delimeter = publisherQueueDataTable.Rows[i]["DELIMETER"].ToString();

publisherQueueRecord.TimeStamp = publisherQueueDataTable.Rows[i]["PUBLISH_TIMESTAMP"].ToString();

publisherQueueRecord.Status = publisherQueueDataTable.Rows[i]["STATUS"].ToString();

publisherQueueList.Add(publisherQueueRecord);

}

Grid

answered on 24 Sep 2012

8 answers

94 views

Change Group Item Skin

Is it possible in the GroupItemDataBound event to change the skin, background-image or anything of a specific item? I have found away to identify the item i want to change and can add a border to it, however i would like to change the background image. Is this possible using c# or js?

OrgChart

answered on 24 Sep 2012

1 answer

87 views

radtooltip in a composite control

I am trying to put RadToolTip in a composite control.. here is the code that I am trying to build....

public class OCToolTip : CompositeControl

{

private RadToolTip tip;

private Image image;

[Localizable(false)]

protected override void CreateChildControls()

{

this.Controls.Clear();

tip = new RadToolTip();

image = new Image();

image.CssClass = "helpImage";

this.Controls.Add(image);

this.Controls.Add(tip);

tip.TargetControlID = image.ID;

tip.IsClientID = true;

tip.ShowEvent = ToolTipShowEvent.OnClick;

tip.OnClientBeforeShow = "ShowToolTip";

}

protected override void Render(HtmlTextWriter writer)

{

AddAttributesToRender(writer);

tip.RenderControl(writer);

}

It shows up the image but is not accepting the client click event. Any ideas what is wrong?

Thanks
SK

PS: I also tried to create a user control for RadToolTip but that did not work, the idea is that I need to use a help icon in various parts of my program and want to use radtooltip for that, is there an alternate solution?

ToolTip

answered on 24 Sep 2012

12 answers

189 views

Hide image when exporting grid to PDF

Good afternoon,
I have created a image inside a column in code behind file:

protected

void CfnReportGrid_PreRender(object sender, EventArgs e)

{

RadGrid CFNGrid = (RadGrid)CfnReport.FindItemByValue("CfnDataRpt").FindControl("CfnReportGrid");

GridHeaderItem headerItem = (GridHeaderItem)CFNGrid.MasterTableView.GetItems(GridItemType.Header)[0];

Image img = new Image();

img.ID =

"PRImg";

img.ImageUrl =

"~/Image/Header_Info.jpg";

img.ImageAlign =

ImageAlign.Bottom;

img.ToolTip =

"Employee FileNo";

img.Width =

new Unit(10);

img.Height =

new Unit(9);

headerItem[

"EIS_ID"].Controls.AddAt(1, img);

When I export this grid to PDF I want to hide this image.In ItemCreated event I try to do this:

protected

void CfnReportGrid_ItemCreated(object sender, GridItemEventArgs e)

if(IsExport)

RadGrid

CFNGrid = (RadGrid)CfnReport.FindItemByValue("CfnDataRpt").FindControl("CfnReportGrid");

GridHeaderItem headerItem = (GridHeaderItem)CFNGrid.MasterTableView.GetItems(GridItemType.Header)[0];

Image img = (Image)headerItem.FindControl("PRImg");

img.Visible =

false;

But gettin runtime error:
Object reference not set to an instance of an object.

Please help me to resolve this issue.
Thanks so much

General Discussions

answered on 24 Sep 2012

9 answers

1.3K+ views

RadGrid Insert Command

Hi,

I am very new to asp.net and telerik so I apologize. I need help and I am not sure how to get this accomplished. Here is what I got. I have two radgrids one is being controlled by the other. the first grid will display a list of patients a therapist has on their case load. the second grid will display a list of visits each patient has. so the visits grid is be controlled by the selected value of the patient grid by PaitentID. Ok here is my problem when I add a visit for a patient I don't know how to automatically populate the patientID for the visit from the selected value on the patient grid. So I am not sure how to go about this so any help would be greatly appreciated. thanks

Grid

answered on 24 Sep 2012

7 answers

1.4K+ views

onbeforeunload - called on every postback / ajax request

Hi..
I'm trying to use onbeforeunload to check if the user is exiting a form before saving changes.
I'm using the AjaxPanel - But onbeforeunload is called on every single ajax request.
How can I test if the pages is REALLY being unloaded ? Help...........
thanks again!!!!!!

Ajax

answered on 24 Sep 2012