Questions on UI for ASP.NET AJAX Forum

3 answers

160 views

RadGrid Filter button options empty whitespace for integer/date type columns

Hello,

I have a whitespace issue for when you click the filter options button when trying to filter integer type columns as well as for date type columns. There is empty whitespace for options that do not apply to integer or date type columns such as contains etc.I would like there to be no whitespace and EqualTo right under NoFilter as well as IsNull right under LessThanOrEqualTo. The whitespace does not look good at all. Please see the attached photo to see the issue. Thanks in advance.

Grid

answered on 16 Nov 2017

0 answers

81 views

"Lost" onclick when RadAjaxManager used

Hi,

I have the following code (simplified to show the issue) with three ComboBoxes. Two of them are populated using an Ajax call. There is also a table with client-side click events:

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

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadComboBox1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadComboBox1" />

<telerik:AjaxUpdatedControl ControlID="RadComboBox2" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="RadComboBox2">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadComboBox2" />

<telerik:AjaxUpdatedControl ControlID="RadComboBox3" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<table cellspacing="10">

<tr height="100">

<td style="width:100px;background-color:aquamarine;" onclick="alert('clicked');"></td>

<td style="width:100px;background-color:burlywood" onclick="alert('clicked');"></td>

<td style="width:100px;background-color:darkgreen" onclick="alert('clicked');"></td>

<td style="width:100px;background-color:lightsteelblue" onclick="alert('clicked');"></td>

</tr>

</table>

<telerik:RadComboBox ID="RadComboBox1" AutoPostBack="true" OnSelectedIndexChanged="RadComboBox1_SelectedIndexChanged" runat="server">

<Items>

<telerik:RadComboBoxItem Value="0" Text="[Select]" />

<telerik:RadComboBoxItem Value="1" Text="AAA" />

<telerik:RadComboBoxItem Value="2" Text="BBB" />

<telerik:RadComboBoxItem Value="3" Text="CCC" />

</Items>

</telerik:RadComboBox>

<br />

<telerik:RadComboBox ID="RadComboBox2" AutoPostBack="true" OnSelectedIndexChanged="RadComboBox2_SelectedIndexChanged" runat="server" />

<br />

<telerik:RadComboBox ID="RadComboBox3" runat="server" />

Code behind:

protected void RadComboBox1_SelectedIndexChanged(object sender, RadComboBoxSelectedIndexChangedEventArgs e)

{

RadComboBox2.Items.Clear();

for(int i = 1; i<10; ++i)

{

RadComboBoxItem item = new RadComboBoxItem();

item.Text = "AAA-" + i.ToString();

item.Value = i.ToString();

RadComboBox2.Items.Add(item);

}

RadComboBox2.SelectedIndex = 0;

}

protected void RadComboBox2_SelectedIndexChanged(object sender, RadComboBoxSelectedIndexChangedEventArgs e)

{

RadComboBox3.Items.Clear();

for (int i = 1; i < 10; ++i)

{

RadComboBoxItem item = new RadComboBoxItem();

item.Text = "BBB-" + i.ToString();

item.Value = i.ToString();

RadComboBox3.Items.Add(item);

}

RadComboBox3.SelectedIndex = 0;

}

This is how to replicate the problem:

1. Select a value from RadComboBox1. This populates RadComboBox2 using Ajax.

2. Select a value from RadComboBox2. This populates RadComboBox3 using Ajax.

3. Click any of the table cells. The click event is "lost" (nothing happens).

4. Click another table cell. This time the click event is fired.

Why is that? Am I doing something wrong in the code?

Thanks,

Leszek

Ajax

asked on 16 Nov 2017

8 answers

271 views

Image Galllery stretches images affectinng aspect ratio

I am having a strange issue where Image Gallery is squishing some images that are in portrait format severely affecting their aspect ratio. IMHO photos should never have their aspect ratio altered as the results are never pleasing.

How can I configure Image Gallery to leave the aspect ratio of images as is and not stretch or squish photos it displays?

Thanks so much!

ImageGallery

answered on 16 Nov 2017

1 answer

191 views

View file with Kendo File upload control

Hi,

I am using Kendo UI File Upload to upload files,it's working fine.

Now I need to add functionality to view(open) those uploaded file without download them.

