Solved

JQuery / Ajax

Posted on 2012-04-04
5
309 Views
Last Modified: 2012-04-09
I'm trying out a bunch of new things and maybe i'm trying to combine too many things into one.

i have a basic click here which makes a div with logon visible - do a standard mysql/php login - if successful hide the div.

I then want to reveal a div with the grid  http://www.jqgrid.com/
on it's own the code below :
<script type="text/javascript">
// We use a document ready jquery function.
jQuery(document).ready(function(){
jQuery("#list2").jqGrid({
    // the url parameter tells from where to get the data from server
    // adding ?nd='+new Date().getTime() prevent IE caching
    url:'example.php?nd='+new Date().getTime(),
    // datatype parameter defines the format of data returned from the server
    // in this case we use a JSON data
    datatype: "json",
    // colNames parameter is a array in which we describe the names
    // in the columns. This is the text that apper in the head of the grid.
    colNames:['Inv No','Date', 'Client', 'Amount','Tax','Total','Notes'],
    // colModel array describes the model of the column.
    // name is the name of the column,
    // index is the name passed to the server to sort data
    // note that we can pass here nubers too.
    // width is the width of the column
    // align is the align of the column (default is left)
    // sortable defines if this column can be sorted (default true)
    colModel:[
        {name:'id',index:'id', width:55},
        {name:'invdate',index:'invdate', width:90},
    	{name:'name',index:'name asc, invdate', width:100},
        {name:'amount',index:'amount', width:80, align:"right"},
        {name:'tax',index:'tax', width:80, align:"right"},		
        {name:'total',index:'total', width:80,align:"right"},		
        {name:'note',index:'note', width:150, sortable:false}		
    ],
    // pager parameter define that we want to use a pager bar
    // in this case this must be a valid html element.
    // note that the pager can have a position where you want
    pager: jQuery('#pager2'),
    // rowNum parameter describes how many records we want to
    // view in the grid. We use this in example.php to return
    // the needed data.
    rowNum:10,
    // rowList parameter construct a select box element in the pager
    //in wich we can change the number of the visible rows
    rowList:[10,20,30],
    // path to mage location needed for the grid
    imgpath: 'themes/sand/images',
    // sortname sets the initial sorting column. Can be a name or number.
    // this parameter is added to the url
    sortname: 'id',
    //viewrecords defines the view the total records from the query in the pager
    //bar. The related tag is: records in xml or json definitions.
    viewrecords: true,
    //sets the sorting order. Default is asc. This parameter is added to the url
    sortorder: "desc",
    caption: "Demo"
});
});
</script>

Open in new window


with
<table id="list2" class="scroll" cellpadding="0" cellspacing="0"></table>

<!-- pager definition. class scroll tels that we want to use the same theme as grid -->
<div id="pager2" class="scroll" style="text-align:center;"></div>
in the <body> works - but i want this to only kick in when the login is successful.

assistance direly needed.
0
Comment
Question by:blue-genie
  • 3
  • 2
5 Comments
 
LVL 40

Expert Comment

by:gurvinder372
ID: 37805661
So, rather than writing these lines 4-52 in document.ready(), you need to invoke these lines once the login is successful
0
 
LVL 39

Author Comment

by:blue-genie
ID: 37805813
hey gurvinders - yeah i thought as much - but I couldn't figure out how to execute it.
I have a block of code that catches the successful ajax action - and i've tried putting the code in there - but it doesn't do anything.

function submitFinished( response ) {
  response = $.trim( response );

  if ( response == "success" ) {

   <-- put it here - but doesn't work - should there be a specific way of doing it?
.....
0
 
LVL 40

Expert Comment

by:gurvinder372
ID: 37805842
what is the value of response?
0
 
LVL 39

Accepted Solution

by:
blue-genie earned 0 total points
ID: 37805991
success - that part does work, i have another little div that says login successful that pops up accordingly - just trying to trim the bits of fluff out to resolve this.
0
 
LVL 39

Author Closing Comment

by:blue-genie
ID: 37822714
I'm accepting my own comment as the solution to close the question. After much fiddling i've managed to make it work in an acceptable fashion.
I'm adding the content to a div - and hiding it and unhiding it when the login is successful.

not the tidiest of methods but until I find a proper pointer in jQuery forum, this will have to do. I don't have too much time to play with this right now.
0

Featured Post

IT, Stop Being Called Into Every Meeting

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

Join & Write a Comment

Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

759 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

20 Experts available now in Live!

Get 1:1 Help Now