Click here to Skip to main content
15,668,691 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
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
Updated 20-Aug-18 21:34pm
v3
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

Please remove `
<!DOCTYPE html>
` from your code. jsgrid will not support `
<!DOCTYPE html>
`.
 
Share this answer
 

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



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900