Questions on UI for ASP.NET AJAX Forum

0 answers

105 views

Help: AJAX request giving 404 from mobile app

Hi there,
I'm writing a mobile app that uses AJAX. I have never used AJAX before so to see how AJAX works, I wrote a simple app that talks to asp.net page. The app is a simple form (one text field and submit button) in which you enter an year and click submit. Ajax call is made to results.aspx.cs page on the server which returns the result and displayed on 2nd page that is inside index.html.

When I run mobile app on local server I'm getting 404 error -- responseText: "Cannot POST /results.aspx.cs/IsLeapYear↵", status: 404, statusText: "Not Found"}.

index.html page contains the following:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="msapplication-tap-highlight" content="no" />
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width" />
    <link rel="stylesheet" href="css/jquery.mobile-1.4.5.min.css">
    <link rel="stylesheet" href="css/jqm-icon-pack-fa.css">
    <link rel="stylesheet" type="text/css" href="css/index.css" />
    <script src="js/jquery-2.1.3.min.js" type="text/javascript"></script>
    <script src="js/jquery.mobile-1.4.5.min.js" type="text/javascript"></script>
    <script>
        var SectedCityCode, URL, prov;
        $(document).bind('mobileinit', function () {
            $.mobile.pushStateEnabled = false;
        });
    </script>
    <title>Hello World</title>
</head>
<body>
    
    <div data-role="page" id="home">

        <div data-role="header">
            <h1>Test</h1>
        </div>
        <div data-role="content">
            <div data-role="main" class="ui-content">
                <div class="ui-body ui-body-a ui-corner-all">
                    <form id="checkyear" class="ui-body ui-body-a ui-corner-all" data-ajax="false">
                        <label for="txtYear">Enter the year:</label>
                        <input type="text" name="txtYear" id="txtYear" value="" />
                        <input type="button" data-theme="b" name="submit" id="submit" value="Submit">
                    </form>
                </div>
            </div>

        </div>

        <div data-role="footer" data-position="fixed">
            <h4>Page footer</h4>
        </div>
    </div>
    
    
    <div data-role="page" id="second">
        <div data-theme="a" data-role="header">
            <h3>Welcome Page</h3>
        </div>

        <div data-role="content">
            <p id="result"></p>
        </div>
        <div data-theme="a" data-role="footer" data-position="fixed">
            <h3>Page footer</h3>
        </div>
    </div>
    
    <script type="text/javascript" src="js/index.js"></script>
</body>
</html>

--------------------

index.js contains the following

$(document).on('pageinit', '#home', function () {
    $(document).on('click', '#submit', function () { // catch the form's submit event
        if ($('#txtYear').val().length > 0) {
            // Send data to server through the Ajax call
            // action is functionality we want to call and outputJSON is our data
            $.ajax({
                url: 'http://somewebsite/results.aspx.cs/IsLeapYear',
                data: '{ year: "' + txtYear.value + '"}',
                type: 'POST',
                async: 'true',
                dataType: 'json',
                success: function (result) {
                    if (result.status) {
                        result.val = "Leap Year";
                        $.mobile.changePage("#second");
                    } else {
                        result.val = "Not a Leap Year";
                    }
                },
                error: function (request, error) {
                    // This callback function will trigger on unsuccessful action
                    alert('Network error has occurred please try again!');
                }
            });
        } else {
            alert('Please fill all necessary fields');
        }
        return false; // cancel original event to prevent form submitting
    });
});

--------------------------------------------

results.aspx.cs contains the following:

[System.Web.Services.WebMethod]

public static bool IsLeapYear(int year)
{
return DateTime.IsLeapYear(year);
}

-----------------------------

Thanks

Joe

Ajax

asked on 22 Jul 2016

0 answers

189 views

Problem with RadScriptManager and CdnSettings with CombinedResource

Hi,

We are using Telerik 2016.2.607 and Asp.Net in 4.5.1.

I have set this in master page:

<telerik:RadScriptManager runat="server" ID="rsm" EnableCdn="True" EnableScriptCombine="True">

<CdnSettings TelerikCdn="Enabled" CombinedResource="Enabled" />

</telerik:RadScriptManager>

<telerik:RadStyleSheetManager runat="server" ID="rssm" EnableStyleSheetCombine="True">

<CdnSettings TelerikCdn="Enabled" CombinedResource="Enabled"/>

</telerik:RadStyleSheetManager>

But our IS starts to throw error:

Unhandled exception at line 730, column 49 in http://ajax.aspnetcdn.com/ajax/4.6/1/MicrosoftAjax.debug.js
0x800a139e - JavaScript runtime error: Sys.ArgumentTypeException: Object of type 'Telerik.Web.UI.RadAjaxManager' cannot be converted to type ''.
Parameter name: instance

