telerik radgrid get_masterTableView() not taken on binding json data to radgrid - javascript

I am binding an array of list from json to telerik RadGrid from client side. The code for binding the data object to radgrid is shown below:
<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
<script type="text/javascript">
function SetInTelerikGrid(data) {
var tableView = $find('<%=rgRetrievalList.ClientID %>').get_masterTableView();
tableView.set_dataSource(data);
tableView.dataBind();
}
</script>
</telerik:RadCodeBlock>
The radgrid definition is:
<telerik:RadGrid ID="rgRetrievalList" runat="server" >
<MasterTableView TableLayout="Auto">
<Columns>
<telerik:GridBoundColumn DataField="ID" UniqueName="ID" HeaderText="ID" >
</telerik:GridBoundColumn>
</Columns>
</MasterTableView>
</telerik:RadGrid>
Here, as the code reached var tableView = $find('<%=rgRetrievalList.ClientID %>').get_masterTableView(); an error is thrown: Typeerror: cannot read property 'get_masterTableView()' of null. I do not know why it is note able to take property get_masterTableView() of radgrid. Can anyone help me?? Thanks in advance..

As you are trying to bind Radgrid with JSON data that's why you got this error.
To resolved this issue either you have to bind your radgrid using client side binding method or add dummy data for json data binding.
Add dummy data for json data binding:
ASPX
<!DOCTYPE html>
<html>
<head runat="server">
<title></title>
<script src="Script/jquery-1.10.2.min.js"></script>
<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
<script type="text/javascript">
var GridData;
function OnbuttonClient() {
jQuery.ajax({
type: 'POST',
contentType: 'application/json; charset=utf-8',
data: '',
dataType: 'JSON',
url: 'Forum.aspx/BindGrid',
success: function (result) {
GridData = result.d;
if (GridData.length > 0) {
var divGridContainer = document.getElementById('divGridContainer');
divGridContainer.style.display = "";
var tableView = $find("<%= RadGrid1.ClientID %>").get_masterTableView();
tableView.set_dataSource(GridData);
tableView.dataBind();
}
else {
var divGridContainer = document.getElementById('divGridContainer');
divGridContainer.style.display = "none";
}
},
error: function () {
alert('Error on binding the data');
}
});
return false;
}
</script>
</telerik:RadCodeBlock>
</head>
<body>
<form id="form1" runat="server">
<div>
<telerik:RadScriptManager ID="RadScriptManager1" EnablePageMethods="true" runat="server">
</telerik:RadScriptManager>
<asp:Button ID="Button1" Text="Bind Grid" runat="server" OnClientClick="return OnbuttonClient();" />
<div id="divGridContainer" style="display: none;">
<telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="false">
<MasterTableView HierarchyLoadMode="Client" DataKeyNames="ID,ParentID" ClientDataKeyNames="ID,ParentID">
<Columns>
<telerik:GridBoundColumn DataField="ID" UniqueName="ID" HeaderText="ID">
</telerik:GridBoundColumn>
</Columns>
</MasterTableView>
</telerik:RadGrid>
</div>
</div>
</form>
</body>
</html>
ASPX.CS
protected void Page_Init(object source, System.EventArgs e)
{
}
public void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
dynamic data = new[] {
new { ID = "1", Name ="Name11",ParentID = "0"}
};
RadGrid1.MasterTableView.DataSource = data;
RadGrid1.DataBind();
}
}
protected void Page_PreRender(object sender, EventArgs e)
{
}
[WebMethod]
public static List<Employee> BindGrid()
{
List<Employee> list = new List<Employee>(); ;
Employee obj = new Employee();
obj.ID = "1";
obj.Name = "Name1";
list.Add(obj);
obj = new Employee();
obj.ID = "2";
obj.Name = "Name2";
list.Add(obj);
return list;
}
[Serializable]
public class Employee
{
public string ID { get; set; }
public string Name { get; set; }
}
Please check this link for more detail.

Related

click()/code behind is no longer execute after set InputFile

