Questions on UI for ASP.NET AJAX Forum

0 answers

144 views

I'm trying to conditionally hide the Edit and Destroy command buttons in my Grid but I haven't had much luck figuring out how to do that. Below is the code I currently have. I saw an example on the Telerik UI ASP.NET Core forum for how to do this and it involves using the Visible() method with a handler. However, that is apparently not available in Telerik UI ASP.NET AJAX. Is there something similar that will let me accomplish this?

@(Html.Kendo().Grid<MyViewModel>()

.Name("MyGrid")

.Columns(columns =>

{

...

columns

.Command(command =>

{

command.Edit()

.Text("Edit Me")

.Visible("IsEditVisible"); // this is not supported

}

)

.Width("125px");

}

)

...

<script>

function IsEditVisible(dataItem){

return dataItem.CanEdit;

}

Grid

asked on 29 Jan 2021

2 answers

85 views

How to avoid duplicating

Hi, im facing a issue.All my series are showing all information from all series.

I know probably it's a basic question, but could someone help me to solve this?

01.<telerik:RadHtmlChart runat="server" ID="CompetencyByParticipant" Width="80%" Height="300" Transitions="true">

02. <ChartTitle Text="Competências por tipo de participante">

03. </ChartTitle>

04. <PlotArea>

05. <YAxis>

06. <LabelsAppearance DataFormatString="{0:0.0}">

07. </LabelsAppearance>

08. <MinorGridLines Visible="false" />

09. </YAxis>

10. <XAxis DataLabelsField="ProfileName">

11. <TitleAppearance Text="Participantes">

12. </TitleAppearance>

13. <LabelsAppearance Step="3">

14. </LabelsAppearance>

15. <MajorGridLines Visible="true" />

16. <MinorGridLines Visible="false" />

17. </XAxis>

18. </PlotArea>

19.</telerik:RadHtmlChart>

01.var profileGroup = from k in evaluationData

02.group k by new

{ Profile = k.Profile, ProfileName = k.ProfileName, CompetencyId = k.Competency, CompetencyName = k.CompetencyName } into g

03.select new

04.{

05. Profile = g.Key.Profile,

06. ProfileName = g.Key.ProfileName,

07. Competency = g.Key.CompetencyId,

08. CompetencyName = g.Key.CompetencyName,

09. Score = g.Average(x => x.Score)

10.};

11.var chart = CompetencyByParticipant;

12.var competencies = profileGroup.Select(x => x.CompetencyName).Distinct();

13.foreach (var p in competencies)

14.{

15. var serie = new ColumnSeries();

16. serie.Name = p;

17. serie.DataFieldY = "Score";

18. chart.PlotArea.Series.Add(serie);

19.}

20.chart.PlotArea.XAxis.DataLabelsField = "ProfileName";

21.chart.PlotArea.XAxis.LabelsAppearance.Step = 3;

22.chart.DataSource = profileGroup.ToList();

23.chart.DataBind();

Is there a way to bind an specific dataset to each serie?

Thanks.

Chart (HTML5)

answered on 28 Jan 2021

2 answers

84 views

Table Caption disappearing in Accessibility tab when formatting it

Hi Telerik team,

We have an issue with table caption in the table wizard, this issue can be reproduce on demo site.

How to reproduce :

1. create a table using table wizard

2. go to "Accessibility tab" and add caption

3. close the table wizard

4. bold the table caption and switch to <HTML> mode, you will see "<caption><strong>table caption</strong></caption>"

5. right click mouse and open "Table Properties"

6. caption textbox is empty if you format caption

Is there any solution to fix this issue?

Thanks in advance,

Lan

Editor

answered on 28 Jan 2021

7 answers

171 views

RadAutoCompleteBox EmptyMessage bug

Sometimes the "EmptyMessage" will not show up completely (it appear cut); then if you click into the box and then click out it will show up fine after to refresh itself. Unfortunately there is not a way of reproduce this problem consistently as it happens randomly.

I would like to know if someone else has seen the problem and figured a consistent way of workaround it. I am planning a 'dirty' solution that includes to NOT use the EmptyMessage property and instead to superimpose a label over the box.

NOTE: Searching online I realized that this is an old bug that apparently was never actually fixed. I found this 6 years old thread reporting the bug: As you may see the support insisted to not have been able to see the problem. So instead to dig deeper Telerik just seated over this. Apparently the bug reporter gave up.

AutoCompleteBox

answered on 28 Jan 2021

0 answers

133 views

RadGrid: select row when mouseover and navigate to url on mouseclick

Hey all!

I am playing with a RadGrid. I bound formatted HTML to the second column so when I mouse it over it gets "selected" and when I click it page navigate for the proper url. I need the very same behavior but I'd like to select the whole row instead only one cell. Please see attached...

My current grid setup:

<telerik:RadGrid ID="RadGrid1" style="visibility:hidden;display:none;" runat="server" autopostback="true" Width="60%">

<MasterTableView AutoGenerateColumns="false">

<Columns>

<telerik:GridBoundColumn DataField="Description" HeaderText="Description" ReadOnly="True" UniqueName="Description"></telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="ConditionsAndOptions" HeaderText="Details" ReadOnly="True" UniqueName="ConditionsAndOptions"></telerik:GridBoundColumn>

<telerik:GridMaskedColumn DataField="RetailPrice" HeaderText="Price" ReadOnly="True" UniqueName="RetailPrice" Mask="##,###.##"></telerik:GridMaskedColumn>

<telerik:GridImageColumn DataType="System.String" DataImageUrlFields="PartPic" DataImageUrlFormatString="" ImageAlign="Middle" ImageHeight="" ImageWidth="100px" HeaderText="Part Pic"></telerik:GridImageColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid>

Any idea?

Grid

asked on 27 Jan 2021

5 answers

220 views

RadListBox - Issue with Items moving from Destination to Source ListBox

Hello Team,

I have an issue with sorting the Items in the RadListBox. When i try to move the Items from Source List box to the destination box, everything here works fine. But when i move the selected Items from the Destination Box to the Source Box, the items that has been moved, falls at the bottom of the box. Instead this should be at the top of the box. How can i fix this..? Please help me with some ideas.

The First images describes the Items that has been selected and to be moved in the Destination Box.
The Second image has the items moved successfully to the destination box.
The Third image describes that the items has been moved to source box , but items moved to the bottom , instead it has to be at the top of the box

<telerik:RadListBox RenderMode="Lightweight" runat="server" SelectionMode="Multiple" ID="lstSysPrin" Height="200px" Width="200px"
AllowTransfer="true" TransferToID="lstSysPrinDestination" Sort="Ascending"
ButtonSettings-AreaWidth="35px">
</telerik:RadListBox>
<telerik:RadListBox RenderMode="Lightweight" runat="server" ID="lstSysPrinDestination" SelectionMode="Multiple" Height="200px" Width="160px"
ButtonSettings-AreaWidth="35px">
</telerik:RadListBox>

ListBox

answered on 27 Jan 2021

20 answers

433 views

Image Editor Tool

Link : http://www.customink.com/lab/#shared

Hi..!

I need to create a web based Image Editor with the options available in above link.
Could anyone help me out..?

ImageEditor

answered on 26 Jan 2021

4 answers

126 views

Playing back .mpg video files

I have a lot of .mpg files that I need to view. Very impractical to convert to .mp4. Is there a way to view these type of files through MediaPlayer? If not, can you suggest another media player that I can use?

Terry

MediaPlayer

answered on 26 Jan 2021

1 answer

905 views

Kendo Data in C# Code

I'm new at my company, but a 50-year old seasoned C# Windows Forms developer.

I have been assigned to create an ASP.NET MVC Report for a web page using MVC 4.

Say I have a school database. I can pull a list of student in the C# code easily using SqlCommand and manipulate it in any way ...in the C# code. All of the examples show how to do this in javascript - which I am an idiot with. My new company is paying me to develop, not to spend days trying to figure out javascript.

On the MVC Report, they want 4 tabs:

1) All Students (Default View),

