Questions on UI for ASP.NET AJAX Forum

1 answer

53 views

"Close Tab" image on dynamically added client side tabs

Hello,

I have the following code for a tab strip and related necessary controls. All my navigational hyperlinks are javascript function calls to the "AddTab" function shown below. The server side code to add the tab and user control is also below.

Given the code and functionality below, how can I add a "Close Tab" icon on each tab to allow the user to close the tab? I have found many examples on this site but none of them are similar to my usage, and when I attempt to merge the logic, it fails. 100% of the tabs are generated dynamically from the client. There aren't any tabs pre-loaded when the site is loaded.

If there's anything I left out or you need information, let me know!

Thanks!
Kevin

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

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Default">

</telerik:RadAjaxLoadingPanel>

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

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadTabStrip1">

<UpdatedControls><telerik:AjaxUpdatedControl ControlID="RadTabStrip1" />

<telerik:AjaxUpdatedControl ControlID="RadMultiPage1" LoadingPanelID="LoadingPanel1" />

<telerik:AjaxUpdatedControl ControlID="RadGrid2" LoadingPanelID="LoadingPanel1" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="RadMultiPage1">

<UpdatedControls><telerik:AjaxUpdatedControl ControlID="RadMultiPage1" LoadingPanelID="LoadingPanel1" />

<telerik:AjaxUpdatedControl ControlID="RadGrid2" LoadingPanelID="LoadingPanel1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

function AddTab(controlToAdd)

{

var tabstrip = $find("<%= RadTabStrip1.ClientID %>");

var tab = new Telerik.Web.UI.RadTab();

tab.set_text(controlToAdd);

tabstrip.trackChanges();

tabstrip.get_tabs().add(tab);

tabstrip.commitChanges();

tab.click();

}

protected void RadMultiPage1_PageViewCreated(object sender, RadMultiPageEventArgs e)

{

string tabID;

tabID = e.PageView.ID.IndexOf('-') < 0 ? e.PageView.ID : e.PageView.ID.Substring(0, e.PageView.ID.IndexOf('-'));

tabID = tabID.Replace("_", " ");

Control userControl = Page.LoadControl(Utilities.CachedData.GetUserControlPath(tabID));

userControl.ID = e.PageView.ID + "_userControl";

e.PageView.Controls.Add(userControl);

}

private void AddPageView(RadTab tab)

{

Random random = new Random();

int randomNumber = random.Next(0, 1000000);

RadPageView pageView = new RadPageView();

pageView.ID = tab.Text.Replace(" ", "_") + "-" + randomNumber.ToString();

RadMultiPage1.PageViews.Add(pageView);

tab.PageViewID = pageView.ID;

}

protected void RadTabStrip1_TabClick(object sender, RadTabStripEventArgs e)

{

AddPageView(e.Tab);

e.Tab.PageView.Selected = true;

}

TabStrip

answered on 09 Feb 2012

5 answers

70 views

RadPanel appears with black border in IE 8.

Hi

I am facing a designing problem with RadPanel.

It appears correctly on first page load but after post back it appears with black borders in IE 8, but it appears correctly in IE 9, Firefox and Chrome.
I have attatched the both images as sample, please suggest me which css class to fix.

