Questions on UI for ASP.NET AJAX Forum

0 answers

75 views

Ajaxify Timer Sample in Master Page scenario

To every poor soul trying to make Ajaxify Timer sample from page http://demos.telerik.com/aspnet-ajax/ajax/examples/common/ajaxifytimer/defaultcs.aspx to work in Master page scenario:

You have to set

ClientIDMode="AutoID"

(as described in similar this and more specific this thread).

Cheers,
Jacek

Documentation and Tutorials

asked on 16 Mar 2012

5 answers

484 views

ListView / Items Drag-and-drop

I have been looking at the Drag-and-drop feature in List View specifically the example shown on http://demos.telerik.com/aspnet-ajax/listview/examples/itemdragdrop/defaultcs.aspx. I want to know if it is possible to drag and drop items inside the listview.

kind of like http://www.webreference.com/programming/javascript/mk/column2/
I am using .net 3.5. ASP.NET Help!

ListView

answered on 15 Mar 2012

2 answers

102 views

[Solved] Problem with empty RadComboBoxContext

Hi all,

I'm facing the problem while using the RadComboBox. I've used the example from Telerik Demo to populate RadComboBox with data on demant in a new empty project. And when the control calls for the WCF service for data the RadComboBoxContext parameter is empty.
Can you please advice me what I'm doing wrong?

ASPX code:

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"

CodeBehind="Default.aspx.cs" Inherits="WebApplication1._Default" %>

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

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">

</asp:Content>

<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">

<div>

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

</telerik:RadScriptManager>

<telerik:RadComboBox runat="server" ID="RadComboBox1" Height="100px"

EnableLoadOnDemand="true" ShowMoreResultsBox="true" EnableVirtualScrolling="true"

EmptyMessage="Type here ...">

<WebServiceSettings Path="~/ComboBoxWcfService.svc" Method="LoadData" />

</telerik:RadComboBox>

</div>

<asp:LinqDataSource ID="LinqDataSource1" runat="server">

</asp:LinqDataSource>

</asp:Content

>





WCF code:


[ServiceContract(Namespace = "")]
[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]
public class ComboBoxWcfService {
    public void DoWork()
    {
    }
    [OperationContract]
    public RadComboBoxData LoadData(RadComboBoxContext context)
    {
        //The RadComboBoxData object contains all required information for load on demand:
        // - the items 
        // - are there more items in case of paging
        // - status message to be displayed (which is optional)
 
        AdventureWorksDataContext northwind = new AdventureWorksDataContext();
 
 
         
        RadComboBoxData result = new RadComboBoxData();
 
        //Get all items from the Customers table. This query will not be executed untill the ToArray method is called.
        var allCustomers = from customer in northwind.Customers
                           orderby customer.ContactName
                           select new RadComboBoxItemData
                           {
                               Text = customer.ContactName
                           };
 
 
        //In case the user typed something - filter the result set
        string text = context.Text;
        if (!String.IsNullOrEmpty(text))
        {
            allCustomers = allCustomers.Where(item => item.Text.StartsWith(text));
        }
        //Perform the paging
        // - first skip the amount of items already populated
        // - take the next 10 items
        int numberOfItems = context.NumberOfItems;
        var customers = allCustomers.Skip(numberOfItems).Take(10);
 
        //This will execute the database query and return the data as an array of RadComboBoxItemData objects
        result.Items = customers.ToArray();
 
 
        int endOffset = numberOfItems + customers.Count();
        int totalCount = allCustomers.Count();
 
        //Check if all items are populated (this is the last page)
        if (endOffset == totalCount)
            result.EndOfItems = true;
 
        //Initialize the status message
        result.Message = String.Format("Items <b>1</b>-<b>{0}</b> out of <b>{1}</b>",
                                       endOffset, totalCount);
 
        return result;
    }
}



WebConfig:


<service behaviorConfiguration="metadataAndDebug" name="WebApplication1.ComboBoxWcfService">
  <endpoint address="" behaviorConfiguration="WebBehavior" binding="webHttpBinding"
    contract="WebApplication1.ComboBoxWcfService" />
  <endpoint address="mex" binding="mexHttpBinding" contract="IMetadataExchange" />
</service>

ComboBox

answered on 15 Mar 2012

4 answers

190 views

Problem when updating RadGrid with outside dropdown using RadAjaxManager

Hi, I need help for the following problem.

Scenario:
I am trying to update RadGrid with outside dropdown using RadAjaxManager. I need to do this only when the RadGrid is actually included on the page and when the FormTemplate is shown. This "included or not" is determined by page code behind (on the form that contains the grid) using TDs and making them visible or not, which depends on what's selected on the form by the user.

The control where it all is declared is attached (ascx and ascx.cs). This control is loaded dynamically with other controls in one single page. Trying the RadAjaxManager like attached, it gives me the following error:

Microsoft JScript runtime error: Sys.InvalidOperationException: Could not find UpdatePanel with ID 'ctl00_ctl08_ctl00_ctl08_RadGrid1Panel'. If it is being updated dynamically then it must be inside another UpdatePanel.

I suppose this is because the RadGrid is not present yet on the form.
So how can I update the RadGrid from the outer form only when it is present?

Sorry for not attaching classes because they are rather long, but at least here's the xxx declaration:

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
   <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="ddlMotivoGasto">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="RadGrid1" LoadingPanelID="RadAjaxLoadingPanel1" />
                <telerik:AjaxUpdatedControl ControlID="ddlMotivoGasto" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>
<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server"></telerik:RadAjaxLoadingPanel>

If you need any more code I'll be happy to provide.

Thanks in advance for your kind help.
Regards, Pieter

Grid

answered on 15 Mar 2012

0 answers

77 views

RadGrid virtual Scrolling