2) Elementary School Students (grades 1 - 5),

3) Middle School Students (grades 6 - 8), and

4) High School Students (grades 9 - 12).

Each tab will display similar information. There will be 4 pie charts at the top with a grid of all the data at the bottom. For the pie charts:

1) Top 10 Most Taken Classes,

2) Top 10 GPA Students,

3) Top 10 Students with Days Missed, and

4) Top 10 Classes with Highest Grades.

Once the data is collected one time, it would be simple to show this data in different tabs using a Windows Forms application.

How would I do this in ASP.NET MVC where all of the code examples show everything done from the RAZR @Html.Kendo() prompt?

Is there a way to use my C# skills for this, or does Kendo only work from javascript?

```` c#

private readonly String _CONNECTIONSTRING = ConfigurationManager.ConnectionStrings["DBConnection"].ConnectionString;
private readonly String _GETSTUDENTINFO = "SELECT STUDENTID, FIRSTNAME, LASTNAME, GRADELEVEL, CLASSNAME, CLASSGPA, ABSENTCOUNT FROM JOHNSONISD.STUDENTTABLE;";

private List<Student> studentList;

public void Test() {
studentList = GetStudents();
var elementaryStudents = studentList.Where(x => x.GradeLevel < 6);
var middleSchoolStudents = studentList.Where(x => 5 < x.GradeLevel && x.GradeLevel < 9);
var highSchoolStudents = studentList.Where(x => 8 < x.GradeLevel);
}

