Questions on UI for ASP.NET AJAX Forum

0 answers

240 views

Javascript error with RadAutoCompleteBox

Hello,
I'm now developing a product entry with RadListView.
RadListView InsertItemTemplate contains three textboxes ,one RadAutoCompleteBox and two command buttons.
RadAutoCompleteBox is use to choose or add new tag for each products. I.e AllowCustomEntry is true.

There are two textboxes outside of RadListView.
Those two textboxes and RadListView exists under different asp panels.

And there are 2 RadInputManager controls. One RadInputManager is for two textbox outside of RadListView and another one is for
controls inside of RadListView templates. Both are used to validate Empty data.

There is another Button inside RadListView LayoutTemplate to trigger InsertItemTemplate to appear.
When I click that button, there are two javascript errors:
# Uncaught TypeError: Object #<Object> has no method 'toUpperCase'
# Uncaught TypeError: undefined is not a function from Telerik.Web.UI.WebResource.axd:6.
Then, RadAutoCompletebox stopped working. It does nothing when I type ";" Delimiter.
I can't even see it's EmptyMessage.

These errors occur when there is no data in RadListView datasource.
If I manually add some records to ListView's datasource, it works like normal.

And also there is no errors if I remove RadInputManager for outside controls.
I don't know whether there is some conflict with RadInputMangager.and RadAutoCompleteBox.

I reproduced the error in sample page and you can see below.
There are some commented lines inside GetSampleData() function.
Uncomment them and there will be no errors on Button click.

SampleWebPage.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="SampleWebPage.aspx.cs" Inherits="CMMS.SampleWebPage"

%>

<!DOCTYPE html>

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

<head id="Head1" runat="server">

<title></title>

</head>

<body>

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

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

<telerik:RadSkinManager ID="RadSkinManager" runat="server" Skin="Hay" />

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

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="pnlProducts">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadInputManager_TemplateControls" UpdatePanelRenderMode="Inline" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="pnlOthers">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadInputManager1" UpdatePanelRenderMode="Inline" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<div>

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

IsSticky="true" Transparency="20" Skin="">

</telerik:RadAjaxLoadingPanel>

<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" LoadingPanelID="ajaxloading">

<asp:Panel ID="pnlOthers" runat="server">

<table>

<tr>

<td>Host Code:

</td>

<td>

<asp:TextBox ID="txtHostCode" runat="server" Width="300" ValidationGroup="gp1" />

</td>

</tr>

<tr>

<td>Host Name:

</td>

<td>

<asp:TextBox ID="txtHostName" runat="server" Width="300" ValidationGroup="gp1" />

</td>

</tr>

</table>

</asp:Panel>

<br />

<asp:Panel ID="pnlProducts" runat="server">

<telerik:RadListView ID="lvProducts" runat="server" ItemPlaceholderID="ProductsContainer"

DataKeyNames="ID" AllowPaging="true" Width="500"

OnItemCreated="lvProducts_ItemCreated"

OnNeedDataSource="lvProducts_NeedDataSource"

OnItemCommand="lvProducts_ItemCommand">

<LayoutTemplate>

<fieldset>

<legend>Products and Services

</legend>

<asp:PlaceHolder ID="ProductsContainer" runat="server"></asp:PlaceHolder>

<div style="clear: both" />

<div>

<telerik:RadButton ID="btnInitInsert" runat="server" Text="Insert new product"

CommandName="<%# RadListView.InitInsertCommandName %>" ButtonType="LinkButton"

OnClick="btnProductInitInsert_Click" />

</div>

</table>

</fieldset>

</LayoutTemplate>

<ItemTemplate>

<fieldset>

<table>

<tr>

<td style="width: 100px;">Product Code:

</td>

<td>

<%#Eval("Code")%>

</td>

</tr>

<tr>

<td>Product Name:

</td>

<td>

<%#Eval("Name") %>

</td>

</tr>

<tr>

<td>Description:

</td>

<td>

<%# Eval("Description")%>

</td>

</tr>

<tr>

<td>Tags:

</td>

<td>

<asp:Label ID="lblTagString" runat="server" Visible="false" Text='<%#Bind("TagString")%>' />

<telerik:RadAutoCompleteBox ID="racTag" runat="server" AllowCustomEntry="true"