For example: I have uploaded file 'test.pdf', when I click on button that file should open in view mode.

If 'test1.doc' then that file should be open in word format.

If Image file then it should be open in image format.

File download is working fine but I want to open those files without downloading.

Please help me to solve this.

I spent lot of time on that but didn't get any solution.

Thanks & Regards,

Bhavika

General Discussions

answered on 16 Nov 2017

2 answers

72 views

ImageEditor Support Formats?

I cannot see a list of supported formats in ImageEditor documentation.

https://docs.telerik.com/devtools/aspnet-ajax/controls/imageeditor/overview

Which image formats are supported?

Is TIFF supported?

Thanks

Jason

ImageEditor

answered on 16 Nov 2017

0 answers

131 views

Page.IsValid false

I have a form with a set of fields including 1 captcha. I noticed Page.IsValid is always false if RadCaptcha1.IsValid is false even if all other validators for the other fields are passed.

Is it possible for the Page.IsValid to be true so that it is possible of me to find out if the other fields are really valid without I having to do one-by-one server validation check on individual fields?

Captcha

asked on 16 Nov 2017

2 answers

174 views

Combobox not working after upgradating

Application is upgraded to 2017.3.913.45 from 2011.2.712.35. We are facing issue with Combo box after the upgrade.

ComboBox

answered on 15 Nov 2017

0 answers

102 views

Get GridDataItem in RadGrid ItemRequested Event

Hi,

I am facing issue to getting GridDataItem on ItemRequested Event. My scenario is

In RadGrid, EditItemTemplate has one RadComboBox "rcbEmployee" and this RadComboBox bind on rcbEmployee_ItemsRequested event by calling one method "GetEmployee" that fatch the employee list to bind RadComboBox.

But "GetEmployee" method needed some parameter those can be get by GridDataItem.

So How can I access GridDataItem on "rcbEmployee_ItemsRequested" event or is there any work around ?

<telerik:RadGrid ID="RadGrid12" runat="server" MasterTableView-DataKeyNames="iIndex,pEmployee,FirstName" MasterTableView-ClientDataKeyNames="iIndex,pEmployee,FirstName"

EnableLinqExpressions="false" ClientSettings-EnableRowHoverStyle="true" Width="100%" AllowAutomaticDeletes="false" AllowAutomaticInserts="false" OnNeedDataSource="RadGrid1_NeedDataSource"

AllowMultiRowSelection="true" AllowAutomaticUpdates="True" AutoGenerateColumns="False" >

<MasterTableView GridLines="Both" HeaderStyle-HorizontalAlign="Center" AutoGenerateColumns="false"

CommandItemDisplay="None" HorizontalAlign="NotSet">

<Columns>

<telerik:GridTemplateColumn DataField="FirstName" ItemStyle-Width="200px" HeaderStyle-Width="200px" HeaderText="Name" UniqueName="FirstName">

<ItemTemplate>

<asp:Label ID="lblFirstName" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "FirstName")%>'></asp:Label>

</ItemTemplate>

<EditItemTemplate>

<telerik:RadComboBox runat="server" ID="rcbEmployee" EnableLoadOnDemand="True" DataTextField="Name" DataValueField="iIndex"

OnItemsRequested="rcbEmployee_ItemsRequested" AutoPostBack="false" HighlightTemplatedItems="true" Height="300px" Width="180px" DropDownWidth="180px">

<ItemTemplate>

<%# DataBinder.Eval(Container, "Text")%>

</ItemTemplate>

</telerik:RadComboBox>

</EditItemTemplate>

<FilterTemplate></FilterTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid>

Please help.

Thanks,

Sachin

Grid

asked on 15 Nov 2017

2 answers

98 views

Numeric Textbox changing value by itself