On other pages no error appears but postbacks doesn't work, so some JavaScripts simply doesn't work.

Setting ScriptManager to

<telerik:RadScriptManager runat="server" ID="rsm" EnableCdn="True" EnableScriptCombine="True">

<CdnSettings TelerikCdn="Enabled" CombinedResource="Disabled" />

</telerik:RadScriptManager>

fixes this, but I want to combine files.

Is there any way how to check what is wrong?

ScriptManager and StyleSheetManager

asked on 22 Jul 2016

1 answer

184 views

Issue On Client Side Grouping 'maximum call stack size exceeded'

Hello,

We have a Rad grid with client side binding by calling Web Method via $.Ajax() function.

Here we are using client side grouping, by using ' masterTableView.groupColumn("ColumnUniqueName"); ' in Client - OnCommand event.

In such a case while grouping we have got java script error " maximum call stack size exceeded ".

So, could someone please advise is there any workaround/better way to achieve the client side grouping with client side binding

by calling Web Method via $.Ajax() function for Rad Grid?

Thanks in advance.

Grid

answered on 22 Jul 2016

3 answers

77 views

Pager Text Not changing on localization

So I have a grid inside an asp update panel. I have a dropdown list with differnet cultutres on the master page. In the need data source event handler for the grid, I check the value of the dropdown like so

Protected Sub grid_NeedDataSource(ByVal sender As Object, ByVal e As GridNeedDataSourceEventArgs) Handles grid.NeedDataSource
PopulateGrid(False)
Dim ddl As New DropDownList()
Dim strLanguage As String
ddl = CType(Me.Master.FindControl("ddlLanguage"), DropDownList)
strLanguage = ddl.SelectedValue
If strLanguage Is Nothing Or strLanguage.Length = 0 Then
strLanguage = "en-US"
End If
Dim newCulture As CultureInfo = CultureInfo.CreateSpecificCulture(strLanguage)
gridVirtualPoints.Culture = newCulture
End Sub

Here is the PopulateGrid method called in the first line of the above method

Private Sub PopulateGrid(ByVal reload As Boolean)
If CurrentUser.isAdmin Or CurrentUser.isParent Then
Dim Customers = dal.SelectCustomersByCustomerID(CurrentCustomer.CustomerID)
Dim CustomerIDs As New List(Of String)

For Each Customer As Customer In Customers
If Not Customer Is Nothing Then
CustomerIDs.Add(Customer.CustomerID)
End If
Next
//this just gets the data from the database
grid.DataSource = dal.getgriddata(CustomerIDs)
Else
grid.DataSource = dal.getgriddata(CurrentUser.UserID)
End If

If reload Then
grid.DataBind()
End If
End Sub

When I change the dropdown from the masterpage to a different language, it changes all the other values in the resx file except the page text. The really weird part is, if I change the dropdown value again it then updates the pager text to what it should have been the first time. So in other words

1. change from english to french. All the text from the resx file EXCEPT the PagerText changes.

2. Change back to English. All the text from the english rex file change correctly, and the pagertext now changes to the french pager text from the resx file.

Could this have something to do with the asp update panel?

Grid

answered on 22 Jul 2016

14 answers

367 views

upload file to Sharepoint 2013 document library for LinkManager

Hi,

i have tried the link manager on RadEditor and got it to work for uploading the document into local file system when user tried to create a download link.

i would like to check how do i preform the same action but the document is to be upload to SharePoint document library

current mockup

1.<telerik:RadEditor ID="txtOverview" runat="server" ToolsFile="~/ToolsFile.xml" EditModes="Design">

2. <DocumentManager ViewPaths="~/Documents" UploadPaths="~/Documents" />

3.</telerik:RadEditor>

Editor

answered on 22 Jul 2016

1 answer

141 views

Prevent default button behavior of "Add new record"

If a page has no other controls except a grid with the add new record command, whenever a user presses enter they get the insert behavior - even if they're in the middle of editing a record. It's confusing and annoying if you have a grid configured for modal, popup edits - and you press enter while editing. RadGrid launches a 2nd insert popup on top of the edit popup.

How can I prevent the add new button from behaving like a default button?

Thanks!

Grid

answered on 22 Jul 2016

1 answer

134 views

Allow user to select columns for custom report

I need to allow the user to select / remove columns which will be stored and displayed in a custom report. What would be the best Telerik control to start with to create this functionality? I am aware of the RadWizard, which can take them step by step in a 'custom' generation scenario.

However, I also need to create a UI which allows the user to select and remove fields, and save the selections. I have attached a screenshot of what I am looking for. Any help / directions as far as the best controls to start with would be much appreciated. Thanks!

General Discussions

answered on 22 Jul 2016

3 answers

125 views

ExternalDialogPath not taking effect

i have set the externaldialogpath for my editor but it seems that it is still taking the old dialog code.

