Questions on UI for ASP.NET AJAX Forum

1 answer

89 views

Inserting new row from added boundcolumn

Hi,

I have a dropdown combobox which have 3 table listed. Each different selection will cause a selectedindexchanged event handler which reload the grid. There's 2 column declared on the front end: GridEditCommandColumn(edit) and GridButtonColumn(delete). Each time the grid is loaded or reloaded, a random number of boundcolumn are added to the grid based on the number of column from the selected table(from the combobox). All works fine except the edit and add row function. When I click add a new row, a textbox is added(in line) on the grid, for each column(except the edit and delete). After I enter value into the textbox, I can't seem to grab this value in the code behind.

Here's my code:

Private Sub LoadRadGrid(ByVal selectedTable As String, ByVal loadType As String)

Dim ds As DataSet = New DataSet

Dim ConnString As String = ConfigurationManager.ConnectionStrings("SqlConn").ConnectionString

Dim conn As SqlConnection = New SqlConnection(ConnString)

Dim adapter As SqlDataAdapter = New SqlDataAdapter

Dim sqlString As String = "SELECT ID, Iron, Name, Type FROM JOE_Coffee"

If selectedTable = "JOE_Coffee" Then

sqlString = "SELECT ID, Iron, Name, Type FROM JOE_Coffee"

ElseIf selectedTable = "JOE_Cake" Then

sqlString = "SELECT ID, Name FROM JOE_Cake"

ElseIf selectedTable = "JOE_Tip" Then

sqlString = "SELECT ID, Name FROM JOE_Tip"

End If

adapter.SelectCommand = New SqlCommand(sqlString, conn)

Try

adapter.Fill(ds, "Table1")

For Each column As GridColumn In RadGrid1.MasterTableView.RenderColumns

'If Not column.UniqueName = "EditCommandColumn" Then

'End If

If column.ColumnType = "GridBoundColumn" Then

Dim columnIndex As Integer = column.OrderIndex

RadGrid1.MasterTableView.Columns.Remove(column)

End If

Next

For i As Integer = 0 To ds.Tables(0).Columns.Count - 1

Dim boundColumn(i) As GridBoundColumn

boundColumn(i) = New GridBoundColumn()

boundColumn(i).HeaderText = ds.Tables(0).Columns(i).ColumnName

boundColumn(i).DataField = ds.Tables(0).Columns(i).ColumnName

boundColumn(i).UniqueName = ds.Tables(0).Columns(i).ColumnName

boundColumn(i).IsBoundToFieldName(ds.Tables(0).Columns(i).ColumnName)

RadGrid1.MasterTableView.Columns.Add(boundColumn(i))

Next

If loadType = "PageLoad" Or loadType = "LoadAfterDelete" Or loadType = "SelectedIndexChangeLoad" Then

RadGrid1.DataSource = ds

RadGrid1.DataBind()

ElseIf loadType = "LoadAfterInsert" Or loadType = "LoadAfterUpdate" Then

'RadGrid1.MasterTableView.Columns.Clear()

RadGrid1.DataSource = ds

RadGrid1.Rebind()

ElseIf loadType = "NeedDataSourceLoad" Then

RadGrid1.DataSource = ds

'Don't need to bind for "NeedDataSourceLoad"

End If

For Each column As GridColumn In RadGrid1.Columns

If column.HeaderText = "ID" Then

column.Visible = False

End If

Next

Catch ex As Exception

End Try

End Sub

Protected Sub RadGrid1_CreateColumnEditor(ByVal sender As Object, ByVal e As Telerik.Web.UI.GridCreateColumnEditorEventArgs) Handles RadGrid1.CreateColumnEditor

If (TypeOf e.Column Is GridBoundColumn) Then

e.ColumnEditor = New GridTextBoxColumnEditor

End If

End Sub

Protected Sub RadGrid1_InsertCommand(ByVal source As Object, ByVal e As GridCommandEventArgs) Handles RadGrid1.InsertCommand

selectedTable = rcbTableName.SelectedValue.ToString()

Dim iron As String = ""

Dim name As String = ""

Dim type As String = ""

Dim ConnString As String = ConfigurationManager.ConnectionStrings("NineFiveSqlConn").ConnectionString

Dim conn As SqlConnection = New SqlConnection(ConnString)

Dim cmd As New SqlCommand()

cmd.Connection = conn

Dim sqlString As String = "INSERT INTO JMOS_Satellite(Iron, Name, Type) VALUES(@Iron, @Name, @Type)"

If selectedTable = "JMOS_Satellite" Then

sqlString = "INSERT INTO JMOS_Satellite(Iron, Name, Type) VALUES(@Iron, @Name, @Type)"

ElseIf selectedTable = "JMOS_UplinkBeam" Then