private List<Student> GetStudents() {
var result = new List<Student>();
var table = new DataTable();
using (var da = new SqlDataAdapter(_GETSTUDENTINFO, new SqlConnection(_CONNECTIONSTRING))) {
da.Fill(table);
}
foreach (DataRow row in table.Rows) {
var studentId = String.Format("{0}", row["STUDENTID"]);
var firstName = String.Format("{0}", row["FIRSTNAME"]);
var lastName = String.Format("{0}", row["LASTNAME"]);
var strLevel = String.Format("{0}", row["GRADELEVEL"]);
int gradeLevel;
int.TryParse(strLevel, out gradeLevel);
var className = String.Format("{0}", row["CLASSNAME"]);
var strGpa = String.Format("{0}", row["CLASSGPA"]);
double classGpa;
double.TryParse(strGpa, out classGpa);
var strabsent = String.Format("{0}", row["ABSENTCOUNT"]);
int absentCount;
int.TryParse(strabsent, out absentCount);
var student = new Student() {
StudentId = studentId,
FirstName = firstName,
LastName = lastName,
GradeLevel = gradeLevel,
ClassName = className,
ClassGpa = classGpa,
AbsentCount = absentCount,
};
result.Add(student);
}
return result;
}

public class Student {
public String StudentId { get; set; }
public String FirstName { get; set; }
public String LastName { get; set; }
public int GradeLevel { get; set; }
public String ClassName { get; set; }
public double ClassGpa { get; set; }
public int AbsentCount { get; set; }
}
````

Documentation and Tutorials

answered on 26 Jan 2021

1 answer

102 views

Out of stack space Error

Hello,

I have an Aspx page that contains 2 grids. This page works fine in my VM and in INT. But when I run it on Test, I get Out of Stack Space Error when I clicked on the event to load the edit form. Clicking cancel or save button would result the Out of Stack Space Error on method in the script source loading.