i have confirm the path to the dialog is correct

the code is a custom web part for sharepoint 2013

<telerik:RadEditor ID="RadEditor1" runat="server" ExternalDialogsPath="/inetpub/wwwroot/wss/VirtualDirectories/siteproject/externalFiles/TelerikEditorDialogs/" DialogHandlerUrl="~/Telerik.Web.UI.DialogHandler.axd" OnClientLoad="OnClientLoad">

</telerik:RadEditor>

Editor

answered on 22 Jul 2016

3 answers

181 views

Maintaining Splitbar position on postback.

Hi all,

I am attempting to maintain the position of a RadSplitBar on postback. I am able to maintain -a- position, but am having trouble progressing it further than that.

My understanding is this:

When the RadSplitBar is moved it's related RadPane's are resized. Therefore, I would like to capture the RadPane's resize event. Unfortunately, there is no server side handling of this by default. So, I must capture OnClientResized events. This puts me off into client-side javascripting, though...and writing to Session isn't a simplistic procedure.

Is there a simple way to run some server-side code after capturing the OnClientResized event?

Ideally, it would be something like this:

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server" >

<script type="text/javascript">

function OnClientResized(pane, arg) {

pane.SaveState();

}

</script>

</telerik:RadCodeBlock>

Where SaveState is server-side code I have written to record the pane's height and width to Session. Should I be looking into AJAX for this functionality?

EDIT: (Disclaimer: This won't be very pretty.) I managed to do this, but it's quite the workaround. If you guys have any better ideas it would be appreciated.

Here's the gist of it:

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server" >

<script type="text/javascript">

function OnClientResized(pane, args) {

var context = new Object();

var paneIDandHeight = pane.get_id() + ',' + pane.get_height();

//Context is just thrown away.

CallSetDimensions(paneIDandHeight, context);

}

function CallbackOnSucceeded(result, context) {

//Logging

}

function CallbackOnFailed(result, context) {

//Logging

}

</script>

</telerik:RadCodeBlock>

public partial class _Default : System.Web.UI.Page, ICallbackEventHandler

{

protected void Page_Load(object sender, EventArgs e)

{

RegisterCallBackReference();

}

private void RegisterCallBackReference()

{

//Target: The name of a server Control that handles the client callback.

//Argument: An argument passed from the client script to the server.

//clientCallback: The name of the client event handler that receives the result of success.

//context: Client script that is evaluated on the client prior to initating the callback.

//clientErrorCallback: The name of the client event handler that handles an error.

//useAsync: True/False asynchronous postback.

String callBack = Page.ClientScript.GetCallbackEventReference(this, "arg", "CallbackOnSucceeded", "context", "CallbackOnFailed", true);

String clientFunction = "function CallSetDimensions(arg, context){ " + callBack + "; }";

Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "Call To Server", clientFunction, true);

}

#region ICallbackEventHandler Members

String returnValue;

string ICallbackEventHandler.GetCallbackResult()

{

return returnValue;

}

void ICallbackEventHandler.RaiseCallbackEvent(string eventArgument)

{

bool result = SetDimensions(eventArgument);

if (result)

{

returnValue = "Success.";

}

else

{

returnValue = "Failure.";

}

#endregion

private bool SetDimensions(string args)

{

bool saveSuccessful = false;

string[] paneIDandHeight = args.Split(',');

string paneID = paneIDandHeight[0];

string paneHeight = paneIDandHeight[1];

RadPane pane = Utilities.FindControlRecursive(Page, paneID) as RadPane;

int height = 0;

int.TryParse(paneHeight, out height);

if (!object.Equals(pane, null))

{

saveSuccessful = true;

RadPaneSetting paneSetting = RadPaneSetting.GetSettings(pane);

pane.Height = new Unit(height, UnitType.Pixel);

SavePane(pane);

}

return saveSuccessful;

}

This code won't compile if you just copy/paste it, I'm using a lot of other helper functions, but if you're stuck with this problem this would be a good place to start. From here you'll need to look up the demo example on persisting state in session.

Splitter

answered on 21 Jul 2016

4 answers

267 views

Error loading RadChart image. You may also wish to check the ASP.NET Trace for further details.

Hi All,

I am using the radchat on some pages. On development environment it work fine, but on production it is showing "Error loading RadChart image. You may also wish to check the ASP.NET Trace for further details.\Display stack trace" in alert. If i click Cancel then it show the page with-ought the chart.

First it was showing permission issue on the temp folder, i have assigned full control to everyone on temp folder. Now i am getting this alert. I have set UseSession=false.

IIS 7.5
ASP.NET 4.0
Telerik Version:- 2012.1.411.40

Please let me solution ASAP, because it is on production issue.

Thanks

General Discussions

answered on 21 Jul 2016