jqgrid not loaded in ui kindly help me [closed] - javascript

It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center.
Closed 11 years ago.
Hello first time i used jqgrid but data not loaded in UI
*html file:*
<!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" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>My First Grid</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/ui-redmond/jquery-ui-1.8.12.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />
<style>
html, body {
margin: 0;
padding: 0;
font-size: 75%;
}
</style>
<script src="js/jquery-1.5.2.min.js" type="text/javascript"></script>
<script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$("#list").jqGrid({
url:'/home/vbalamurugan/sename.jsp',
datatype: 'xml',
mtype: 'GET',
colNames:['PROPERTY_NAME','PROPERTY_VALUE'],
colModel :[
{name:'PROPERTY_NAME', index:'PROPERTY_NAME', width:300},
{name:'PROPERTY_VALUE', index:'PROPERTY_VALUE', width:300},
],
pager: '#pager',
rowNum:5,
rowList:[10,20,30],
sortname: '',
sortorder: 'desc',
viewrecords: true,
caption: 'Bala First Grid'
});
});
</script>
</head>
<body>
<table id="list"></table>
<div id="pager"></div></body>
</html
jsp
<%#page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%# page import="java.sql.*" %>
<%# page import="java.io.*" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
</head>
<body>
<%
String jdbcURL = "jdbc:oracle:thin:#192.168.6.38:1521:XE";
Connection conn = null;
Statement stmt = null;
ResultSet rs =null;
String user ="raymedi_hq" ;
String passwd ="raymedi_hq";
int count=8;
StringBuffer sbf=new StringBuffer(250);
try {
Class.forName("oracle.jdbc.driver.OracleDriver").newInstance();
conn = DriverManager.getConnection(jdbcURL,user,passwd);
stmt = conn.createStatement();
response.setContentType("text/xml;charset=utf-8");
response.setHeader("", "Content-type: text/xml;charset=utf-8");
sbf.append("<?xml version='1.0' encoding='utf-8'?>");
sbf.append("<page>2</page>");
sbf.append("<total>3</total>");
sbf.append("<records>"+count+"</records>");
rs = stmt.executeQuery("SELECT PROPERTY_NAME,PROPERTY_VALUE FROM HQ_FA_TAG");
while(rs.next())
{
sbf.append("<cell><![CDATA["+rs.getString("PROPERTY_NAME")+"]]></cell>");
sbf.append("<cell><![CDATA["+rs.getString("PROPERTY_VALUE")+"]]></cell>");
}
sbf.append( "</row>");
sbf.append("</rows>");
out.println(sbf.toString);
System.out.println(sbf.toString());
rs.close();rs=null;
if (conn != null){
try{
conn.close();
}catch(Exception ex2){ex2.printStackTrace();}
}
}
catch(Exception e){e.printStackTrace();}
%>
</body>
</html>

How you can see here the XML data which you posted can be read by jqGrid. I inserted only two blanks in the first line. I hope it was cut&paste errores.
Moreover I inserted type="text/css" attribzte to the <style> element and <tr><td/></tr> inside of <table> element. After the changes the validator.w3.org find no problems more. I inserted additionally height:'auto'. The parameters datatype: 'xml' and mtype: 'GET' can be also removed, because the values are default (see the documentation).

Related

javascript function is not being called if i pass a argument

the function setImg() if called with an argument is not running but if no argument is passed then the function runs what m i doing wrong please help.
<!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=iso-8859-1" />
<title>Untitled Document</title>
<script type="text/javascript">
function setImg(p)
{
window.alert(p);
document.getElementById('img').innerHTML ="<img src=p width='100' height='105'>";
}
</script>
</head>
<body>
load image
<div id="img">
</div>
</body>
</html>
You are missing the quotes for the src plus you should break up the string and add the variable to prevent it reading p as text.
Update the JS to the following:
<script type="text/javascript">
function setImg(p)
{
document.getElementById('img').innerHTML ="<img src='" + p + "' width='100' height='105'>";
}
</script>
Plus in the HTML you need to be careful with quotes:
load image
<!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=iso-8859-1" />
<title>Untitled Document</title>
<script type="text/javascript">
function setImg(p)
{
window.alert(p);
document.getElementById('img').innerHTML ="<img src=p width='100' height='105'>";
}
</script>
</head>
<body>
load image
<div id="img">
</div>
</body>
</html>
Well your were closing html attribute accidentally, you should use ' single-quotes instead.
Small mistake of quotes
change
load image
to
load image

Datepicker not working when included in another JSP file

I have a file Inside.jsp which is included in the file total.jsp. I have an inputfield in Inside.jsp. When you click in it a calendar is supposed to appear on the screen. If you are in the browser at http://localhost:8080/inside.jsp the calendar opens but if you are in http://localhost:8080/total.jsp nothing happens (the calendar doesn't open instead it's just a normal input field). What can I do to fix that?
I belivee that it has something to do with my scripts or links but it would be good to get an explanation.
Inside.jsp:
<%# page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" name="viewport"
content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="../css/total.css">
<link rel="stylesheet"
href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script
src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script>
$(function() {
$("#pickdate").datepicker();
});
</script>
<title>Inside</title>
</head>
<body>
<input type="text" id="pickdate" class="form-control">
</body>
</html>
Total.jsp:
<%# page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link
href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"
rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="../css/total.css">
<title>Total</title>
</head>
<body>
<divt><jsp:include page="Inside.jsp" /></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js></script>
<script
src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
</body>
</html>
You're actually including a complete HTML page inside another, with the head and body parts which are already in the Total.jsp page,
To solve such an issue the inside.jsp should remain clean.. just the content you want, and you should move the libraries and css loading to the Total.jsp.
And leave the inside.jsp with only fields and that script which associates datepicket to the field.
Total.jsp:
<%# page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link
href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"
rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="../css/total.css">
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<title>Total</title>
</head>
<body>
<divt><jsp:include page="Inside.jsp" /></div>
</body>
</html>
Inside.jsp:
<script>
$(function() {
$("#pickdate").datepicker();
});
</script>
<input type="text" id="pickdate" class="form-control">