I have a numeric textbox. If I was to enter 123456789112345.67 in it, the control changes the value to 703687441776.64. This behavior can be seen in your online demo as well (https://demos.telerik.com/aspnet-ajax/numerictextbox/overview/defaultcs.aspx). Why does that happen?

NumericTextBox

answered on 15 Nov 2017

0 answers

146 views

OnRowCreated not firing until row clicked

So i am using a RadGrid in a custom control. In the java script i am binding the grids events to events declared in my custom control. The issue is the rowCreated function is not firing until i actually click a row. Since its within a prototype i have to create it as a delegate to ensure i can still access other variables in the same scope.

grid.add_rowCreated(Function.createDelegate(this, this.rowCreated));

But this causes the rowCreated event to not fire until i interact with the grid by selecting a row. Could someone give me some guidance on this please, it may be something obvious as i am fairly new to webforms controls. I have added the full code below, but have cut it down to be relevant.

Type.registerNamespace("WebApp.Portal.Controls");

// Define the control properties.

WebApp.Portal.Controls.DataViewContainer = function (element) {

WebApp.Portal.Controls.DataViewContainer.initializeBase(this, [element]);

this._clientId = null;

this._radGridId = null;

this._keyColumnName = null;

this._idsOfSelectedRows = [];

};

// Define the prototype

WebApp.Portal.Controls.DataViewContainer.prototype = {

initialize: function (sender, eventArgs) {

WebApp.Portal.Controls.DataViewContainer.callBaseMethod(this, 'initialize');

// Will be called on ajax or full postback

window.Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(Function.createDelegate(this, this.onLoad));

// If this is being executed by ajax

if (eventArgs) {

// And this is only a partial load

if (eventArgs.get_isPartialLoad()) {

// Don't perform any further processing

return;

}

// only hit on full postback.

this.bindEvents();

},

dispose: function() {

WebApp.Portal.Controls.DataViewContainer.callBaseMethod(this, 'dispose');

},

idsOfSelectedRows: [],

//

// Methods.

//

onLoad: function () {

},

bindEvents: function () {

var grid = window.$find(this.get_radGridId());

if (grid != undefined) {

grid.add_rowSelected(Function.createDelegate(this, this.rowSelected));

grid.add_rowDeselected(Function.createDelegate(this, this.rowDeselected));

grid.add_rowCreated(Function.createDelegate(this, this.rowCreated));

grid.add_gridCreated(Function.createDelegate(this, this.gridCreated));

}

},

rowSelected : function(sender, args) {

var entityId = args.getDataKeyValue(this._keyColumnName);

this.updateIdsOfSelectedRows(entityId, true);

console.log(JSON.stringify(this.idsOfSelectedRows));

},

rowDeselected : function (sender, args) {

var entityId = args.getDataKeyValue(this._keyColumnName);

this.updateIdsOfSelectedRows(entityId, false);

console.log(JSON.stringify(this.idsOfSelectedRows));

},

rowCreated : function (sender, args) {

var entityId = args.getDataKeyValue(this._keyColumnName);

console.log("Row Created: " + entityId);

if ($.inArray(entityId, this.idsOfSelectedRows) >= 0) {

args.get_gridDataItem().set_selected(true);

}

},

gridCreated : function (sender, eventArgs) {

var masterTable = sender.get_masterTableView();

var selectColumn = masterTable.getColumnByUniqueName("clmSelect");

var headerCheckBox = $(selectColumn.get_element()).find("[type=checkbox]")[0];

if (headerCheckBox) {

headerCheckBox.checked = masterTable.get_selectedItems().length == masterTable.get_dataItems().length;

}

},

updateIdsOfSelectedRows : function(id, isSelected) {

var index = $.inArray(id, this.idsOfSelectedRows);

if (!isSelected && index >= 0) {

this.idsOfSelectedRows.splice(index, 1); // remove id from the list

} else if (index < 0) {

this.idsOfSelectedRows.push(id);

}

},

//

// Properties.

//

get_radGridId: function() {

return this._radGridId;

},

set_radGridId: function(value) {

if (this._radGridId !== value) {

this._radGridId = value;

this.raisePropertyChanged('_radGridId');

}

},

get_clientId: function () {

return this._clientId;

},

set_clientId: function (value) {

if (this._clientId !== value) {

this._clientId = value;

this.raisePropertyChanged('clientId');

}

},

get_keyColumnName: function () {

return this._keyColumnName;

},

set_keyColumnName: function (value) {

if (this._keyColumnName !== value) {

this._keyColumnName = value;

this.raisePropertyChanged('keyColumnName');

}

},

};

WebApp.Portal.Controls.DataViewContainer.registerClass('WebApp.Portal.Controls.DataViewContainer', Sys.UI.Control);

Grid

asked on 15 Nov 2017