I write a page for upload a file to a server.
Before the file is uploading, there should be a question for override the file(if it on the server already)
The check(code behind/Event IndexChange) is set a variable in the client script.
If the user press the "Upload" button a script(confirm_user) check the variable and show a confirm dialog (Override ? Yes/No) and then call a C# function.
It is a ASPX Control running in a IFrame with Masterpage.
My problem:
If I test it without set an input file, it works(break point in code).
But if I select a file for upload the function is not called(press the normal Upload button works fine).
ASCX File
<%# Control Language="C#" AutoEventWireup="True" Inherits="Test_Web.UploadProgress" Codebehind="UploadProgress.ascx.cs"%>
<link rel="stylesheet" href="css/alertify.css" />
<link rel="stylesheet" href="css/themes/default.css" />
<script src="alertify.js"></script>
<script type='text/javascript'>
//hold Check state
var override = -1;
//Script is working, except Click()
function confirm_user() {
if (override == 1) {
if (confirm('Overrride?')) { document.getElementById('<%=btn_upload_nocheck.ClientID%>').click();
return true;
}
else
return false;
}
else if (override == 0) { document.getElementById('<%=btn_upload_nocheck.ClientID%>').click();
return true;
}
return false;
function setoverride(ov) {
override = ov;
alertify.alert('Info','Test: '+ ov);
}
//}
</script>
<asp:ScriptManager runat="server"></asp:ScriptManager>
<asp:UpdatePanel runat="server" ID="up_message">
<ContentTemplate>
<asp:DropDownList runat="server" ID="dd_sendungstitle" OnSelectedIndexChanged="dd_sendungstitle_SelectedIndexChanged" AutoPostBack="True">
<asp:ListItem>t1</asp:ListItem>
<asp:ListItem>t2</asp:ListItem>
<asp:ListItem>t3</asp:ListItem>
<asp:ListItem>t4</asp:ListItem>
</asp:DropDownList>
<asp:Label runat="server" ID="lbl_progress"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
<br/>
<input type="file" id="upUserCtrl" runat="server"/>
<br/>
<asp:Button ID="btn_upload_nocheck" runat="server" Text="Upload" Width="101px" align="center" OnClick="btn_upload_nocheck_Click"/>
<asp:Button runat="server" ID="btnTest" OnClientClick="return confirm_user();" Text="Upload Script"/>
Code behind File
public partial class UploadProgress: System.Web.UI.UserControl
{
protected void Page_Load(object sender, EventArgs e)
{
}
...
private void ShowMessage(string msg)
{
StringBuilder sb = new StringBuilder();
sb.Append("<body><script type='text/javascript'>alert('" + msg + "');</script></body>");
HttpContext.Current.Response.Write(sb.ToString());
HttpContext.Current.Response.Flush();
}
protected void btn_upload_nocheck_Click(object sender, EventArgs e)
{
Upload(false);
}
private void Upload(bool docheck)
{
//Upload File
int t = _override;
...
ShowMessage("File(" + filename + ") uploaded");
}
protected void dd_sendungstitle_SelectedIndexChanged(object sender, EventArgs e)
{
// Do Checking STuff
if (dd_sendungstitle.SelectedIndex == 0 || dd_sendungstitle.SelectedIndex == 3)
{
_override = 0;
}
else
{
_override = 1;
}
//Set Client Script
ScriptManager.RegisterStartupScript(Page,typeof(string), "javascript", "setoverride(" + _override + ")", true);
}
}

YesNo Confirmation ASP.NET

I am trying to get a Yes No Prompt to show client side after an if statement in code, and depending on what the user clicks to execute code.
So far I have the following:
if (barcodes[t].ToString() == txtBarcode.Text)
{
Page.ClientScript.RegisterStartupScript(this.GetType(), "Scripts", "<script>confirm('Item Already in Order, Continue?');</script>");
string confirmValue = Request.Form["confirm_value"];
if (confirmValue == "Ok")
{
itemAdd();
DBConnect.DisplayMessage(this, "Added to order");
}
else
{
DBConnect.DisplayMessage(this, "Not added");
return;
}
}
I envoke a script in the third line of the above code, which shows correctly.
However regardless of what the user chooses, it will always return negative.
Thanks in advance :)
Here's a nice and simple solution from Mudassar Ahmed Khan's website that fits your needs:
PageClientScript.aspx
<%# Page Language="C#" AutoEventWireup="true" CodeFile="PageClientScript.aspx.cs" Inherits="PageClientScript" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<script type = "text/javascript">
function Confirm() {
var confirm_value = document.createElement("INPUT");
confirm_value.type = "hidden";
confirm_value.name = "confirm_value";
if (confirm("Do you want to save data?")) {
confirm_value.value = "Yes";
}
else {
confirm_value.value = "No";
}
document.forms[0].appendChild(confirm_value);
}
</script>
<form id="form1" runat="server">
<div>
<asp:Label ID="lblDisplayMessage" runat="server" Text="Click the button to display a confirm dialog."></asp:Label>
<br /><br />
<asp:Button ID="btnConfirm" runat="server" OnClick="OnConfirm" Text="Raise Confirm" OnClientClick="Confirm()"/>
</div>
</form>
</body>
</html>
PageClientScript.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class PageClientScript : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
public void OnConfirm(object sender, EventArgs e)
{
string confirmValue = Request.Form["confirm_value"];
if (confirmValue == "Yes")
{
this.lblDisplayMessage.Text = "Added to order!";
this.Page.ClientScript.RegisterStartupScript(this.GetType(), "alert", "alert('You clicked YES!')", true);
}
else
{
this.lblDisplayMessage.Text = "Not added to order!";
this.Page.ClientScript.RegisterStartupScript(this.GetType(), "alert", "alert('You clicked NO!')", true);
}
}
}
Results:

Javascript: Call C# codebehind string function but return all HTML of current page

I am using PageMethods to call C# function from Javascript.
My C# function is return as String.
But after i called that function from Javascript it returned current page.
Here my code:
ASPX:
<form id="form1" runat="server" method="post">
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true"></asp:ScriptManager>
<script>
function testPageMethods(){
var id = 45;
PageMethods.returnStr4Frontend(id, onSucess, onError);
}
function onSucess(result) {
console.log(result);
}
function onError(result) {
console.log(has error);
}
testPageMethods();
</script>
</form>
ASPX.CS
[WebMethod]
public static string returnStr4Frontend(string id)
{
string reStr = string.Empty;
reStr = "Your id is: " + id;
return reStr;
}
When i run my page on browser, i received wrong result was (all html code of current page):
<form id="form1" runat="server" method="post">
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true"></asp:ScriptManager>
<script>
function testPageMethods(){
var id = 45;
PageMethods.returnStr4Frontend(id, onSucess, onError);
}
function onSucess(result) {
console.log(result);
}
function onError(result) {
console.log(has error);
}
testPageMethods();
</script>
</form>
Check this nugget
https://www.nuget.org/packages/HtmlAgilityPack
it will get the html code depending on the domain you entered

How to set navigateurl for radwindow in javascript?

