Questions on UI for ASP.NET AJAX Forum

1 answer

89 views

How to reduce CSS file in Radscheduler,RadGrid,RadTab Control ?

Hello,

Dynamically I have added radscheduler in the sharepoint 2010 application page. I have set "Telerik" theme for radscheduler it's working fine but in the browser 12 CSS files are loading for this particular control. It affects the page response as well as in Internet Explorer(7,8,9) upto 31 individual stylesheets are supported.

Refer the below link
http://social.msdn.microsoft.com/Forums/en-US/iewebdevelopment/thread/ad1b6e88-bbfa-4cc4-9e95-3889b82a7c1d/

It affect the page size and design.I have added the control in the page layout which resides inside master page. The CSS file count in the application page.

1. Master Page - 2 stylesheet
2. Sharepoint - 4 stylesheet
3. Three RadTab and Radgrid controls - 15 stylesheet
5. RadScheduler - 12 stylesheet

If I have added Radscheduler,RadTab,Radgrid controls in the page totally 27 stylesheets are loaded in the page.So how to reduce the css file of the scheduler control and telerik RadTab,RadScheduler controls ?
We are in a highly critical situation where our product release is held up because of the issues. Please respond at your as soon as possible.

Regards
Ramalingam S

Scheduler

answered on 05 Mar 2012

1 answer

89 views

Firefox-custom validation disables date column

I have a custom validator attached to a date column in edit on an order entry system to insure that the user doesn't change the date to one already on another order item for that product
if the error is triggered in Firefox (but not in IE, Opera, Safari or Chrome) the date stops popping up for any other item on the page

the column from the grid

<telerik:GridDateTimeColumn UniqueName="ShipDate" DataField="ShipDate" PickerType="DatePicker" HeaderText="Ship Date" DataFormatString="{0:d}" DataType="System.DateTime" >

<HeaderStyle Width="60px" />

</telerik:GridDateTimeColumn>

some Javascript

var j = 0;