InputType="Token" Width="607" Enabled="false">

</telerik:RadAutoCompleteBox>

</td>

</tr>

</table>

</fieldset>

</ItemTemplate>

<InsertItemTemplate>

<fieldset>

<legend>New Product

</legend>

<table>

<tr>

<td style="width: 100px">Code<b style="color: Red">*</b>:

</td>

<td>

<asp:TextBox ID="txtCode" runat="server" Text='<%# Bind("Code") %>' Width="300px" ValidationGroup="gp2"></asp:TextBox>

</td>

</tr>

<tr>

<td>Name<b style="color: Red">*</b>:

</td>

<td>

<asp:TextBox ID="txtName" runat="server" Text='<%# Bind("Name") %>' Width="300px" ValidationGroup="gp2"></asp:TextBox>

</td>

</tr>

<tr>

<td>Description<b style="color: Red">*</b>:

</td>

<td>

<asp:TextBox ID="txtDescription" runat="server" Text='<%#Bind("Description")%>' ValidationGroup="gp2"

Width="500px" Height="60" TextMode="MultiLine" />

</td>

</tr>

<tr>

<td>Tags:

</td>

<td>

<telerik:RadAutoCompleteBox ID="racTag" runat="server" AllowCustomEntry="true"

EmptyMessage="Enter tag names separated by semicolon ( ; )" InputType="Token" Width="507" DropDownWidth="300"

DataTextField="tag_value" DataValueField="ID">

</telerik:RadAutoCompleteBox>

</td>

</tr>

<tr>

<td colspan="2">

<br />

</td>

</tr>

<tr>

<td style="text-align: right;" colspan="2">

<telerik:RadButton ID="btnPerformInsert" runat="server" Text="Insert" CommandName="<%# RadListView.PerformInsertCommandName %>" Width="70" ButtonType="LinkButton"

CausesValidation="true" ValidationGroup="gp2" />

<telerik:RadButton ID="btnCancel" runat="server" Text="Cancel" CommandName="<%# RadListView.CancelCommandName %>" CausesValidation="false" Width="70" ButtonType="LinkButton" />

</td>

</tr>

</table>

</fieldset>

</InsertItemTemplate>

<EmptyDataTemplate>

<fieldset>

<legend>Products and Services

</legend>

<fieldset>

No data to display!

</fieldset>

<telerik:RadButton ID="btnInitInsert" runat="server" Text="Insert new product"

OnClick="btnProductInitInsert_Click" CommandName="<%# RadListView.InitInsertCommandName %>" ButtonType="LinkButton" />

</fieldset>

</EmptyDataTemplate>

</telerik:RadListView>

</asp:Panel>

</telerik:RadAjaxPanel>

<telerik:RadInputManager runat="server" ID="RadInputManager1">

<telerik:TextBoxSetting BehaviorID="txtbeh" InitializeOnClient="true" ErrorMessage="Required field!"

Validation-ValidationGroup="gp1" Validation-IsRequired="true">

<TargetControls>

<telerik:TargetInput ControlID="txtHostCode" />

<telerik:TargetInput ControlID="txtHostName" />

</TargetControls>

</telerik:TextBoxSetting>

</telerik:RadInputManager>

<telerik:RadInputManager runat="server" ID="RadInputManager_TemplateControls">

<telerik:TextBoxSetting BehaviorID="txtbeh2" InitializeOnClient="true" ErrorMessage="Required field!"

Validation-ValidationGroup="gp2" Validation-IsRequired="true">

</telerik:TextBoxSetting>

</telerik:RadInputManager>

</div>

</form>

</body>

</html>

SampleWebPage.aspx.cs

using System;

using System.Collections.Generic;

using System.Data;

using System.Globalization;

using System.IO;

using System.Linq;

using System.Threading;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using Telerik.Web.UI;

namespace CMMS