sqlString = "INSERT INTO JMOS_UplinkBeam(Name) VALUES(@Name)"

ElseIf selectedTable = "JMOS_UplinkChannel" Then

sqlString = "INSERT INTO JMOS_UplinkChannel(Name) VALUES(@Name)"

End If

cmd.CommandType = CommandType.Text

cmd.CommandText = sqlString

'<<<Need value to set parameter for insert>>>

cmd.Parameters.Add("@Iron", SqlDbType.VarChar)

cmd.Parameters("@Iron").Value = iron

cmd.Parameters.Add("@Name", SqlDbType.VarChar)

cmd.Parameters("@Name").Value = name

cmd.Parameters.Add("@Type", SqlDbType.VarChar)

cmd.Parameters("@Type").Value = type

Try

If Not conn.State = ConnectionState.Open Then

conn.Open()

cmd.ExecuteNonQuery()

End If

Catch ex As Exception

e.Canceled = True

Finally

If Not conn.State = ConnectionState.Closed Then

conn.Close()

End If

End Try

loadType = "LoadAfterInsert"

LoadRadGrid(selectedTable, loadType)

End Sub

Here's the front end:

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="PageOne.aspx.vb" Inherits="WebRadGridDynamic.PageOne" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

</head>

<body>

<form id="form1" runat="server">

<telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server">

</telerik:RadStyleSheetManager>

<div align="center">

<br />

<telerik:RadComboBox ID="rcbTableName" runat="server" DataTextField="TableName"

DataValueField="ID" AutoPostBack="true"

OnSelectedIndexChanged="RadComboBox1_SelectedIndexChanged" Skin="Black" Width="200px">

<Items>

<telerik:RadComboBoxItem Value="JMOS_Satellite" Text="Satellite" Selected="true" />

<telerik:RadComboBoxItem Value="JMOS_UplinkBeam" Text="Uplink Beam" />

<telerik:RadComboBoxItem Value="JMOS_UplinkChannel" Text ="Uplink Channel" />

</Items>

</telerik:RadComboBox>

<br />

<telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager>

<br />

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

<script type="text/javascript">

function RowDblClick(sender, eventArgs) {

sender.get_masterTableView().editItem(eventArgs.get_itemIndexHierarchical());

}

</script>

</telerik:RadCodeBlock>

<br />

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadGrid1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadGrid1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<br />

<telerik:RadGrid ID="RadGrid1" runat="server" Width="500px" GridLines="None" PageSize="13"

AllowSorting="True" AllowPaging="True" ShowStatusBar="True" Skin="Black" Height="225px" AutoGenerateColumns="False" >

<AlternatingItemStyle HorizontalAlign="Left" />

<MasterTableView DataKeyNames="ID" AllowMultiColumnSorting="True" Width="100%"

CommandItemDisplay="Top" EditMode="InPlace" >

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

<Columns>

<telerik:GridEditCommandColumn UpdateText="Update" UniqueName="EditCommandColumn"

CancelText="Cancel" EditText="Edit">

<HeaderStyle />

<ItemStyle Width="20px" />

</telerik:GridEditCommandColumn>

<telerik:GridButtonColumn UniqueName="DeleteColumn" Text="Delete"

CommandName="Delete" ConfirmTitle="Delete" ConfirmDialogType="Classic" ConfirmDialogHeight="60" ConfirmDialogWidth ="150" ConfirmText="Are you sure you want to delete row?" >

<HeaderStyle />

<ItemStyle Width="20px" />

</telerik:GridButtonColumn>

</Columns>

<EditFormSettings CaptionFormatString="Edit details ID {0}" CaptionDataField="ID">

<FormTableItemStyle Width="100%" Height="29px"></FormTableItemStyle>

<FormTableStyle GridLines="None" CellSpacing="0" CellPadding="2"></FormTableStyle>

<FormStyle Width="100%" BackColor="#eef2ea"></FormStyle>

<EditColumn ButtonType="ImageButton" />

</EditFormSettings>

</MasterTableView>

<ClientSettings AllowColumnHide="True">

<ClientEvents OnRowDblClick="RowDblClick" />

<Scrolling AllowScroll="true" UseStaticHeaders="true" />

</ClientSettings>

<EditItemStyle />

<HeaderStyle HorizontalAlign="Center" />

<SelectedItemStyle />

<ItemStyle HorizontalAlign="Left" />

</telerik:RadGrid>

<br />

</div>

<div >

</div>

</form>

</body>

</html>

Grid

answered on 18 Nov 2010

9 answers

210 views

[Solved] Is RADEditor really WYSIWYG?

Hi Telerik,

I'm using Telerik Version Q3 2008 (2008.3.1105). Why does the text in RADEditor not get displayed as it is?