Hi Telerik Team,

Will u please respond to this email, I am need of your help.
Please help me.

Thanks
N Aravind

Grid

asked on 15 Mar 2012

2 answers

149 views

RadMaskedTextBox with RegularExpressionValidator in RadInput.Net2

Hi,

We are using "RadInput.Net2.dll" and RadMaskedTextBox for phone number. For validating phone number format as (###) ###-####, we are using RegularExpressionValidator.

Below is the code we used

<radI:RadMaskedTextBox ID="txtPhone" runat="server"></radI:RadMaskedTextBox><br />
<asp:RegularExpressionValidator ID="revOtherPhone" Display="dynamic" ControlToValidate="txtPhone" ValidationExpression ="^($[0-9]\d{2}$|[0-9]\d{2})[- .]?\d{3}[- .]?\d{4}$" ToolTip="Input other phone" ErrorMessage="Enter the correct phone number." runat="server"></asp:RegularExpressionValidator>

The functionality is working fine OnKeyPress event.
But we do not want to display the error message on every key press. We want to display the error message only on tab / mouse out from text box like demo available in "http://demos.telerik.com/aspnet-ajax/input/examples/common/validation/defaultcs.aspx"

But we have used the same code as mentioned in the demo source code. But we are getting the validation message at every key press event instead of tab out.

Iwe could not find out where the RegularExpressionValidator validation event is setup for RadMaskedTextBox key press. Could you please help me to fix this issue?
Thanks in advance.

General Discussions

answered on 15 Mar 2012

2 answers

155 views

get first char in RadMaskedTextBox onkeypress event

We are using "RadInput.Net2.dll" and RadMaskedTextBox for phone number. We want to check if first character of area code should not be 0 or 1.

If we use CustomValidator and javascript as below, it is working fine.
For example, if phone # is "(316) 446-2777" and if I replace 3 as 1, I could see the correct error message. But if I delete 3, I can see numbers in text box as "(_16) 446-2777". But still I can see the error message as "This number cannot begin with a 1 or 0.". The prompt character is not part of the args.value.

I want to display the error message only if first character after ( is 0 or 1. Could you please help us to find out the first character only of the input text
Thanks in advance.

<radI:RadMaskedTextBox ID="txtPhone" runat="server">

</radI:RadMaskedTextBox><br />

<asp:CustomValidator id="revBusinessPhone" Display="dynamic" runat = "server" ControlToValidate="txtPhone" ErrorMessage = "This number cannot begin with a 1 or 0." ClientValidationFunction ="validateLength" ></asp:CustomValidator>

function validateLength(oSrc, args) {

var phnVal = args.Value;

if (((phnVal1.substring(0, 2)) == "(1" || (phnVal.substring(0, 2) == "(0"))) {

oSrc.innerText = "This number cannot begin with a 1 or 0.";

args.IsValid = false;

}

else {

var regex = /^($[0-9]\d{2}$|[0-9]\d{2})[- .]?\d{3}[- .]?\d{4}$/;

if (regex.test(phnVal)) {

args.IsValid = true;

}

else {

oSrc.innerText = "This number must contain 10 digits.";

args.IsValid = false;

}

return true;

}

General Discussions

answered on 15 Mar 2012

3 answers

121 views

Can I allow users to reorder appointments(TimeLineView) via Drag and Drop?

Currently when I click on an appointment to drag it it moves to cover the topmost appointment and goes semi-transparent.
After I have moved the cursor to the position I want the appointment to be in and released the mouse button it just jumps back to where it was before.
Is there any way to re-order items and save the order they were in?
Thanks,
Edward

Scheduler

answered on 15 Mar 2012

12 answers

276 views

Setting the checked state of nodes loaded on demand

I have a treeview which I'm loading on demand via a webservice.

My webservice sets attributes on the nodes to indicate a) whether or not to show the checkbox for that node and b) whether or not the checkbox should be checked.

My treeview has 2 levels.

When the WebService call succeeds, the following code is called to populate the tree...

treeView.get_nodes().clear();

if (treeNodesResults != null)

{

for (var i = 0; i < treeNodesResults.length; i++)

{

var node = new Telerik.Web.UI.RadTreeNode();

node.set_text(treeNodesResults[i].Text);

node.set_value(treeNodesResults[i].Value);

node.set_expandMode(treeNodesResults[i].ExpandMode);

node.set_imageUrl(treeNodesResults[i].ImageUrl);

var checkable = false;

var checkableAttribute = node.get_attributes().getAttribute("Checkable");

if (checkableAttribute != null)

{

checkable = checkableAttribute == "true";

}

node.set_checkable(checkable);

if (checkable)

{

var checked = false;

var checkedAttribute = node.get_attributes().getAttribute("Checked") == "true";

if(checkedAttribute != null)

{

checked = checkedAttribute == "true";

}

node.set_checked(checked);

}

treeView.get_nodes().add(node);

}

And, on the face of it, this appears to work.

However, it seems that this code is only being called for the top-level nodes in the tree. None of the child nodes are being processed by this code. In fact, this code doesn't appear to be being called at all for anything other than the top-level nodes.

Clearly, I'm missing something. Can anyone give me an idea about what it might be?

--
Stuart

TreeView

answered on 15 Mar 2012

2 answers

116 views

Tab rearrange via Drag and Drop

I intend to implement 'Drag and Drop' in rearranging Tabs at run-time.
I choose to work with the RadGrid's 'Drag and Drop' feature for Column header rearranging.

Changing the Layout/CSS for every column header item seems doable. But, I need scroll features like in TabStrip without a scrollbar. Any idea how I could do this?

I am using ASP.NET AJAX Q3 2010 and have upgrade up to Q3 2011.

Thanks,
Shravan

TabStrip

answered on 15 Mar 2012