Before image is the display on first load,
After image is the display after page is loaded after post back it adds the balck borders :(

PanelBar

answered on 09 Feb 2012

1 answer

141 views

dynamic legend for radchart

I have tied my chart to a sqldatasource. But I can't get the legend to reflect the the categories showing up. Can someone show me an example or a demo where the legend reflects the categories in a sqldatasource?

Chart (Obsolete)

answered on 09 Feb 2012

8 answers

385 views

Help canceling postback in OnClientSelectedIndexChanged

I am updating some custom controls and am having trouble figuring out how to cancel a postback on a RadListBox from the

ClientSelectedIndexChanged

handler. To explain...I have a page that contains a RadListBox, a RadTabStrip, and a RadMultiPage which are all linked. When the user selects a item from the RadListBox I use the ClientSelectedIndexChanged handler to check if the linked Tab/PageView already exists and if so then set them selected...if not then they are created and selected server-side. I have a prototype version which uses a RadTreeView that works fine using the set_postback( false ) method on the node in the OnClientNodeClicking handler...does anyone know how to do the same with a RadListBox??

ListBox

answered on 09 Feb 2012

1 answer

111 views

ajax functionality doesn't seem to be working

I've added a radlistview to a page, with a radrating control inside of it. It's displaying about 330 records.

I then went ahead and put the radlistview in an radupdate panel, but i can't see any difference in how the page behaves. I then went ahead and added a rad loading panel to the page. And still i can't see any difference to the page. I left initial delay and min display at 0, no effect. Changed min display to 2000, no effect.

Here's what my aspx markup looks like:

I then went ahead and put the radlistview in an radupdate panel, but i can't see any difference in how the page behaves. I then went ahead and added a rad loading panel to the page. And still i can't see any difference to the page. I left initial delay and min display at 0, no effect. Changed min display to 2000, no effect.Here's what my aspx markup looks like: (i deleted the template content for brevity). Can anyone tell me what i might be doing wrong here? This is with the 2011 Q2 release.

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

</telerik:RadScriptManager>

<div class="list_view_cont">

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server"

Skin="Default" AnimationDuration="1000" IsSticky="True" Transparency="50">

</telerik:RadAjaxLoadingPanel>

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

HorizontalAlign="NotSet" LoadingPanelID="RadAjaxLoadingPanel1" >

<telerik:RadListView ID="RadListView1" runat="server" ItemPlaceholderID="gameList"

DataSourceID="sqlDsGames" DataKeyNames="ID,Rating"

onitemcreated="RadListView1_ItemCreated">

<LayoutTemplate>

<ul>

<li class="row_header">

<div class="row_name">

<h2><asp:LinkButton ID="lbtnTitle" CommandName="Sort" CommandArgument="Title" runat="server">MMO Title</asp:LinkButton></h2>

</div>

<div class="row_genre">

<h2><asp:LinkButton ID="lbtnCategory" CommandName="Sort" CommandArgument="Category" runat="server">Genre</asp:LinkButton></h2>

</div>

<div class="row_release">

<h2><asp:LinkButton ID="lbtDate" CommandName="Sort" CommandArgument="ReleasedDate" runat="server">Release Date</asp:LinkButton></h2>

</div>

<div class="row_platform">

<h2><asp:LinkButton ID="lbtPlatform" CommandName="Sort" CommandArgument="Platform" runat="server">Platform</asp:LinkButton></h2>

</div>

<div class="row_rating">

<h2><asp:LinkButton ID="lbtnRating" CommandName="Sort" CommandArgument="Rating" runat="server">Rating</asp:LinkButton></h2>

</div>

<div class="row_votes">

<h2>

<asp:LinkButton ID="lbtnVotes" CommandName="Sort" CommandArgument="Votes" runat="server">Votes</asp:LinkButton></h2>

</div>

</li>

<fieldset id="gameList" runat="server" />

</ul>

</LayoutTemplate>

<ItemTemplate>

</ItemTemplate>

<AlternatingItemTemplate>

</AlternatingItemTemplate>

</telerik:RadListView>

</telerik:RadAjaxPanel>

</div>

Ajax

answered on 09 Feb 2012

1 answer

65 views

Is there an Interaction between OnRowClick and OnSelectedIndexChanged???

Hi

I have a Radgrid that has had OnRowClick working for some time on the client side.

I am now trying to wire up to the Server Side OnSelectedIndexChanged as well.

However I am not getting the server event when the user clicks on a row.

I DO get the event later if I click a button outside of my grid, for instance to close the RadWindow all of this is happening in.

What am I missing?

Grid

answered on 09 Feb 2012

1 answer

45 views

Radwindow value is not refreshing/Affecting in rad grid.

Hi All,

I am new to this community and need some help with rad window.
I have created a rad window using ParentGrid context menu. The value entered in rad window should be reflected in the parent grid after closing the rad window.
As of now, the value entered in rad window is changed in DB but the same is not in parent grid. The values is shown only after refreshing but i need to show the value when the window is closed.

Kindly do help ASAP.

Thanks in advance.

General Discussions

answered on 09 Feb 2012

3 answers

57 views

problem with GridBoundColumn

Hi,
I'm using a SqlDataSource for my RadGrid and I can't edit the data, it's not updating in my database.
What do I have to add to my code?

Thanks in advance,
esmyy

Grid

answered on 09 Feb 2012

4 answers

407 views

Textarea in inline edit

I need to change the default small textbox to a textarea in edit mode ( inline) and it's not working, the textarea shows up when i use a template column but when it tries to update the textarea value it throws an error because it cannot find the value even though I set up Update params in the SQL datasource. Is there any sample projects that do this? I am wondering if it cannot find the value because I am using master pages.

Here is the code for the grid:

<telerik:RadGrid ID="rgNews" runat="server" CellSpacing="0"

DataSourceID="sdsNews" AllowAutomaticInserts="true" AllowAutomaticUpdates="true" AllowAutomaticDeletes="true" GridLines="None" AllowPaging="True"

AllowSorting="True" AutoGenerateColumns="False">

<ClientSettings>

<Selecting AllowRowSelect="True" />

</ClientSettings>

<MasterTableView DataKeyNames="newsID" CommandItemDisplay="Top" AllowAutomaticInserts="true" DataSourceID="sdsNews">

<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:GridBoundColumn DataField="newsID" DataType="System.Int32"

FilterControlAltText="Filter newsID column" HeaderText="newsID"

ReadOnly="True" SortExpression="newsID" UniqueName="newsID"

Visible="False">

</telerik:GridBoundColumn>

<telerik:GridEditCommandColumn ButtonType="ImageButton" CancelText=""

FilterControlAltText="Filter EditCommandColumn column"

UpdateText="">

</telerik:GridEditCommandColumn>

<telerik:GridBoundColumn DataField="Title"

FilterControlAltText="Filter Title column" HeaderText="Title"

SortExpression="Title" UniqueName="Title">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Date"

FilterControlAltText="Filter Date column" HeaderText="Date"

SortExpression="Date" UniqueName="Date">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Author"

FilterControlAltText="Filter Author column" HeaderText="Author"

SortExpression="Author" UniqueName="Author">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Publication"

FilterControlAltText="Filter Publication column" HeaderText="Publication"

SortExpression="Publication" UniqueName="Publication">

</telerik:GridBoundColumn>

<%-- <telerik:GridBoundColumn DataField="Content"

FilterControlAltText="Filter Content column" HeaderText="Content" Visible="False"

SortExpression="Content" UniqueName="Content">

</telerik:GridBoundColumn>--%>

<telerik:GridTemplateColumn UniqueName="Content" DataField="Content" HeaderText="Content" Visible="false">

<ItemTemplate>

<asp:Label ID="lblContent" Text='<%# Bind("Content") %>' runat="server" />

</ItemTemplate>

<EditItemTemplate>

<asp:TextBox ID="txtContent" TextMode="MultiLine" Text='<%# Eval("Content") %>' Height="150" Width="200" runat="server"></asp:TextBox>

</EditItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn DataField="Link"

FilterControlAltText="Filter Link column" HeaderText="Link"

SortExpression="Link" Visible="false" UniqueName="Link">

</telerik:GridBoundColumn>

<telerik:GridButtonColumn CommandName="Delete" Text="Delete" ButtonType="ImageButton"

UniqueName= "DeleteColumn" />

</Columns>

<EditFormSettings CaptionFormatString="Edit news details for {0}" FormCaptionStyle-Font-Bold="true" FormCaptionStyle-ForeColor="#9d273f" CaptionDataField="Title">

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

</EditFormSettings>

</MasterTableView>

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

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

</telerik:RadGrid

>



Here is the SQL Datasource code:




<asp:SqlDataSource ID="sdsNews" runat="server"
       ConnectionString="<%$ ConnectionStrings:CLSWEBConnectionString %>"      
       SelectCommand="SELECT [newsID], [Title], [Date], [Author], [Publication], [Content], [Link] FROM [tblNews]"
       UpdateCommand="UPDATE [tblNews] set [Title] = @Title, [Date] = @Date, [Author] = @Author, [Publication] = @Publication, [Content] = @Content, [Link] = @Link WHERE [newsID] = @newsID"
       DeleteCommand="DELETE FROM [tblNews] WHERE [newsID] = @newsID">
       <UpdateParameters>
       <asp:Parameter Name="Content" Type="String" />
       </UpdateParameters>
   </asp:SqlDataSource>

Here is the error it throws, I am guessing it cannot find the value of the Content template column:

Cannot insert the value NULL into column 'Content', table 'CLSWEB.dbo.tblNews'; column does not allow nulls. UPDATE fails.
The statement has been terminated.

Thanks,
Sam

Grid

answered on 09 Feb 2012

1 answer

170 views

Conditionally fire SelectedIndexChanged event

Dear Telerik Support

I need to Fire the event SelectedIndexChanged on my RadComboBox only if the user selects something on the list, rather than typing something on it. Is it possible? If you need more information, please let me know.

ComboBox

answered on 09 Feb 2012

Cannot insert the value NULL into column 'Content', table 'CLSWEB.dbo.tblNews'; column does not allow nulls. UPDATE fails. The statement has been terminated.

Cannot insert the value NULL into column 'Content', table 'CLSWEB.dbo.tblNews'; column does not allow nulls. UPDATE fails.
The statement has been terminated.