function ship_date_selected(sender, eventArgs) {

var date = eventArgs._newValue;

// prevent loop

// var chk = eventArgs._oldValue;

if (j > 0) {

return;

}

var oldDate = eventArgs.get_oldDate();

var thisItem = document.getElementById('txtItemID');

// date already for Item

var theGrid = $find("<%=rgEditOrder.ClientID %>").get_masterTableView();

var j = $find("<%=rgEditOrder.ClientID %>")._editIndexes[0];

var editRow = theGrid.get_dataItems()[j];

var thisStore = theGrid.getCellByColumnUniqueName(editRow, "StoreNumber").innerHTML;

for (var i = 0; i < theGrid.get_dataItems().length; i++) {

var row = theGrid.get_dataItems()[i];

if (!row.get_isInEditMode()) {

var ItemID = theGrid.getCellByColumnUniqueName(row, "ItemID").innerHTML;

var storeNumber = theGrid.getCellByColumnUniqueName(row, "StoreNumber").innerHTML;

// alert(ItemID);

if (parseInt(ItemID) == parseInt(thisItem.value)) {

if (parseInt(storeNumber) == parseInt(thisStore)) {

var ShipDate = theGrid.getCellByColumnUniqueName(row, "ShipDate").innerHTML;

// alert(ShipDate);

if (Date.parse(date) == Date.parse(ShipDate)) {

alert('Date already used ' + ShipDate);

sender.set_selectedDate(oldDate);

i = 9999;

return false;

}

var strSD = format_dates(date);

if (!delivery_ok(strSD)) {

j++;

sender.set_selectedDate(oldDate);

alert('Invalid delivery date');

return false;

}

// validate that date supplied falls in one of three ship windows

function delivery_ok(strSD) {

var endDate1 = document.getElementById('rtbEnd1');

var endDate2 = document.getElementById('rtbEnd2');

var endDate3 = document.getElementById('rtbEnd3');

var startDate1 = document.getElementById('rtbStart1');

var startDate2 = document.getElementById('rtbStart2');

var startDate3 = document.getElementById('rtbStart3');

// add century(20) to ship dates-mm/dd/yy->mm/dd/yyyy

var vDate1 = format_dates(startDate1.value);

var vDate2 = format_dates(startDate2.value);

var vDate3 = format_dates(startDate3.value);

var vEnd1 = format_dates(endDate1.value);

var vEnd2 = format_dates(endDate2.value);

var vEnd3 = format_dates(endDate3.value);

if (vDate1 != '') {

if (Date.parse(strSD) >= Date.parse(vDate1) && Date.parse(strSD) <= Date.parse(vEnd1)) {

return true;

}

if (vDate2 != '') {

if (Date.parse(strSD) >= Date.parse(vDate2) && Date.parse(strSD) <= Date.parse(vEnd2)) {

return true;

}

if (vDate3 != '') {

if (Date.parse(strSD) >= Date.parse(vDate3) && Date.parse(strSD) <= Date.parse(vEnd3)) {

return true;

}

return false;

}

// append century(20) to date-mm/dd/yy->mm/dd/yyyy

// validate that date is in correct format-if error found

// return blank string

function format_dates(strDate) {

var i = 0;

var arrDate;

// this routine makes no sense

for (i = 0; i < 3; i++) {

if (strDate.indexOf("/") != -1) {

arrDate = strDate.split("/");

if (arrDate.length != 3) {

return "";

}

else {

return "";

}

// prefix the year with century-hardcoded 20

var ye = "20" + arrDate[2].substring(arrDate[2].length - 2);

var month = Number(arrDate[0]);

var day = Number(arrDate[1])

// check month and day-month between 1 and 12,day between 1 and 31

// except April,June,September and November-and February

if (month < 1 || month > 12) { return ""; }

if (day < 1 || day > 31) { return ""; }

if ((month == 4 || month == 6 || month == 9 || month == 11) && day == 31) {

return "";

}

// February-check against leap year

if (month == 2) {

var isleap = (ye % 4 == 0 && (ye % 100 != 0 || ye % 400 == 0));

if (day > 29 || (day == 29 && !isleap)) { return ""; }

}

// no date errors encountered-rebuild date and return

var strD = Number(arrDate[0]) + "/" + Number(arrDate[1]) + "/" + ye;

return strD;

}

decorate the edit item

protected void rgEditOrder_ItemCreated(object source, GridItemEventArgs e)

{

GridEditableItem geItem;

// GridDataItem gdItem;

RadDatePicker rdpShipDate;

GridDateTimeColumnEditor ceShipDate;

TableCell tcShipDate;

CustomValidator cvShipDate;

RadNumericTextBox rntbQty;

// int MinQty;

if (e.Item.IsInEditMode)

{ }

else

return;

if (e.Item is GridEditableItem)

{ }

else

return;

geItem = (GridEditableItem)e.Item;

rdpShipDate = (geItem["ShipDate"].Controls[0] as RadDatePicker);

rdpShipDate.ClientEvents.OnDateSelected = "ship_date_selected";

rdpShipDate.AutoPostBack = true;

rdpShipDate.SelectedDateChanged += rdpShipDate_SelectedDateChanged;

txtShipDate.Value = rdpShipDate.ClientID;

ceShipDate = geItem.EditManager.GetColumnEditor("ShipDate") as GridDateTimeColumnEditor;

tcShipDate = (TableCell)ceShipDate.PickerControl.Parent;

cvShipDate = new CustomValidator();

cvShipDate.ID = "cvShipDate";

cvShipDate.ControlToValidate = rdpShipDate.ID;

cvShipDate.ServerValidate += ShipDate_OnServerValidate;

cvShipDate.Text = "*";

cvShipDate.ErrorMessage = "Item already ordered on this ship date";

tcShipDate.Controls.Add(cvShipDate);

}

am I going about it the wrong way - or is there - gasp! - a bug?
I'm using the Q3 2011 version

Grid

answered on 05 Mar 2012

11 answers

352 views

RADScheduler as a Webpart

I'm interested in building a webpart that is essentially the RADScheduler - this will replace the default Sharepoint calendar. I've read several articles on how to create basic webparts with telerik controls, but how would you go about building this webpart as a "fully functional" version of the Scheduler.

Basically I want to be able to give users the option via the webpart editor to select a sharepoint list(s) to pull its information from. The list would need to be a calendar list and extra columns would automatically be reflected by the webpart.

For instance, if the calendar list has a "Color" column then that instance of the scheduler would have a Color selection combo box. If the calendar list had a checkbox field called "Active" then that instance of the scheduler would also have a checkbox field called active.

Another option would be to automatically create a list to store the information when the webpart is initialized. This would likely be the default behaviour.

We've tried several webparts to replace the default calendar component in MOSS and nothing comes close to Telerik's Scheduler. The only problem is that it's a control and not a webpart - a "do it yourself" module sounds good, but I'm oblivious to how it would integrate as a webpart with all of the functionality it possesses.

Please let me know if this type of integration is possible without an extremely large amount of coding.

Sharepoint Integration

answered on 05 Mar 2012

1 answer

110 views

Get data from non selected row

I would like to compare each row in a radgrid with the one above it to highlight changes. None of the rows will be selected so i need to somehow get the data for each row and compare it after binding. Is there a way for me to access all of the data in the grid if a row isn't selected?

Grid

answered on 05 Mar 2012

3 answers

102 views

Grid Exporting to Excel in IE

Trying to export the grid results to excel using IE9. I can not click open. I can only save. When clicking opern it says the file is not available. If I retry it recreates a screen shot of the current page and not the entire dataset. This will work in Firefox.

Grid

answered on 05 Mar 2012

3 answers

172 views

Customizing the appointment template

Hi,

I have more appointments in the same time in a same day. By default the appointments displays in the form one after the other in a vertical way in the RadScheduler control.

(eg: App1 App2 App3…). But I want to shows in a horizontal way.

Eg: App1

App2

App3

Is it possible to do this? If yes kindly give the procedure to accomplish this task.

And also please give the idea about how to add header for appointment details (appointment Template)

(eg:

AppointmentNo	Name	Phone	Email
..	..	..	..
..	..	..	..

Please refer the attached appointment screen
My application is in ASP.net

Thanks in advance.

Scheduler

answered on 05 Mar 2012

7 answers

320 views

[Solved] NumericColumn not formating digits

I have a GridNumericColumn with bound field.

<telerik:GridNumericColumn DataField="ppds_surf_corp" DecimalDigits="2"

FilterControlAltText="Filter colSurfCorp column"

HeaderText="Surface corporelle" ShowFilterIcon="False"

UniqueName="colSurfCorp"

AllowRounding="True" DataType="System.Decimal">

</telerik:GridNumericColumn>

Example: 2.45678 will still show 2.45678 but I want 2.46. I tried with DataFormatString {0:0.##} and it does't work too.

What's wrong with this code...

Grid

answered on 05 Mar 2012

6 answers

122 views

I have a combobox one in each PageView pages in the following way

Pageview 1

<telerik:RadComboBox ID="rcbManagerName" runat="server" Width="100" />

Pageview 2
<telerik:RadComboBox ID="rcbDeptName" runat="server" Width="100" />

In Pageview, I am able to focus to the combobox, use keyboard to type and it is able to locate the match. Whereas the pageview's combobox does not accept keyboard inputs. I have to use the mouse to select the entry. What should I do for combobox2 to make it key-friendly?

ComboBox

answered on 05 Mar 2012

1 answer

109 views

Formview + Radgrid. edit all issue

I have an issue that hopefully you can help me with. I have a search page for users. Do a search and a user or list of users is returned.
Double click and a control is opened in a modal window.

In this control I have a formview and a radgrid:

<FormView>
    Details on the user which was selected (name, email, etc)
</FormView>
<RadGrid>
    A list of security groups in which the user can be added/removed from
</RadGrid>

Note: two different datasources are used to populate the formview and radgrid.
           the radgrid is in "editAllMode"

My issue is when I perform an update. The "update" button is in the formview, and triggers an event in which I can update the personal info of the user based on this method firing...."FormView_Updating". Args are (object sender, WLPItemUpdatingEventArgs e). I am using "e" to get the updated data for the formview. Now after the personal data is updated (which works fine), I want to make a call to update the user's security groups by
triggering in code the RadGrid's "nameOfGrid_UpdateAllCommand(object sender, UpdateAllCommandEventArgs e)" from inside the "Formview_Updating" event.

Here is my issue. I am not sure how fire the event appropriately. I can use "Grid.OnUpdateAllCommand"(takes 2 args, sender and UpdateAllCommandEventArgs) however I am unable to pass anything valid for the "UpdateAllCommandEventArgs" argument, which I need to see what groups have been selected for the user. Any ideas how i can ?

Thanks.

UI for ASP.NET AJAX in ASP.NET MVC

answered on 05 Mar 2012

1 answer

205 views

radajaxmanager control on multiple usercontrol

Hi,

Below I have given code of user control which I used multiple times on single page.But my problem is that I got null values in HandleScrolling() function when I moved grid scroll down to bottom.
I have placed Radscriptmanager on main .aspx page.
And one more important thing is I have made this user control's DLL and used in other project by adding reference of that usercontrol's dll.

<%@ Control Language="C#" ClassName="Acme.MyTestUC" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<%@ Import Namespace="System.Web.UI.WebControls" %>
<%@ Import Namespace="System.Data.SqlClient" %>
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace=" System.Reflection" %>

}

    void manager1_AjaxRequest(object sender, AjaxRequestEventArgs e)
    {
        RadGrid2.PageSize += 15;
        RadGrid2.Rebind();
    }
    RadAjaxManager manager1;


</script>

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
    <script type="text/javascript">
            <!--
        function HandleScrolling(e) {

            var grid = $find("<%=RadGrid2.ClientID %>");

//alert(grid.hasOwnProperty());

var scrollArea = document.getElementById("<%= RadGrid2.ClientID %>" + "_GridData");

if (IsScrolledToBottom(scrollArea)) {
var currentlyDisplayedRecords = grid.get_masterTableView().get_pageSize() * (grid.get_masterTableView().get_currentPageIndex() + 1);

                //if the presently visible items are less than the entire source records count
                //trigger an ajax request to increase them
                if (currentlyDisplayedRecords < 100) {
                    $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest("LoadMoreRecords");
                }
            }
        }
        //this method calculates whether you have reached the bottom when dragging the vertical grid scroll
        function IsScrolledToBottom(scrollArea) {
            var currentPosition = scrollArea.scrollTop + scrollArea.clientHeight;
            return currentPosition == scrollArea.scrollHeight;
        }
            -->
    </script>
</telerik:RadCodeBlock>

<telerik:RadAjaxManagerProxy id="RadAjaxManager1" runat="server">
        <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="RadGrid2" LoadingPanelID="RadAjaxLoadingPanel2"></telerik:AjaxUpdatedControl>
            </UpdatedControls>
        </telerik:AjaxSetting>
        </AjaxSettings>
</telerik:RadAjaxManagerProxy >

<telerik:RadGrid ID="RadGrid2" AllowSorting="True"
    runat="server" AllowPaging="true" Width="97%" PageSize="15" GridLines="Vertical">
    <PagerStyle Visible="false" />
    <MasterTableView TableLayout="Fixed" />
    <ClientSettings>
        <Scrolling AllowScroll="true" UseStaticHeaders="true" SaveScrollPosition="true" />
        <ClientEvents OnScroll="HandleScrolling" />
    </ClientSettings>
</telerik:RadGrid>
<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel2" runat="server">
</telerik:RadAjaxLoadingPanel>
<br />

Thanks in advance for any help.
Regards,
Satyajit Kadam.

UI for ASP.NET AJAX in ASP.NET MVC

answered on 05 Mar 2012