read ckeditor content - javascript

I am using CKEditor in my asp.net page. For this i have added ckeditor.dll to my project.
And i am using this reference in .aspx page.
My problem is that i can not able to read ckeditor content in javascipt.
Can any one please tell me how to achive this.
Here is my code
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="CKEditorVamshi._Default" %>
<%# Register Assembly="CKEditor.NET" Namespace="CKEditor.NET" TagPrefix="CKEditor" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript" language="javascript">
function validate() {
var text = $('#cke_<%= CKEditorGettingStarted.ClientID %> iframe').contents().find('body').html();
alert(text);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<CKEditor:CKEditorControl AutoPostBack="True" ID="CKEditorGettingStarted" runat="server"
Height="300px" BasePath="~/CKEditor" MaxLength="10" Width="100%" CausesValidation="true">
</CKEditor:CKEditorControl>
<br />
<input type="button" id="btnPreview" value="Preview" onclick="validate();" />
</form>
</body>
</html>
Thank you in Advance

try
CKEDITOR.instances.Your_Editor_Client_ID.getData();

Related

Using JS functions with Jquery in ASP Pages

I'm trying to run a JS function that uses JQuery to append information to the HTML of an ASP page and I just can't get it to work. I've made some research about it but maybe it's something a lot simpler.
%# Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="Pruebas.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
</head>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript">
const add = (param) => {
alert("hi");
$("div.auto-style1").append("<p>'" + param + "'</p>");
}
</script>
<form id="form1" runat="server">
<div>
</div>
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" style="height: 26px" Text="Button" />
<asp:DropDownList ID="DropDownList1" runat="server" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">
</asp:DropDownList>
<div class="container">
some text
</div>
</form>
</body>
</html>
more specifically this is the function im trying to run
<script type="text/javascript">
const add = (param) => {
alert("hi");
$("div.auto-style1").append("<p>'" + param + "'</p>");
}
</script>
im trying to call this function from the C# code behind the page like this
protected void Button1_Click(object sender, EventArgs e)
{
String p = "this is a message";
ScriptManager.RegisterClientScriptBlock(this, GetType(), "myfunction", "add('" + p + "');", true);
}
If I try to run a JS function that produces a console log or an alert on the page it works fine. Maybe it is related to the Postback property in the ASP button?
If anyone can shed some light on this I will be thankful.
There is no any .auto-style1 class in your code. Please add a class in div to work this code.
<form id="form1" runat="server">
<div class="auto-style1">
</div>
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" style="height: 26px" Text="Button" />
<asp:DropDownList ID="DropDownList1" runat="server" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">
</asp:DropDownList>
<div class="container">
some text
</div>
</form>

Javascript not working after added Master page

Initially I able to preview image after select image. After added the master page, the javascript is not working anymore.
This is my master page
<%# Master Language="C#" AutoEventWireup="true" CodeBehind="Site1.master.cs" Inherits="Testing.Site1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
</form>
</body>
</html>
This is my content page
<%# Page Language="C#" MasterPageFile="~/Site1.Master" AutoEventWireup="true" CodeBehind="Testing1.aspx.cs" Inherits="Testing.Testing1" %>
<asp:Content ID="Content2" ContentPlaceHolderID="head" runat="server">
<script type="text/javascript">
function imagepreview(input)
{
if (input.files && input.files[0]) {
var fildr = new FileReader();
fildr.onload = function (e) {
$('#Image1').attr('src', e.target.result);
};
fildr.readAsDataURL(input.files[0]);
}
}
</script>
</asp:Content>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<asp:FileUpload ID="FileUpload1" runat="server" />
<br />
<asp:Image ID="Image1" runat="server" height="100" Width="100" />
<br />
<br />
<asp:Button ID="btnUpload" runat="server" Text="Upload" OnClick="btnUpload_Click" />
<br />
<br />
<asp:TextBox ID="tbRetrieve" runat="server"></asp:TextBox>
<br />
<asp:Button ID="btnRetrieve" runat="server" Text="Retrieve" OnClick="btnRetrieve_Click" />
<br />
<asp:Image ID="Image2" runat="server" />
<br />
<asp:Label ID="lblMessage" runat="server"></asp:Label>
<br />
<br />
</asp:Content>
And this is my code behind
protected void Page_Load(object sender, EventArgs e)
{
FileUpload1.Attributes["onchange"] = "imagepreview(this)";
if (!IsPostBack)
{
lblMessage.Visible = false;
}
}
So what is the problem?
on adding master page the code of finding the control id will be changed you will have to replace your code like this.
<script type="text/javascript">
function imagepreview(input)
{
if (input.files && input.files[0]) {
var fildr = new FileReader();
fildr.onload = function (e) {
$('#<%=Image1.ClientID%>').attr('src', e.target.result);
};
fildr.readAsDataURL(input.files[0]);
}
}
You need to use code like that in order to call your javascript method on behind.
Page.ClientScript.RegisterStartupScript(this.GetType(),"CallMyFunction","MyFunction()",true);

Why does colorbox close immediately on asp.net button OnClientClick event

In my asp.net page
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="QDCM.Site.Speaker.WebForm2" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Colorbox practice</title>
<link href="../Styles/css/colorbox.css" rel="stylesheet" />
<script src="../../Scripts/jquery-1.10.2.js"></script>
<script src="../Styles/js/jquery.colorbox.js"></script>
<script type="text/javascript">
function openColorBox() {
$.colorbox({ width: "80%", height: "80%", iframe: true, href: "../QD/AddDocmnts.aspx" });
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Button ID="Button1" runat="server" Text="This should also work!" OnClientClick="openColorBox();" />
<input type="button" value="this works!" onclick="openColorBox()" />
</div>
</form>
this <input type="button" value="open color box" onclick="openColorBox()" /> works fine, the Colorbox pops up correctly on html button onclick event
But, in this
<asp:Button ID="Button1" runat="server" Text="This should also work!" OnClientClick="openColorBox();" />
the asp.net button, it doesn't seem to work properly,
the colorbox pops up and then auto closes immediately,
How can we use it then in asp.net button ?
Try
<asp:Button ID="Button1" runat="server" Text="This should also work!" OnClientClick="openColorBox(); return false;" />
This is to cancel the default post back of button

Adding code blocks in javascript function

I'm trying to set the value of an ASP TextBox via javascript when I click a button but I can't get the ClientID of my TextBox control using code blocks.
I get this error :
The Controls collection cannot be modified because the control
contains code blocks (i.e. <% ... %>)
Here's my .aspx:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="App.aspx.cs" Inherits="StatsWeb.App" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link href="Styles/Site.css" rel="Stylesheet" type="text/css" />
<script>
function testf() {
alert("here");
document.getElementById('<%= TextBox1.ClientID %>').value = "asd";
return false;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Menu ID="Menu1" runat="server" DataSourceID="XmlDataSource1"
CssClass="Menu" StaticDisplayLevels="2" MaximumDynamicDisplayLevels="5" >
<DataBindings>
<asp:MenuItemBinding DataMember="rule" TextField="name" ValueField="value"/>
<asp:MenuItemBinding DataMember="splitByField" TextField="name" ValueField="value" NavigateUrl="javascript:testf()"/>
<asp:MenuItemBinding DataMember="splitByObject" TextField="name" ValueField="value"/>
<asp:MenuItemBinding DataMember="statDefinition" TextField="name" ValueField="value"/>
</DataBindings>
</asp:Menu>
<asp:XmlDataSource ID="XmlDataSource1" runat="server"
DataFile="~/App_Data/stats.xml"></asp:XmlDataSource>
<asp:Literal ID="Message" runat="server" Text="Status:"></asp:Literal>
<asp:TextBox ID="TextBox1" runat="server" EnableTheming="True" Height="137px"
Rows="6" TextMode="MultiLine" Width="842px"></asp:TextBox>
</div>
</form>
</body>
</html>
Replace
<asp:MenuItemBinding DataMember="splitByField" TextField="name" ValueField="value" NavigateUrl="javascript:testf()"/>
with
<asp:MenuItemBinding DataMember="splitByField" TextField="name" ValueField="value" OnClientClick="return testf()"/>

Call masterpage function from contentpage in asp.net?

I have a function on masterpage and i want to call it from content page from codebehind.
this is my trying :
ScriptManager.RegisterClientScriptBlock(this, this.GetType(), "alert__", string.Format("setStatusBarMessage('{0}',{1});", barMessage, type, ""), true);
"setStatusBarMessage" function is declare in masterpage , so this code doesnt working.
setStatusBarMessage is a client side function.
MasterPage:
<%# Master Language="C#" AutoEventWireup="true" CodeBehind="Content.master.cs"
Inherits="F8.CRM.Pages.Content" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager runat="server" />
<div>
<asp:ContentPlaceHolder ID="MainContent" runat="server">
</asp:ContentPlaceHolder>
</div>
</form>
</body>
</html>
<script type="text/javascript">
function hello() {
alert('hi mennan');
}
</script>
ContentPage :
<%# Page Title="" Language="C#" MasterPageFile="~/Pages/Content.Master" AutoEventWireup="true"
CodeBehind="Departman.aspx.cs" Inherits="F8.CRM.Departman" %>
<%# Register Src="~/Controls/Objects/StudioSideBox/StudioSideBox.ascx" TagName="StudioSideBox"
TagPrefix="uc1" %>
<%# Register Src="~/Controls/Objects/Baslik/Baslik.ascx" TagName="Baslik" TagPrefix="uc2" %>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
my html...
<script type="text/javascript">
my script codes...
</script>
</asp:Content>
This masterpage and content page is under a iframe object.
ok try the following code
I have a function in Master Page that is
<script>
function hello() {
alert('hi');
}
</script>
Now on content page' page load
protected void Page_Load(object sender, EventArgs e)
{
ScriptManager.RegisterStartupScript(this, this.GetType(), "ntmtch", "hello();", true);
}
It working. i haven't added any thing to content page.
Update
Master page's Code
<%# Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script>
function hello() {
alert('hi');
}
</script>
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
</form>
First Content Page's code
<%# Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true"
CodeFile="Default.aspx.cs" Inherits="_Default" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<iframe src="Default2.aspx"></iframe>
</asp:Content>
Code behind Of first Content Page:
protected void Page_Load(object sender, EventArgs e)
{
ScriptManager.RegisterStartupScript(this, this.GetType(), "ntmtch", "hello();", true);
}
Try this for calling master page server side function
MasterPagename ms = Master as MasterPagename ;
ms.FuctionOnMasterPage();
If u r trying to call client side function on master page, the i guess u can call it directly since ur master page and content page function will get rendered on the same html page.
Here We can Make a Object of Master Page Class and then we can Call MasterPage Function
MasterPageClassName MyMasterPage = (MasterPageClassName)Page.Master;
MyMasterPage.Functionname();
It will definitely Help you. Try It
Usually I do it so: In the markup:
<asp:Literal ID="ScriptLit" runat="server" />
In the code behind:
ScriptLit.Text = "<script>functionName();</script>"
Label lbl = (Label)this.Master.FindControl("lblBalance");
lbl.Text = "Hi";

Categories