How to set navigateurl for radwindow in javascript ?
I want to use a radwindow in my page, and I use it in tow part.
I have a radwindow that I use it in 2 part.
<telerik:RadWindowManager ID="RadWindowManager1" ShowContentDuringLoad="false"
VisibleStatusbar="false"
RegisterWithScriptManager="True"
EnableShadow="True" ReloadOnShow="true" Width="800px" Height="550px"
runat="server">
<Windows>
<telerik:RadWindow ID="modalPopup" runat="server" Modal="True"
>
</telerik:RadWindow>
</Windows></telerik:RadWindowManager>
I use javascript for show radwindow.
<telerik:RadCodeBlock runat="server" ID="rdbScripts">
<script type="text/javascript">
function showDialogInitially() {
var wnd = $find("<%=modalPopup.ClientID %>");
wnd.show();
Sys.Application.remove_load(showDialogInitially);
}
When I click on a button , set Navigateurl of radwindow = ("DefCall.aspx") and when I click to other button , set navigateurl = ("DefTask.aspx") and passe 2 value to the child page by QueryString or other way.
protected void btnDefCall_Click(object sender, EventArgs e)
{
string strURL = string.Format("../PhoneCall/DefPhoneCall.aspx
?FormTypeID={0}&FormID={1}", number1,number2);
modalPopup.NavigateUrl = strURL;
ScriptManager.RegisterStartupScript(Page, GetType(), "PopupScript", string.Format("javascript:showDialogInitially()"), true);
}
protected void btnDefTask_Click(object sender, EventArgs e)
{
string strURL = string.Format("../Task/DefTask.aspx?FormTypeID={0}&FormID={1}", (int)clsHelper.FormType.Lead, int.Parse(Request.QueryString["ID"].ToString()));
modalPopup.NavigateUrl = strURL;
ScriptManager.RegisterStartupScript(Page, GetType(), "PopupScript", string.Format("javascript:showDialogInitially()"), true);
}
Check out the RadWindow API you can change the url through javascript like this
var wnd = $find("<%=modalPopup.ClientID %>");
wnd.setUrl("http://www.google.com");
You can use window.radopen. The only trick is you need to use pageLoad which is to wait until the RadWindow is fully loaded.
protected void btnDefTask_Click(object sender, EventArgs e)
{
var script = string.Concat(
"function pageLoad() { showDialogInitially('",
"http://www.telerik.com",
"'); }");
ScriptManager.RegisterStartupScript(Page, GetType(),
"PopupScript", script, true);
}
<telerik:RadWindowManager
ID="RadWindowManager1"
ShowContentDuringLoad="false"
VisibleStatusbar="false"
RegisterWithScriptManager="True"
EnableShadow="True"
ReloadOnShow="true"
Width="800px" Height="550px"
runat="server">
<Windows>
<telerik:RadWindow ID="modalPopup" runat="server" Modal="True">
</telerik:RadWindow>
</Windows>
</telerik:RadWindowManager>
<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
<script type="text/javascript">
function showDialogInitially(url) {
window.radopen(url, "modalPopup");
return false;
}
</script>
</telerik:RadScriptBlock>

Insert data into database using ajax

I am using ajax to insert data in database
My default .aspx file is as below
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Ajax Demo</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#<%= btn_Insert.ClientID %>").click(function () {
//var name = $('#<%=txt_name.ClientID%>').val();
//var email=$('#<%=txt_email.ClientID%>').val()
var email = document.getElementById('txt_email').value;
var name = document.getElementById('txt_name').value;
//alert("{'Name':'" + name + "', 'Email':'" + email + "'}");
$.ajax({
type: 'POST',
contentType: "application/x-www-form-urlencoded; charset=utf-8",
data: "Name=" + name + "&Email=" + email,
//data: $('#form1')
async: true,
success: function (response, data)
{
$('#txt_name').val('');
$('#txt_email').val('');
alert("Record Has been Saved in Database");
alert(response.data.name);
},
error: function () {
console.log('there is some error');
}
});
return false;
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<p>
Name : <asp:TextBox ID="txt_name" runat="server" ClientIDMode="Static"></asp:TextBox>
</p>
<p>
E-mail : <asp:TextBox ID="txt_email" runat="server" ClientIDMode="Static"></asp:TextBox>
</p>
<p>
<asp:Button ID="btn_Insert" runat="server" Text="INSERT" OnClick="btn_Insert_Click"/>
</p>
</div>
</form>
</body>
</html>
and my .cs file is as below
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.SqlClient;
using System.Configuration;
using System.Data;
using System.IO;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
string Name = Request["Name"];
string Email = Request["Email"];
InsertMethod(Name, Email);
}
SqlCommand cmd;
public Boolean InsertMethod(string Name, string Email)
{
SqlConnection conn = new SqlConnection(ConfigurationManager.ConnectionStrings["connectionstring"].ConnectionString);
cmd = new SqlCommand("insert into dbo.Demo_AJAX (Name,Email)values (#name,#email)", conn);
cmd.CommandType =CommandType.Text;
cmd.Parameters.AddWithValue("#name",Name);
cmd.Parameters.AddWithValue("#email", Email);
try
{
conn.Open();
//cmd.ExecuteNonQuery();
int affected = cmd.ExecuteNonQuery();
if (affected == 1)
{
//Response.Write("Bhargav");
return true;
}
else
{
return false;
}
}
catch (Exception ex)
{
//Response.Write(ex.Message);
return false;
}
finally
{
conn.Close();
}
}
protected void btn_Insert_Click(object sender, EventArgs e)
{
}
}
When I run then it insert one blank data in database.
I don't know how to solve it.
Please any one help me.
Use webmethod then its working.
add namespace
using System.Web.Services;
Change Your Method Like
[WebMethod]
public static Boolean InsertMethod(string Name, string Email)
and remove
<asp:Button ID="btn_Insert" runat="server" Text="INSERT" />
and remove click event from .CS page
then its working.

Categories

Resources