My jsgrid is not showing on HTML page

Question

0.00/5 (No votes)

See more:

, +

What I have tried:

I am trying to write an html page that add values from local storage and show it on jsgrid(Lightweight Grid jQuery Plugin - jsGrid[^]) including sorting . but i am not able do it. the grid itself is not showing on the web page. can any one help me

this is the code which i tried can any one can please tell me how to add jsgrid code to it to accept the value from local storage and show it after sorting.

HTML

<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="utf-8">
	<title>DATA MANAGER</title>
	<meta name="description" content="Hello World">
	
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css">
    
    
	<link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jsgrid/1.4.1/jsgrid.min.css" />
    <link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jsgrid/1.4.1/jsgrid-theme.min.css" />
    
    <link type="text/css" rel="stylesheet" href="jsgrid.min.css" />
    <link type="text/css" rel="stylesheet" href="jsgrid-theme.min.css" />
	<style>
	.blue
		{
		background-color: #428BCA;
		padding: 10px;
		} 
	.heading
		{
                padding: 10px;
		}
    .form
        {
            padding: 20;
        }

	
	</style>
    
    <script>
        function save()
                            {
                                var v1=document.getElementById('email').value;
                                var v2=document.getElementById('username').value;
                                var v3=document.getElementById('age').value;
                                localStorage.setItem('email',v1);
                                localStorage.setItem('username',v2);
                                localStorage.setItem('age',v3);
                            }
    </script>
    

    
</head>



<body>

	<header>
	</header>

		<div class="blue">
			<div class="container">
			<div class="heading text-center"><h2>SAVAD'S DATA MANAGER TASK</h2></div>
			
			</div>
		</div>
    
    
<br><br><br><br><br><br>

    <div style="width:1250px; margin:0 auto;">
    <h1>Enter Details</h1>
    </div>
      <div class = "col-md-6 text-left">
     <!-- Content goes here --> 
            <form>
                <fieldset class="form-group">
                    
                    <div class="col-xs-10">
                            <label for="email">Enter Email Address</label>
                            <input type="email" class="form-control input-lg" id="email" placeholder="emailAddress" >
                            <label for="username">Enter username</label>
                            <input type="username" class="form-control input-lg" id="username" placeholder="username" >
                            <label for="age">Enter Age</label>
                            <input type="age"class="form-control input-lg" id="age" placeholder="age" >
                    <br>
                           <input type="button" value="save" />
                        
                    </div>
                </fieldset>
            </form>
            <h1>col1</h1>
   </div> 
    <div class = "col-md-6 text-left">
      <!-- Content goes here -->
        <h1>col2</h1>
        <div id="jsGrid">
   
        </div>
    </div>

    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jsgrid/1.4.1/jsgrid.min.js"></script>
	<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
    
    
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jsgrid/1.4.1/jsgrid.min.js"></script>

    
</body>
</html>

What I have tried:

I am trying to write an html page that add values from local storage and show it on jsgrid(Lightweight Grid jQuery Plugin - jsGrid[^]) including sorting . but i am not able do it. the grid itself is not showing on the web page. can any one help me

this is the code which i tried can any one can please tell me how to add jsgrid code to it to accept the value from local storage and show it after sorting

Posted 5-Jun-16 2:24am

veena nair

Updated 20-Aug-18 21:34pm

Sergey Alexandrovich Kryukov

v3

Add a Solution

Comments

Sergey Alexandrovich Kryukov 5-Jun-16 11:28am

Next time, please use pre element with the attribute lang, in your case, lang="HTML" (it also covers XML).
Click "Improve question" to see my formatting fix. It' won't work for comment, so write all code in your question.
—SA

1 solution

Add a Solution

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Member 10986884 · Answer 1 · 2018-08-20T21:34:00

Solution 1

Please remove `

<!DOCTYPE html>

` from your code. jsgrid will not support `

<!DOCTYPE html>

`.

Posted 20-Aug-18 21:34pm

Member 10986884

My jsgrid is not showing on HTML page

1 solution

Solution 1

Add your solution here

Preview 0

My jsgrid is not showing on HTML page

1 solution

Solution 1

Add your solution here

Preview 0

Existing Members

...or Join us