Telerik.Web.UI.RadInputManager.WebForm_OnSubmit=function(){var d=Telerik.Web.UI.RadInputManager._originalWebForm_OnSubmit();

If I only have one grid on an Aspx page, it works fine in INT & Test.

The version that we are using is version Telerik.Web.UI is 2016.2.504.45

I do see another set of script source files loaded when I clicked on the Cancel or Save button; then I get the Out of Stack Space error.

Below is the ascx code (please assumed that we have more columns in the grid) :

<telerik:RadCodeBlock ID="RadScriptBlock" runat="server">
    <script type="text/javascript">
        function caseRefreshPage() {
            try {
                var ctrl = $find("<%= RadAjaxMgr.ClientID%>");
                ctrl.ajaxRequest("info");
                return false;
            }
            catch (ex) {
            }
        }
        // SharePoint postback to work after clicking on telerik export to pdf
        if ((typeof (_spBodyOnLoadFunctionNames) != 'undefined') && (_spBodyOnLoadFunctionNames != null)) {
            _spBodyOnLoadFunctionNames.push("supressSubmitWrapper");
        }
        function supressSubmitWrapper() {
            _spSuppressFormOnSubmitWrapper = true;
        }
        var AjaxIsActive = false;
        function onRequestStart(sender, args) {
            if (!AjaxIsActive) {
                AjaxIsActive = true;
            }
            else {
                alert('Wait for ajax to finish'); return false;
            }
        }
        function onResponseEnd() {
            AjaxIsActive = false;
        }
        function rowDblClick(sender, eventArgs) {
                sender.get_masterTableView().editItem(eventArgs.get_itemIndexHierarchical());
        }
    </script>
</telerik:RadCodeBlock>
<telerik:RadAjaxManager ID="RadAjaxMgr" runat="server" OnAjaxRequest="RadAjaxMgr_AjaxRequest">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="GridAA">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="GridAA" LoadingPanelID="RadLoadingPnl" />
                <telerik:AjaxUpdatedControl ControlID="PanelNoItems" LoadingPanelID="RadLoadingPnl" />
                <telerik:AjaxUpdatedControl ControlID="RadWindowManager1" />
                <telerik:AjaxUpdatedControl ControlID="RadInputManager1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
        <telerik:AjaxSetting AjaxControlID="Grid">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="Grid" LoadingPanelID="RadLoadingPnl" />
                <telerik:AjaxUpdatedControl ControlID="RadWindowManager1" />
                <telerik:AjaxUpdatedControl ControlID="RadInputManager1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
    <ClientEvents OnRequestStart="onRequestStart" OnResponseEnd="onResponseEnd"></ClientEvents>
</telerik:RadAjaxManager>
<telerik:RadAjaxLoadingPanel ID="RadLoadingPnl" runat="server" CssClass="ecase-loading-image" />
<telerik:RadFormDecorator RenderMode="Lightweight" ID="RadFormDecorator1" runat="server" DecorationZoneID="radDiv" DecoratedControls="All" EnableRoundedCorners="false" />
          <div id="DivAA" class="panel panel-primary">
            <div class="panel-heading">Grid AA</div>

<div>
    <div id="radDiv" class="table-responsive">
        <telerik:RadGrid ID="GridAA" runat="server" AutoGenerateColumns="false" EnableViewState="true" CssClass="table"
            AllowSorting="true" AllowFilteringByColumn="true" GridLines="Horizontal" PageSize="25" FilterType="Classic"
            OnNeedDataSource="GridAA_NeedDataSource" Skin="Default" OnUpdateCommand="GridAA_UpdateCommand" ShowFooter="true" OnItemDataBound="GridAA_ItemDataBound"
            OnItemInserted="GridAA_ItemInserted" OnDeleteCommand="GridAA_DeleteCommand" OnItemCreated="GridAA_ItemCreated" OnInsertCommand="GridAA_InsertCommand">
            <ItemStyle Wrap="true" />
            <MasterTableView TableLayout="Auto" AllowMultiColumnSorting="true" AllowFilteringByColumn="false" AllowPaging="false"
                FilterItemStyle-Wrap="false" EnableNoRecordsTemplate="true" CommandItemDisplay="Top" EditMode="PopUp" DataKeyNames="PrimaryKey1" >
      <CommandItemSettings ShowRefreshButton="false" />
                <Columns>
                    <telerik:GridEditCommandColumn UniqueName="EditCommandColumn" HeaderStyle-HorizontalAlign="Center"
                        HeaderText="Edit" HeaderStyle-Width="75px" UpdateText="Update" ButtonType="FontIconButton" ItemStyle-HorizontalAlign="Center">
                    </telerik:GridEditCommandColumn>
                    <telerik:GridNumericColumn UniqueName="ColColumn1" DataField="Column1" DataType="System.Decimal" NumericType="Currency"
                        HeaderText="Column 1" EmptyDataText="" FilterControlWidth="200px" HeaderStyle-Width="200px"
                        HeaderStyle-HorizontalAlign="Right" ItemStyle-Width="200px" ItemStyle-HorizontalAlign="Right"
               Aggregate="Sum" FooterStyle-HorizontalAlign="Right" FooterAggregateFormatString="<b>Balance:   {0:C}</b>" />
              <telerik:GridButtonColumn UniqueName="ColDelete" ConfirmText="Delete this Grid AA?" ConfirmDialogType="RadWindow" ItemStyle-Width="50px"
                        ItemStyle-HorizontalAlign="Center" ConfirmTitle="Delete" ButtonType="FontIconButton" CommandName="Delete" />
                </Columns>
            </MasterTableView>
        </telerik:RadGrid>
        <asp:Panel ID="PanelNoItems" runat="server" Visible="false" >
            <span>No Grid Item. Please contact the administrator to report this issue / problem.</span>
        </asp:Panel>
    </div>
    <telerik:RadInputManager RenderMode="Lightweight" runat="server" ID="RadInputManager1" Enabled="true">
        <telerik:TextBoxSetting BehaviorID="TextBoxSetting1">
        </telerik:TextBoxSetting>
        <telerik:NumericTextBoxSetting BehaviorID="NumericTextBoxSetting1" Type="Currency"
            AllowRounding="true" DecimalDigits="2">
        </telerik:NumericTextBoxSetting>
        <telerik:NumericTextBoxSetting BehaviorID="NumericTextBoxSetting2" Type="Number"
            AllowRounding="true" DecimalDigits="0" MinValue="0">
        </telerik:NumericTextBoxSetting>
    </telerik:RadInputManager>
    <telerik:RadWindowManager RenderMode="Lightweight" ID="RadWindowManager1" runat="server" />
</div>
          </div>
          <div id="Div2" class="panel panel-primary">
            <div class="panel-heading">Grid 2</div>
<div>
    <div id="radDiv2" class="table-responsive">
        <telerik:RadGrid ID="Grid" runat="server" AutoGenerateColumns="false" EnableViewState="true" CssClass="table"
            AllowSorting="true" AllowFilteringByColumn="true" GridLines="Horizontal" PageSize="25" FilterType="Classic"
            OnNeedDataSource="Grid_NeedDataSource" Skin="Default" OnUpdateCommand="Grid_UpdateCommand" ShowFooter="true"
            OnItemCreated="Grid_ItemCreated" OnDeleteCommand="Grid_DeleteCommand" OnInsertCommand="Grid_InsertCommand">
            <ItemStyle Wrap="true" />
            <MasterTableView TableLayout="Auto" AllowMultiColumnSorting="true" AllowFilteringByColumn="false" AllowPaging="false"
                FilterItemStyle-Wrap="false" EnableNoRecordsTemplate="true" CommandItemDisplay="Top" EditMode="EditForms" DataKeyNames="AAID" >
  <CommandItemSettings ShowRefreshButton="false" />
                <Columns>
                    <telerik:GridEditCommandColumn UniqueName="EditCommandColumn" HeaderStyle-HorizontalAlign="Center"
                        HeaderText="Edit" HeaderStyle-Width="75px" UpdateText="Update" ButtonType="FontIconButton" ItemStyle-HorizontalAlign="Center">
                    </telerik:GridEditCommandColumn>
                    <telerik:GridNumericColumn UniqueName="ColColumn2" DataField="Column2" DataType="System.Decimal" NumericType="Currency"
                        HeaderText="Column 2" EmptyDataText="" FilterControlWidth="200px" HeaderStyle-Width="200px"
                        HeaderStyle-HorizontalAlign="Right" ItemStyle-Width="200px" ItemStyle-HorizontalAlign="Right"
               Aggregate="Sum" FooterStyle-HorizontalAlign="Right" FooterAggregateFormatString="<b>Balance:   {0:C}</b>" />
              <telerik:GridButtonColumn ConfirmText="Delete this Item?" ConfirmDialogType="RadWindow" ItemStyle-Width="50px"
                        ItemStyle-HorizontalAlign="Center" ConfirmTitle="Delete" ButtonType="FontIconButton" CommandName="Delete" />
                </Columns>
            </MasterTableView>
        </telerik:RadGrid>
    </div>
</div>
          </div>

Grid

answered on 26 Jan 2021