For example, while editing some text inside RADEditor, I specifically change the text to COURIER NEW and I know that it gets saved in the database in such a font. But when it get's displayed, not only does it change the font to something that is not COURIER NEW, it also changes the font-size. When I go back to RADEditor, you see the text again as how I formatted it.

Clearly, What I see is not what I get.

Is this a known bug? And has this been fixed in the next version after what we have Version Q2 2009 (2009.2.826) ?

Please advise.

Thanks,
Virgil

Editor

answered on 18 Nov 2010

1 answer

248 views

RadAjaxManager Request Aborted

Hi,

I'm running into an odd problem where my long-running ajax request is being aborted. The aspx page is as follows:

<form id="form1" runat="server">

<telerik:RadScriptManager ID="ScriptManager" runat="server" />

<telerik:RadAjaxManager id="RadAjaxManager1" runat="server" RequestQueueSize="100" OnAjaxRequest="AjaxManager_OnRequest" ClientEvents-OnRequestStart="onRequestStart();" ClientEvents-OnResponseEnd="closeWindow();">

</telerik:RadAjaxManager>

<script language="javascript" type="text/javascript">

function onRequestStart() {

alert('Ajax request starting');

}

function closeWindow() {

var win = window.frameElement.radWindow;

win.BrowserWindow.redirect_to_default();

}

</script>

<telerik:RadAjaxPanel ID="RadAjaxPanel" runat="server">

</telerik:RadAjaxPanel>

<telerik:RadProgressManager ID="ProgressManager" EnableMemoryOptimization="true" runat="server" />

<telerik:RadProgressArea ID="ProgressArea" runat="server" Skin="Windows7" />

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

<script language="javascript" type="text/javascript">

var isRunOnce = false;