How to redirect my page based on the browsers the user uses?

I have 3 index pages say
index_ch.jsp
,index_ie.jsp
,index_me.jsp
and a main parent page named
browserdetect.jsp
when the user first enters my url in a browsere browserdetect.jsp will run ...... what i need is the jquery or java script that can be put in my browserdetect.jsp which will first detect the browser the user uses and then redirect to the respective index pages based on the browser he or she uses ...... can any one help me out please
Adding this script to my head section helped me to do what i wanted .... thank you for the help guys ........
if ((navigator.userAgent.indexOf('MSIE') >= 0) && (navigator.userAgent.indexOf('Opera') < 0))
{
window.location.replace("your page");
}
else if (navigator.userAgent.indexOf('Chrome') >= 0)
{
window.location.replace("your page");
}
else
{
window.location.replace("your page");
}
</script>
This code helps you to detect browser of user.
var x = "User-agent header sent: " + navigator.userAgent;
I guess you want to detect brower of user
if ((navigator.userAgent.indexOf('MSIE') >= 0) && (navigator.userAgent.indexOf('Opera') < 0))
{
the code of index_ie.jsp...
}
else if (navigator.userAgent.indexOf('Chrome') >= 0)
{
the code of index_ch.jsp...
}
else
{
the code of index_me.jsp...
}
browserdetect.jsp ------page
<%#page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript">
function detectBrowser(){
var nAgent = navigator.userAgent;
var verOffset;
if ((nAgent.indexOf("MSIE"))!=-1) {
browserName = "Microsoft Internet Explorer";
window.location = "index_ie.jsp";
}
else if ((verOffset=nAgent.indexOf("Chrome"))!=-1) {
browserName = "Chrome";
window.location = "index_ch.jsp";
}
else if ((verOffset=nAgent.indexOf("Firefox"))!=-1) {
browserName = "Firefox";
window.location = "index_me.jsp";
}
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
</head>
<body onload="detectBrowser()">
<h1>Hello World!</h1>
</body>
</html>
===============================================================================
index_ch.jsp -----page
<%#page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
</head>
<body>
<h1>Hello World! Chrome</h1>
</body>
</html>
=========================================================================
index_ie.jsp -----page
<%#page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
</head>
<body>
<h1>Hello World! Internet Explorer</h1>
</body>
</html>
=============================================================================
index_me.jsp -----page
<%#page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
</head>
<body>
<h1>Hello World! Mozilla Firefox</h1>
</body>
</html>
you can use jsp redirecting tags
1. jsp:forward :- server side redirect [not show index_ie.jsp in the URL]
2. response.sendRedirect :-browser side redirect[ show index_ie.jsp in the URL]
instead of window .location.

AJAX Get of JSON cancels

I'm trying to get the JSON file of a certain page on reddit and it cancels with no reason why..
Here's the URL i am trying to parse with JSON. http://reddit.com/r/VillagePorn/.json
UPDATED CODE:
<!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" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>Sin título 1</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$.ajax({
type: "GET",
dataType: "json",
url: "http://reddit.com/r/VillagePorn/.json?jsonp=?",
success: function (data) {
$.each(data.data.children, function(i,item){
$("<img/>").attr("src", item.data.url).appendTo("#res");
});
}
});
});​
</script>
</head>
<body>
<div id="res"></div>
</body>
</html>
here is a working example : http://jsfiddle.net/fuRkG/
I think the issue is with the url , you need to add jsonp=? at the end
Answer based on this previous question : How to extract url data from Reddit API using JSON

Ajax.updater problem

I am new to JavaScript and here is a problem when I trying out prototype.
I want to update sample.jsp with Ajax.updater after the it is loaded, but it doesn't work. Here the source of smaple.jsp.
<%#page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
<script src="prototype.js"></script>
<script>
function f1(){
var ajax = new Ajax.updater(
{success: 'state'},'part.html'
,{method:'get'});
}
document.observe('dom:loaded', function() {
f1();
});
</script>
</head>
<body>
state:
<div id="state"></div>
<br>
</body>
</html>
Could anyone tell me what's wrong with my code?
try "Ajax.Updater" (capital U) for starters
also I recommend that you try working with firefox and the firebug plugin, it's a great way to debug your javascript
I have tried another one and it works
<%#page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>AJAX Zip Checker </title>
<link rel="stylesheet" href="style.css" type="text/css" />
<script src="prototype.js"></script>
<script type="text/javascript" language="JavaScript">
function checkZip() {
if($F('zip').length == 5) {
var url = 'checkzip.jsp';
var params = 'zip=' + $F('zip');
var ajax = new Ajax.Updater(
{success: 'zipResult'},
url,
{method: 'get', parameters: params, onFailure: reportError});
}
}
function reportError(request) {
$F('zipResult') = "Error";
}
</script>
</head>
<body>
<label for="zip">zip:</label>
<input type="text" name="zip" id="zip" onkeyup="checkZip();" />
<div id="zipResult"></div><p/>
</body>
</html>
checkzip.jsp
<%
String zip = request.getParameter("zip");
if (zip.equals("10009")) {
%>
new york
<%} else {%>
unknown
<% }%>
Could anyone tell me the difference?

Categories

Resources