{

public partial class SampleWebPage : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

if (!Page.IsPostBack)

{

LoadProductListView();

lvProducts.DataBind();

}

private void LoadProductListView()

{

lvProducts.DataSource = GetSampleData();

}

private DataTable GetSampleData()

{

DataTable l_Table = new DataTable("Sample");

l_Table.Columns.Add("ID");

l_Table.Columns.Add("Code");

l_Table.Columns.Add("Name");

l_Table.Columns.Add("Description");

l_Table.Columns.Add("TagString");

//l_Table.Rows.Add(new string[] { "1", "Code1", "Name1", "Description1", "" });

//l_Table.Rows.Add(new string[] { "2", "Code2", "Name2", "Description2", "" });

//l_Table.Rows.Add(new string[] { "3", "Code3", "Name3", "Description3", "" });

return l_Table;

}

protected void btnProductInitInsert_Click(object sender, System.EventArgs e)

{

lvProducts.ShowInsertItem();

lvProducts.FindControl("btnInitInsert").Visible = false;

}

protected void lvProducts_ItemCommand(object sender, RadListViewCommandEventArgs e)

{

if (e.CommandName == RadListView.CancelCommandName)

{

HideProductInsertItemTemplate();

}

private void HideProductInsertItemTemplate()

{

lvProducts.InsertItemPosition = RadListViewInsertItemPosition.None;

lvProducts.FindControl("btnInitInsert").Visible = true;

}

protected void lvProducts_NeedDataSource(object sender, RadListViewNeedDataSourceEventArgs e)

{

LoadProductListView();

}

protected void lvProducts_ItemCreated(object sender, RadListViewItemEventArgs e)

{

if (e.Item is RadListViewInsertItem && e.Item.IsInEditMode)

{

TextBox l_Code = e.Item.FindControl("txtCode") as TextBox;

TextBox l_Name = e.Item.FindControl("txtName") as TextBox;

TextBox l_Desc = e.Item.FindControl("txtDescription") as TextBox;

TextBoxSetting l_textboxSetting = (TextBoxSetting)RadInputManager_TemplateControls.GetSettingByBehaviorID("txtbeh2");

l_textboxSetting.TargetControls.Add(new TargetInput(l_Code.UniqueID, true));

l_textboxSetting.TargetControls.Add(new TargetInput(l_Name.UniqueID, true));

l_textboxSetting.TargetControls.Add(new TargetInput(l_Desc.UniqueID, true));

}

if (e.Item.FindControl("racTag") != null)

{

RadAutoCompleteBox l_AutoCompleteBox = e.Item.FindControl("racTag") as RadAutoCompleteBox;

l_AutoCompleteBox.DataTextField = "tag_value";

l_AutoCompleteBox.DataValueField = "ID";

l_AutoCompleteBox.DataSource = GetSampleTagData();

l_AutoCompleteBox.DataBind();

}

private object GetSampleTagData()

{

DataTable l_Table = new DataTable("SampleTagTable");

l_Table.Columns.Add("ID");

l_Table.Columns.Add("tag_value");

l_Table.Rows.Add(new string[] { "1", "Clothing" });

l_Table.Rows.Add(new string[] { "2", "Shoes" });

l_Table.Rows.Add(new string[] { "3", "Sunglasses" });

l_Table.Rows.Add(new string[] { "4", "Watches" });

l_Table.Rows.Add(new string[] { "5", "Books" });

return l_Table;

}

Hope you can use my attached codes to reproduce the error.
Please let me know how can I make this work.
I have tested in Chrome, Firefox and IE10. All have same result.

Thanks in advanced,
Robin

AutoCompleteBox

asked on 26 Jun 2013

1 answer

170 views

How to hide edit column at parent level

my radgrid had 2 level (parent & sublevel)
how can i hide the edit column in parent level (remain collapse column) ?

thanks

Grid

answered on 26 Jun 2013

1 answer

69 views

Moving appointment from scheduler to tree view

Hi,

I have implemented an application which allows drag and drop a node from RadTreeView to RadScheduler, is it possible to do it vice versa? I'm trying to figure out a way to drag an appointment from the scheduler to the RadTreeView but the appointment doesn't seems to be able to move out from the scheduler. Please advise.

Scheduler

answered on 26 Jun 2013

11 answers

758 views

Exception... "An invalid or illegal string was specified" code: "12" nsresult: "0x8053000c (NS_ERROR_DOM_SYNTAX_ERR)" after postback

    
            Chyba: 
        
            uncaught exception: [Exception... "An invalid or illegal string was 
        
            specified"<span style="">&nbsp; </span>code: "12" 
        
            nsresult: "0x8053000c (NS_ERROR_DOM_SYNTAX_ERR)"<span style="">&nbsp; </span>location: 
        
            "http://localhost:4679/hodnoceni/Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=ctl00_RadScriptManager1_HiddenField&amp;compress=1&amp;_TSM_CombinedScripts_=%3b%3bSystem.Web.Extensions%2c+Version%3d3.5.0.0%2c+Culture%3dneutral%2c+PublicKeyToken%3d31bf3856ad364e35%3acs-CZ%3a0d787d5c-3903-4814-ad72-296cea810318%3aea597d4b%3ab25378d2%3bTelerik.Web.UI%2c+Version%3d2009.3.1103.35%2c+Culture%3dneutral%2c+PublicKeyToken%3d121fae78165ba3d4%3acs-CZ%3a4552b812-caf7-4129-9b53-8f199b5bce6c%3a16e4e7cd%3af7645509%3aed16cbdc%3a86526ba7%3a24ee1bba%3ae330518b%3a1e771326%3ac8618e41%3aa7e79140%3aaa288e2d%3a8674cba1%3ab7778d6c%3ac08e9f8a%3aa51ee93e%3a59462f1%3a58366029%3ae4f8f289%3a874f8ea2%3a19620875%3a33108d14%3abd8f85e4 
        
            Line: 2408"] 

            Hi pleas help my. I use MasterPage and only 1 RadAjaxManager. This error is not only IE8. I use firefox. 

            This error is after ajaxPostBack. 

                        function onToolBarClientButtonClicking(sender, args) {

                                        var button = args.get_item();

                                        if (button.get_commandName() == "DeleteSelected") {

                                            radconfirm('<span style=\'color: #333399;\'>Opravdu chcete smazat vybrané záznamy?</span>', confirmDeleteCallBackFn, 330, 100, null, 'Smazání záznamů');

                                        }

                                        else {

                                            //alert(GetManager);

                                            GetManager().ajaxRequest(button.get_commandName());

                                        }

                                    }
                    
            This error is after "GetManager().ajaxRequest(button.get_commandName());"

            Thank you.

Ajax

answered on 26 Jun 2013

2 answers

105 views

[Solved] RadGrid Paging Jquery ProgressBar Issue

Hello everyone,
I have a telerik grid in which I need to show Jquery Progressbar for every record.
It displays progressbars correctly for first page..
But when I do paging for that grid then the progressbars in the new page are not visible.

Please help me as to where/how I can show the progressbars for my new pages in the grid after paging...

Regard,

<script type="text/javascript">

$(document).ready(function() {

$('.pbcontainer').each(function() {

var valueFromHiddenField = $('input[type=hidden]', this).val();

$('.progressbar', this).progressbar({ value: parseInt(valueFromHiddenField) });

})

});

</script>

<telerik:RadGrid ID="GridLoanRequests" runat="server" AutoGenerateColumns="false" GridLines="None"

Skin="Transparent1" EnableEmbeddedSkins="false" OnItemCommand="GridLoanRequests_ItemCommand"

AllowFilteringByColumn="false" GroupingSettings-CaseSensitive="false" OnItemDataBound="GridLoanRequests_ItemDataBound"

AllowPaging="true" PageSize="5" OnNeedDataSource="GridLoanRequests_NeedDataSource">

<HeaderContextMenu>

</HeaderContextMenu>

<ClientSettings>

<ClientEvents OnGridCreating="" />

<Selecting AllowRowSelect="true" />

</ClientSettings>

<MasterTableView DataKeyNames="LoanRequestID">

<NoRecordsTemplate>

<div style="background-color: #fff; height: 20px; color: Red; text-align: center;

font-size: 10pt; font-family: Verdana; font-weight: bold;">

<i>No Loan Requests Found.</i>

</div>

</NoRecordsTemplate>

<Columns>

<telerik:GridTemplateColumn AllowFiltering="false" HeaderText="Funding Complete(%)" Visible="true">

<ItemStyle HorizontalAlign="Left" />

<ItemTemplate>

<asp:Label ID="lblFundCompletePercent" runat="server"></asp:Label>

<div id="DivFundProgress" runat="server" class="FundProgress"></div>

<div class="pbcontainer">

<asp:HiddenField ID="hdnFundPercentComplete" runat="server" />

<div id="Div1" runat="server" class="progressbar"></div>

</div></ItemTemplate>

</telerik:GridTemplateColumn>

</Columns>

<EditFormSettings>

<EditColumn FilterControlAltText="Filter EditCommandColumn column">

</EditColumn>

</EditFormSettings>

</MasterTableView>

<FilterMenu EnableImageSprites="False">

</FilterMenu>

</telerik:RadGrid>

Vishal

Grid

answered on 26 Jun 2013

4 answers

394 views

[Solved] Controlling popup calendar position

Hi All,

I just want to ask on how to control the position of the popup calendar. I have a date filter which is aligned to the right of the page and whenever I click on the date picker the popup calendar is being cutoff to the right side of the page. Is there a way to control the position of the calender via x,y, and z position.

Thanks in advance,
Rj

Input

answered on 26 Jun 2013

0 answers

135 views

RadControls for ASP.NET AJAX Q1 2013 in VS2010 & .Net 3.5

Hi,

We've recently upgraded from Q3 2010, mainly to accommodate for IE10. We've had various issues but most of the functional ones are resolved after searching in this forum. Those are like changes of visible=false to display=false. We're left with UI problem, mostly have to do with font size and RadTextBox & RadComboBox width changes, which distorted our layout.

We uses textboxes in a lot of pages and we have our own textbox control which inherit from RadTextBox (we only override non display related attributes/parameters), which we later set WrapperCssClass in the constructor based on some advise we found in this forum. Is there any simple way we can reset the textbox and combobox to look like how they appears before in Q3 2010 without having to modify every single page?

We've tried to use WrapperCssClass to set all the textboxes width to auto and it appears to work in IE10, IE9/8, Firefox and Chrome, although the size seems to be smaller than before. But when we turn on Compatibility mode in IE10/9/8, the textboxes will appear bigger, and the layout distorted again. It feels like font size changes. As for RadComboBox, on some pages, it fill the width of the container and WrapperCssClass doesn't exist in RadComboBox for us to apply the similar change like RadTextBox.

We then try to find out if this problem appears in the Live Demo, but VS2010 crashes when loading the solution. On VS2012 it does load, but we then fail to set the target framework to .Net3.5. It's either it crashed or the page throws exception about incompatible runtime version. How should I make it work in VS2010 with .Net 3.5

Thank you

Installer and VS Extensions

asked on 26 Jun 2013

2 answers

464 views

Event not firing in User Control

I have a user control within a RadContentTemplateTile and within this user control there is a button that is not firing the handler within the code base of the user control. The Page_Load function is getting called within the user control, but not the button1_click handler when I click on the button

Below is the HTML

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="HTML5_test2.Default" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<%@ Register Src="~/TestPage1.ascx" TagPrefix="uc1" TagName="TestPage1" %>

<!DOCTYPE html>

        <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
        <div>
            <telerik:RadTileList ID="RadTileList1" runat="server" AutoPostBack="true">
                <Groups>
                    <telerik:TileGroup>
                        <telerik:RadContentTemplateTile runat="server" ID="uc1" Name="firstContentTemplateTile" Shape="Wide">
                            <ContentTemplate>
                                <uc1:TestPage1 runat="server" ID="TestPage1" />
                            </ContentTemplate>
                        </telerik:RadContentTemplateTile>
                    </telerik:TileGroup>
                </Groups>
            </telerik:RadTileList>
        </div>
    </form>
</body>
</html>

This is the code for the user control

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace HTML5_test2
{
    public partial class TestPage1 : System.Web.UI.UserControl
    {
        protected void Page_Load(object sender, EventArgs e)
        {

}

        protected void Button1_Click(object sender, EventArgs e)
        {
            Label1.Text = DateTime.Now.ToString();
        }
    }
}

TileList

answered on 25 Jun 2013

4 answers

149 views

[Solved] RadText box New line Problem in Chrome browser

Hi,
I want to enter a new line in rad text box on a button click event. In button click event have added the "\n" to the exsiting value and this works correctly for IE and Firefox browser, but not working in Chrome browser. Could you please help me to fix this chrome browser issue.

Thanks

Input