function pageLoad() {

if (!isRunOnce) {

var manager = $find("<%= RadAjaxManager1.ClientID %>");

if (manager)

manager.ajaxRequest('<%=Request.QueryString["g"] %>');

isRunOnce = true;

}

</script>

</telerik:RadCodeBlock>

</form>

However, every time the page executes the progress bar gets to 35% (it takes it a few minute to get there) and then Firebug shows that the request has been aborted.

I don't believe another request is starting because the onRequestStart() method is only executed once.. but closeWindow() method is executed (right after Firebug displays the 'aborted' status)

Does anybody have any ideas what could be causing this?

Thanks.

- Chris

Ajax

answered on 18 Nov 2010

2 answers

102 views

Insert JS defined tab image

Our site uses power reviews and we are going to be testing a new details page with tabbed content. We'd like to have one of the tabs have the star rating image for that product instead of text. The reviews call to make that image is:

<script type="text/javascript">POWERREVIEWS.display.snippet(document, { pr_page_id : "PAGE_ID" });</script>

PAGE_ID is a token that gets replaced by the sku # by the vb.net code behind.

Can I get some suggestions on how to add this to the radTab?

TabStrip

answered on 18 Nov 2010

7 answers

614 views

How to Clear Rad Upload Files after Uploading

Hi Telerik

I am using RadUpload Control, I have problem that everytime I upload files, those files remain in uploadfiles method or array.
I want to clear those previous files name once they uploded. when ever I upload one file and save file info into database then if I try to refresh the page then the file previously uploaded will be uploaded again.

I want to delete uploaded files from memory. I mean to say How can I clear the Files from Rad upload memory or How to Clear RadControl Control after Successfully uploading the Files.

Please Help!!!!

Munendra Maheshwari

Upload (Obsolete)

answered on 18 Nov 2010

2 answers

116 views

Weekview disable passed dates

Hi there

How do I prevent the user to enter appointments in a weekview for times that have already past?

I don't want the user to be able to enter appointments prior to date.time.now.

How do I go about it. Is it possible to color the passt times in a weekview differently.?

Regards Markus

Scheduler

answered on 18 Nov 2010

2 answers

153 views

slot selection with dragging over the time slot area in ASP.NET MVC

Hello,

I really like your demo with slot selection with dragging over the time slot area, however I could not find the way how to use this functionality in ASP.NET MVC.
I'm using OnClientTimeSlotContextMenuItemClicked="TimeSlotContextMenuItemClicked" event, but I can find only starttime in eventArgs. Can You please suggest me, how to obtain end time in selected slot area?

function TimeSlotContextMenuItemClicked(sender, eventArgs) {
var type = eventArgs.get_item().get_value();

var time = eventArgs.get_slot().get_startTime().format('dd/MM/yyyy H:mm');
}

radScheduler settings:

<telerik:RadScheduler runat="server" ID="RadScheduler1" AllowDelete="false" AllowEdit="true" OnClientRequestFailed="requestFailed" EnableExactTimeRendering="true"

           RowHeight="16px" AllowInsert="false" MinutesPerRow="15" StartEditingInAdvancedForm="false"

           StartInsertingInAdvancedForm="false" OnClientAppointmentDoubleClick="OnClientAppointmentDoubleClick"

           OnClientTimeSlotContextMenuItemClicked="TimeSlotContextMenuItemClicked" OnClientTimeSlotClick="OnClientTimeSlotClick"

           OnClientAppointmentDeleting="OnClientAppointmentDeleting" OnClientAppointmentDataBound="OnClientAppointmentDataBound"

           Height="900px" OnClientAppointmentEditing="OnClientAppointmentEditing" OnClientAppointmentContextMenuItemClicked="appointmentContextMenuItemClicked"

           OnClientAppointmentContextMenu="OnClientAppointmentContextMenu"

           SelectedView="WeekView" DayHeaderDateFormat="dddd, dd MMMM yyyy" HoursPanelTimeFormat="HH:mm"

           OnClientAppointmentsPopulating="dataPopulating" OnClientAppointmentsPopulated="dataPopulated" Culture="cs-CZ">



           <AppointmentContextMenus>

               <%--The appointment context menu interaction is handled on the client--%>

               <%--See the JavaScript code above--%>

               <telerik:RadSchedulerContextMenu runat="server" ID="SchedulerAppointmentContextMenu">

                   <Items>

                       <telerik:RadMenuItem Text="Export iCalendar" Value="GenerateVCal" ImageUrl="~/Content/Images/Icons/iCalendar16.png" />

                       <telerik:RadMenuItem IsSeparator="True" />

                       <telerik:RadMenuItem Text="Edit" Value="CommandEdit" ImageUrl="~/Content/Images/DataEditing/Edit.gif" />

                       <telerik:RadMenuItem Text="Delete" Value="CommandDelete" ImageUrl="~/Content/Images/DataEditing/Delete.gif" Enabled="True" />

                   </Items>

               </telerik:RadSchedulerContextMenu>

           </AppointmentContextMenus>

           <TimeSlotContextMenus>

               <telerik:RadSchedulerContextMenu runat="server" ID="TimeSlotContextMenu">

                   <Items>

                       <telerik:RadMenuItem Text="CreateAppointment" Value="CreateAppointment" />

                       <telerik:RadMenuItem Text="CreateTask" Value="CreateTask" />

                       <telerik:RadMenuItem Text="CreateEmail" Value="CreateEmail" />

                       <telerik:RadMenuItem Text="CreateCall" Value="CreateCall" />

                        <telerik:RadMenuItem Text="CreateTimesheet" Value="CreateTimesheet" />

                   </Items>

               </telerik:RadSchedulerContextMenu>

           </TimeSlotContextMenus>

           <TimelineView GroupBy="Calendar" GroupingDirection="Vertical" />

           <AdvancedForm Enabled="false" EnableResourceEditing="false" />

           <WebServiceSettings Path="~/Models/SchedulerWebService.asmx" ResourcePopulationMode="ClientSide" />

       </telerik:RadScheduler>

   </telerik:RadCodeBlock>

Scheduler

answered on 18 Nov 2010

1 answer

153 views

Popup on Row MouseOver/Out issue

Hello,

Having a minor display issue with the client events rowmouseover/rowmouseout. I think it's more of a JS/HTML issue than a telerik issue. But to confirm: I display a popup when the user mouses over a row in the grid. The issue is that when the user doesn't mouse out of the row, but mouses across cells in the same row, this triggers the mouseout/mouseover events. Is there a way to circumvent that? I have an idea of what I can do, but I was wondering if there is something built-in that I could adjust for this issue.

Thanks.

Grid

answered on 18 Nov 2010

1 answer

78 views

Timeline horizontally resources vertically

Hi

Our client is asking for the time to be displayed horizontally and resources to be displayed vertically, are there any plans to add this to the scheduler control?

Scheduler

answered on 18 Nov 2010

2 answers

146 views

How to get the elements of a new row in a grid at client side?

<telerik:GridTemplateColumn UniqueName="MyColumn" DataField="MyColumn">

<ItemTemplate>

<telerik:RadComboBox ID="rcbMyList" runat="server"

OnClientSelectedIndexChanged="MyListChanged" >

</telerik:RadComboBox>

</ItemTemplate>

</telerik:GridTemplateColumn>

A master view of a gird is set to EditMode="InPlace" and InsertItemDisplay="Bottom". Suppose a new row has been added by clicking a button and the new row looks like just another "existing" row.

What I need is, updating other elements in the new row when the index of a combo box in the new row is changed, and all things should be done at client side.

I tried to set up a client event handler but I don't know how to get the elements in the new row in my event handler (javascript). I would say my javascript works for existing rows - I can get any row from the object "sender.get_parent()" - but it doesn't work for the new row.

Any idea about this problem?

--Y. Fan

Grid

answered on 18 Nov 2010