Here is my code:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="kendo_UI.WebForm1" %>
<!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/kendo/kendo.common.min.css" rel="stylesheet" />
<link href="~/Styles/kendo/kendo.default.min.css" rel="stylesheet" />
<script type="text/javascript" src="~/Scripts/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="~/Scripts/kendo/kendo.all.min.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<textarea id="editor" rows="10" cols="30"> </textarea>
<script type="text/javascript">
$(document).ready(function () {
$("#editor").kendoEditor();
});
</script>
</div>
</form>
</body>
</html>
But textarea appears without kendoEditor :-(
What's wrong?
Thank you!
And no more details ;-(
Kendo UI doesn't work with jQuery 1.9.x. You need to include jQuery 1.8.2. More info can be found in the documentation.
Related
I'm trying to use jqgrid 5.1.1 and I got this error: $('#gridMain').jqgrid is not a function.
I don't know what to do solve the problem.
Please help me!!
Here is my code
<%# page language="java" contentType="text/html; charset=EUC-KR" pageEncoding="EUC-KR"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>My First Grid</title>
<link rel="stylesheet" type="text/css" media="screen" href="/jqgrid_5.1.0/css/ui.jqgrid.css" />
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="/jqgrid_5.1.0/js/jquery.jqGrid.min.js" type="text/javascript"></script>
<script src="/jqgrid_5.1.0/js/jquery-1.11.0.min.js" type="text/javascript"></script>
<script src="/jqGrid_5.1.0/js/i18n/grid.locale-kr.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function (){
console.log("aa");
$('#gridMain').jqGrid({});
});
</script>
</head>
<body>
<h2>jqGrid test</h2>
<table id="gridMain"></table>
</body>
</html>
enter image description here
I solved the problem.
The cause was a wrong path.
Thank you for your commnet!!!
<link rel="stylesheet" type="text/css" media="screen" href="jqgrid_5.1.0/css/ui.jqgrid.css" />
<link rel="stylesheet" type="text/css" media="screen" href="jqgrid_5.1.0/css/custom.jqgrid.css" />
<link rel="stylesheet" type="text/css" media="screen" href="jqgrid_5.1.0/css/ui.jqgrid-bootstrap.css" />
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="jqgrid_5.1.0/js/jquery.jqGrid.min.js" type="text/javascript"></script>
<script src="jqgrid_5.1.0/js/i18n/grid.locale-kr.js" type="text/javascript"></script>
i am trying to this plugin https://developer.snapappointments.com/bootstrap-select/
It transforms your select into a bootstrap dropdown button. It keeps the select to keep the form consistency, so you can submit the selected value.
however, no transformation occurs.
<%# Master Language="C#" AutoEventWireup="true" CodeBehind="Site1.master.cs" Inherits="Final_Year_Project_Allocation_System.Site1" %>
<!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">
<!-- Bootstrap -->
<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen" />
<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
<script src="bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
<!-- styling select -->
<link href="silviomoreto-bootstrap-select-d4ec9bd/bootstrap-select.css" rel="stylesheet"
type="text/css" />
<script src="silviomoreto-bootstrap-select-d4ec9bd/bootstrap-select.js" type="text/javascript"></script>
<link href="silviomoreto-bootstrap-select-d4ec9bd/bootstrap-select.min.css" rel="stylesheet"
type="text/css" />
<script src="silviomoreto-bootstrap-select-d4ec9bd/bootstrap-select.min.js" type="text/javascript"></script>
<title>:: Project Allocation System</title>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<div class="container-fluid">
<form id="form1" runat="server" class="form-horizontal">
<div class="span12"><br /><br /><br /></div>
<div class="row-fluid">
<div class=" span3">
<!--Sidebar content-->
<asp:ContentPlaceHolder ID="SideBarContent" runat="server">
</asp:ContentPlaceHolder>
</div>
<div class="span9">
<!--Body content-->
<asp:ContentPlaceHolder ID="BodyContent" runat="server">
**<select class="selectpicker">
<optgroup label="Picnic">
<option>Mustard</option>
<option>Ketchup</option>
<option>Relish</option>
</optgroup>
<optgroup label="Camping">
<option>Tent</option>
<option>Flashlight</option>
<option>Toilet Paper</option>
</optgroup>
</select>**
</asp:ContentPlaceHolder>
</div>
</div>
</form>
</div>
</body>
</html>
How to make simple working (only if i remove/comment prototype) example to explain jQuery.noConflict() with prototype?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>NO Conflict</title>
<link rel="stylesheet" href="hhttp://meyerweb.com/eric/tools/css/reset/reset.css" type="text/css" media="screen, projection" /><link />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
//your javascript code
</script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/prototype/1.6.0.3/prototype.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/scriptaculous/1.8.3/scriptaculous.js"></script>
<!--[if lt IE 7]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta3)/IE7.js"></script>
<![endif]-->
</head>
<body>
<!--Example of conflict-->
</body>
</html>
http://jsbin.com/imuze3/2
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>NO Conflict</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/prototype/1.6.0.3/prototype.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
// Try decommenting the noConflict instruction to use prototype's $
//$.noConflict();
alert($('abc') == null);
</script>
</head>
<body>
<div id="abc"></div>
</body>
</html>
I can see background images in design time. But can't see images in run time. I am running my application from asp.net development server.
I am applying background images by using css.
What is the solution?
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="BackgroundImageTest._Default" %>
<!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>Untitled Page</title>
<link rel="stylesheet" href="Stylesheet1.css" type="text/css" media="screen" />
</head>
<body>
<form id="form1" runat="server">
<div>
abcdef
</div>
</form>
</body>
</html>
div
{
background-image:url(App_LocalResources/database.1.jpg);
width:400px;
height:400px;
}
Did you check if the PATH is still there in runtime ?
I tried to retrieve the value of a particular variable and alert it.
That is,I wanted to get the value "{"attributes":[{"type":"Text","labels":"Untitled1"}]}
" in that variable. Using the success: function(msg) in ajax ,I alerted the value.
But instead of the required value :{"attributes":[{"type":"Text","labels":"Untitled1"}]}
I am getting the text given below. What is the problem?
1<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>
CakePHP: the rapid development php framework: Forms
</title>
<link href="/cake_1_2/favicon.ico" type="image/x-icon" rel="icon" />
<link href="/cake_1_2/favicon.ico" type="image/x-icon" rel="shortcut icon" />
<link rel="stylesheet" type="text/css" href="/cake_1_2/css/cake.generic.css" />
</head>
<body>
<div id="container">
<div id="header">
<h1>
CakePHP: The rapid development php framework
</h1>
</div>
<div id="content">
{"attributes":[{"type":"Text","labels":"Untitled1"}]}
</div>
<div id="footer">
<a href="http://www.cakephp.org/" target="_blank">
<img src="/cake_1_2/img/cake.power.gif" alt="CakePHP: The rapid development php framework" border="0" />
</a>
</div>
</div>
</body>
The problem is that you still use the default layout. Try switching to another shipped layout for Ajax-responses:
// In your controller
$this->layout = 'ajax';