jeasy-ui runs the div twice - php

In master.php
<?php
//echo "session check: ".$_SESSION['session_array'];
//exit;
session_start(); // Session Starts
if( !isset($_SESSION['session_array']) )
{
header("Location: index.php");
exit;
}
include("conn.php");
?>
<!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>LMS</title>
<link rel="stylesheet" type="text/css" href="jui/themes/gray/easyui.css">
<link rel="stylesheet" type="text/css" href="jui/general.css">
<link rel="stylesheet" type="text/css" href="jui/themes/icon.css">
<script type="text/javascript" src="jui/jquery-1.6.min.js"></script>
<script type="text/javascript" src="jui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="js/jquery.validate.js"></script>
<script type="text/javascript" src="js/date.js"></script>
<script type="text/javascript" src="js/core.js"></script>
</head>
<body class="easyui-layout">
<div region="north" class="north_master" border="false" split="false" >
<div style="float:left;">
<img src="images/usr_logo.jpg" alt="Lead Management System" width="168" height="66" title="Lead Management System" >
</div>
<div style="float:right;">
<br/><br/>
<a id="logout" name="logout" href="logout.php?logout=1" class="easyui-linkbutton" iconCls="icon-cancel" onClick="javascript: return confirm('Are you sure you want to log out?');">Logout</a>
</div>
</div>
<div region="south" class="south" border="false">
<?php include('footer.php'); ?>
</div>
<div region="center" class="center" style="background-image:url(img/product-display.jpg);background-repeat:no-repeat;background-attachment:fixed;background-position:right bottom; ">
<?php
include('dashboard.php');
?>
</div>
</body>
</html>
In dashboard.php
<script language="javascript">
jQuery(document).ready(function($){
alert("check");
});
</script>
<div class="content">
<h1>Slot Dashboard</h1>
<div>
Add Slot
</div>
<table border='1' bordercolor='#B4B4B4' cellpadding='1' cellspacing='0' width='80%' align="center">
<tr align="left">
<th>Week</th>
<th>Dates</th>
<th>Status</th>
<th>Date</th>
<th>Action</th>
</tr>
<tr>
<td>1</td>
<td>09/04/2011 - 09/10/2011</td>
<td>Revised</td>
<td>09/04/2011</td>
<td>View</td>
</tr>
<tr>
<td>2</td>
<td>09/11/2011 - 09/17/2011</td>
<td>Revised</td>
<td>09/11/2011</td>
<td>View</td>
</tr>
<tr>
<td>3</td>
<td>09/18/2011 - 09/24/2011</td>
<td>Not Submitted</td>
<td>09/18/2011</td>
<td>View</td>
</tr>
</table>
</div>
Question: While master.php runs "check" alerts twice.
I need to know why "check" alerts twice. How to solve this
<div region=center>
The scripts within the div runs twice. there is some bug with jeasy-ui. Help me how to solve that.

Technically included page alert shouldn't fire twice. it is only possible in case of you add sample.php file in php.ini as auto_append_file

i found same problem in easyui every version, when script is included in to panel/layout, the script will be run twice, the reason I think:
the page be loaded in browser ,the browser run the script of page once, when dom is loaded ,the easyui render style for the node in dom, the script in the node will be called second by easyui.
this problem isn't only in layout , but in panel, Maybe even for the every thing inherit from panel.
this problem may be in the easyui's root render method, so I can't find solved for this without src.
now i have to change easyui to another ui framework.
example for theis problem, the alert be called twice in browser:
</div>
<div region="south" class="south" border="false">
</div>
<div region="center" class="center" >
<script>
alert("here");
</script>
</div>

Related

DataTables failing to be applied to a table

I'm trying to use DataTables but for some reason, it doesn't seem to be working. I'm using Bootstrap 4 and I need buttons from DataTables so that I can export the table later. I think I've added everything I need but it's not showing up. anyone know why it hasn't worked? The table is being posted from a database, it works just fine in bootstrap and all the information shows up but as soon as I try to add DataTables to it nothing seems to change.
<?php
ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);
include_once('connection.php');
if($_SERVER['REQUEST_METHOD'] == "POST" and isset($_POST['someAction']))
{
func();
}
function func()
{
$conn = mysqli_connect("localhost", "root", "", "SportsDB");
}
session_start();
if( !isset($_SESSION['username']) ){ /* Change into role = teacher or admin*/
header('Location:login.php');
}
print_r($_SESSION);
?>
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset="UTF-8">
<title>Register exporting</title>
<!--- Link to Bootstrap 4 -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
<!-- Link to Data Tables -->
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs4/jszip-2.5.0/dt-1.10.18/b-1.5.4/b-flash-1.5.4/b-html5-1.5.4/datatables.min.css"/>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/pdfmake.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/vfs_fonts.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/v/bs4/jszip-2.5.0/dt-1.10.18/b-1.5.4/b-flash-1.5.4/b-html5-1.5.4/datatables.min.js"></script>
<!-- Link to jquery -->
<script
src="http://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>
</head>
<body>
<div class='container-fluid' style='margin-top: 20px'>
<div class="row">
<div class="col-md-8 mx-auto">
<table class="table table-bordered table-hover" id='example'>
<thead>
<tr>
<td>ID</td>
<td>Username</td>
<td>T1_choice</td>
<td>T2_choice</td>
<td>T3_choice</td>
</tr>
</thead>
<tfoot>
<tr>
<td>ID</td>
<td>Username</td>
<td>T1_choice</td>
<td>T2_choice</td>
<td>T3_choice</td>
</tr>
</tfoot>
<tbody>
<?php
ini_set("display_errors", 1);
$stmt = $conn->query('SELECT * FROM Student_Choices');
while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
echo '<tr>
<td>'.$row['Unique_ID'].'</td>
<td>'.$row['Username'].'</td>
<td>'.$row['T1_Choice'].'</td>
<td>'.$row['T2_Choice'].'</td>
<td>'.$row['T3_Choice'].'</td>
</tr>
';
}
?>
</tbody>
</table>
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function() {
$('#example').DataTable();
} );
</script>
</body>
</html>
Thanks for the help. I needed to call the jquery before DataTables.

Posting variables in different pages using PHP to Create Dynamic Table

I have a question regarding dynamic tables in html and php. My goal is to create a dynamic table that displays the queried data from mysql and displays them in a table with checkboxes so the user can select questions from a question bank and then do something with them. My problem however is getting the data to be displayed. Using a certain type of mvc architecture, I need to keep the sql out of the front end html and php portions. I was wondering if anyone had any suggestions as how to post the variables from the back end(mysql query) and send them to the front end(html and php section) via curl where I can dynamically create a table with checkboxes. I have attempted the solution using bootstrap and combining sql with html and php as well. Any help would be greatly appreciated.
<?php
include('ProfessorWelcome.php');
//set up mysql connection
$con = mysql_connect("localhost", "username", "password") or die(mysql_error());
//select database
mysql_select_db("username", $con) or die(mysql_error());
?>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<meta content="" name="description">
<meta content="" name="author">
<link href="" rel="shortcut icon">
<script type="text/javascript" language="javascript" src="tablefilter.js"></script>
<title>Registration form</title><!-- Bootstrap core CSS -->
<link href="css/bootstrap.css" rel="stylesheet">
<!-- <link href="css/bootstrap-responsive.css" rel="stylesheet"> -->
<script type="text/javascript" src="cdn.datatables.net/1.10.6/css/jquery.dataTables.css"></script>
<script type="text/javascript"
src="http://cdn.datatables.net/1.10.2/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="code.jquery.com/jquery-1.11.1.min.js"</script>
<script type="text/javascript" src="cdn.datatables.net/1.10.6/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/jquery.dataTables.min.js"></script>
<link href="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="container">
<form role="form" action="#" method="POST" name="form">
<div class="row">
<div class="col-md-12">
<div class="well">
<h2 class="text-center">Question Bank</h2>
<hr width="70%">
<table id="myTable" class="table table-striped">
<thead>
<tr>
<th width="5%" style="visibility:hidden;" align="left"></th>
<th width="20%" align="left">Question</th>
<th width="20%" align="left">Difficulty</th>
<!-- <th width="7%" align="left">Last Name</th>
<th width="7%" align="center">Email</th>
<th width="7%" align="center">Gender</th>
<th width="7%" align="left">BirthDay</th> -->
</tr>
</thead>
<tbody>
<?php
//select all records form tblmember table
$query = 'SELECT Question, Difficulty FROM QuestionBank';
//execute the query using mysql_query
$result = mysql_query($query);
//then using while loop, it will display all the records inside the table
while ($row = mysql_fetch_array($result)) {
echo "<tr><td><input type='checkbox' name='checkbox' /></td><td>".$row['Question']."</td><td>".$row['Difficulty']."</td>";
}
?>
</tbody>
</table>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<button type="submit" name="submit" class="btn btn-default">Submit</button>
</div>
</div>
</div>
<script language="javscript" type="text/javascript">
$(document).ready(function(){
$('#myTable').dataTable();
});
</script>
</body>
</html>
This is how I would do it.
I added the ob_start() and ob_flush() so the Top of the page is being transmitted as you create the table.
Moved <title> to immediately follow <head>
Very Important: Moved CSS above JS in the <head>
I used heredoc syntax: PHP Manual Heredoc Syntax
Added MYSQL_NUM to:
mysql_fetch_array($results, MYSQL_NUM))
$row[0] and $row[1] can be used in a double quoted string without concatenation dots. Can also be used in here doc. $row['Question'] and $row['Difficulty'] can not.
Do you realize the overhead associated with jQuery? You do not need any JS in this page. But you created a lot more work for the Browser and are making the visitor wait while the Browser does all that unnecessary work.
I would 86 the JS and jQuery. And NO Bootstrap. Learn CSS.
<?php ob_start("ob_gzhandler");
include('ProfessorWelcome.php');
echo <<<EOT
<html lang="en">
<head><title>Registration form</title>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<meta content="" name="description">
<meta content="" name="author">
<link href="" rel="shortcut icon">
<link href="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
<link href="css/bootstrap.css" rel="stylesheet">
<script type="text/javascript" language="javascript" src="tablefilter.js"></script>
<!-- Bootstrap core CSS -->
<script type="text/javascript" src="cdn.datatables.net/1.10.6/css/jquery.dataTables.css"></script>
<!-- <link href="css/bootstrap-responsive.css" rel="stylesheet"> -->
<script type="text/javascript"
src="http://cdn.datatables.net/1.10.2/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="code.jquery.com/jquery-1.11.1.min.js"</script>
<script type="text/javascript" src="cdn.datatables.net/1.10.6/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/jquery.dataTables.min.js"></script>
</head>
<body>
<div class="container">
<form role="form" action="#" method="POST" name="form">
<div class="row">
<div class="col-md-12">
<div class="well">
<h2 class="text-center">Question Bank</h2>
<hr width="70%">
<table id="myTable" class="table table-striped">
<thead>
<tr>
<th width="5%" style="visibility:hidden;" align="left"></th>
<th width="20%" align="left">Question</th>
<th width="20%" align="left">Difficulty</th>
<!-- <th width="7%" align="left">Last Name</th>
<th width="7%" align="center">Email</th>
<th width="7%" align="center">Gender</th>
<th width="7%" align="left">BirthDay</th> -->
</tr>
</thead>
<tbody>
EOT;
ob_flush();
//set up mysql connection
$con = mysql_connect("localhost", "username", "password") or die(mysql_error());
//select database
mysql_select_db("username", $con) or die(mysql_error());
//select all records form tblmember table
$query = 'SELECT `Question`, `Difficulty` FROM `QuestionBank` ';
//execute the query using mysql_query
$result = mysql_query($query);
//then using while loop, it will display all the records inside the table
while ($row = mysql_fetch_array($results, MYSQL_NUM)); {
echo "<tr><td><input type='checkbox' name='checkbox' /></td><td>$row[0]</td><td>$row[1]</td>\n";
}
echo <<<EOT
</tbody>
</table>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<button type="submit" name="submit" class="btn btn-default">Submit</button>
</div>
</div>
</div>
<script language="javscript" type="text/javascript">
$(document).ready(function(){
$('#myTable').dataTable();
});
</script>
</body>
</html>
EOT;
ob_end_flush();
?>

loading tabs with ajax fails to show panes

I have a master page that uses ajax to load contents in a div named 'Wrapper'.
Now I have a problem loading jquery UI tabs this way. I can load and show them if I ignore using AJAX. But when Using ajax just the tabs are being shown and not the panes! I have read all the topics regarding this issue but they didn't solve my problem.
JQuery code is :
$(function(){
$('#link').live('click',function(){
$.ajax({
url: "tabs.php",
success: function(response)
{
$("#Wrapper").html(response);
console.log(response);
}
});
});
});
The tabs.php :
<!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="fa-ir" lang="fa-ir">
<head>
<script type="text/javascript" src="Scripts/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="Scripts/menu.js"></script>
<script type="text/javascript" src="Scripts/jquery.cycle.all.js"></script>
<script type="text/javascript" src="Scripts/jquery.easing.1.3.js"></script>
<link rel="stylesheet" href="css/jquery-ui-1.10.3.custom.css" />
<script type="text/javascript" src="Scripts/jquery-ui-1.10.3.custom.js"></script>
<style>
div.panes div h2
{
margin:5px 0 15px 0;
}
</style>
<link rel="stylesheet" type="text/css" href="css/tabs.css"/>
<link rel="stylesheet" type="text/css" href="css/tabs-panes.css"/>
<style type="text/css">
div.panes div
{
-background:#fff;
height:auto;
}
div.panes label
{
margin-bottom:15px;
display:block;
}
label.error
{
color:red;
}
body
{
background-color:#d4d6da;
}
</style>
<link rel="stylesheet" type="text/css" href="css/mystyle.css">
<link rel="stylesheet" type="text/css" href="css/syntax.css"/>
<link rel="stylesheet" type="text/css" href="css/demos.css"/>
</head>
<body>
<table style="width:100%;height:auto;border:1px dashed blue;" >
<tr>
<td align="center">
<div id="wizard_tabs">
<!-- tabs -->
<ul class="tabs">
<li>1- File upload</li>
<li>2- Proj explanation</li>
</ul>
<!-- form and panes -->
<form action="projects-regEN.php" method="post" enctype="multipart/form-data">
<div class="panes" style="font-family:tahoma">
<div style="border:1px solid #1c94c4;" id="tabs-1">
<table id="projINFO" style="width:100%">
<tr>
<td>
<span class="innerStyle">Title</span>
</td>
<td>
<input type="text" style="width:150px" maxlength="50" id="projectTitle" name="projectTitle"/>
</td>
</tr>
<tr>
<td style="width:31%" >
<span class="innerStyle">Proj Upload</span>
</td>
<td style="width:30%">
<input type="file" id="projectUpload" name="projectUpload"/>
</td>
</tr>
</table>
<br/>
<input type="button" class="next" id="next" name="continue"/>
</div>
<div style="border:1px solid #1c94c4;" id="tabs-2">
<table style="width:100%;border:1px solid black;font-family:tahoma;font-size:11px">
<tr>
<th>
title
</th>
</tr>
<tr>
<td id="firstCol"></td>
</tr>
</table>
<br/>
<span class="innerStyle">explanation</span>
<textarea rows="4" maxlength="150" class="formItems" id="ProjInfo" name="ProjInfo" placeholder="پیام خود را اینجا وارد کنید"></textarea>
<input type="submit" id="submitproj" name="done"/>
</div>
</div>
</form>
</div>
<script src="http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js"></script>
<script>
$(function(){
var wizard = $("#wizard_tabs");
$("ul.tabs", wizard).tabs("div.panes > div", function(event, index)
{
projUp=$("#projectUpload").val();
projTi=$("#projectTitle").val();
if (index > 0 && (projUp==''|| projTi=='' ))
{
$("#projectUpload").parent().addClass("error");
return false;
}
$("#projectUpload").parent().removeClass("error");
});
// get handle to the tabs API
var api = $("ul.tabs", wizard).data("tabs");
$(".next", wizard).click(function()
{
projUp=$("#projectUpload").val();
projTi=$("#projectTitle").val();
if(projUp!='' && projTi!='')
api.next();
});
});
</script>
</td>
</tr>
</table>
</body>
</html>
Using the papers I have read I tried initializing :
$("ul.tabs").tabs("div.panes <> div");
I put it in the success function of ajax but it didn't help. I also put it in the tabs.php but neither it helped. I don't know what else to do?!
Based on where I put the initial statement, it gives me different errors like:
"Uncaught Error:cannot call methods on tabs prior to initialization; attempted to call method 'div.panes > div'"
or
"Uncaught TypeError: Object [object Object] has no method 'tabs' "
Thanks
It looks like there is a small error (though maybe a typo for the question) in your code: <> should simply be >. Also, are you including every js file you need for tabs to work? The second error indicates that a required JS file/class may be missing.
For example, you may have included the jquery base, but did you include tools?
<script src="http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js"></script>

Agile Example Gone Wrong

I'm using Agile Toolkit version 4.2.4 trying to implement the Exchanging rows between grids example found here: https://agiletoolkit.org/doc/grid/interaction
I have created the TSGrid class with the following code:
class TSGrid extends Grid {
function setReloadThis($view){
if($id=$_GET[$this->name.'_chsex']){
// do note, usually we supply 2 arguments for set() function. Second
// argument is being properly quoted (or parametrized), however in this
// case no quoting is required. Hence all the statement goes into first
// argument.
$this->dq->set('gender=if(gender="M","F","M")')
->where('id',$id)
->do_update();
// univ()->page() method updates page content through AJAX. In this case each
// grid is unaware of other objects on the page. So to keep it safe, we will refresh
// page completely.
$view->js()->reload()->execute();
}
return $this;
}
function init(){
parent::init();
$g=$this;
// When you are making your own classes, you must always keep in mind
// that those objects must be just as re-usable as original grids. In our case
// we do set the table and fields, however we leave it up to parent to set the
// additional conditions on our query. This is a major reason for the philosophy
// of Agile Toolkit saying to keep properties public.
$g->addColumn('text','name');
$g->addColumn('text','surname');
$g->addColumn('text','gender');
$g->addColumn('button','chsex','Change Sex');
$g->setSource('test');
}
function defaultTemplate(){
return array('grid_striped');
}
}
and inserted it in the lib folder of the agile toolkit installation.
I have created a test page with the following code:
class page_test extends Page {
function init(){
parent::init();
$p=$this;
$c=$p->add('View_Columns');
$col=$c->addColumn();
$col->add('H3')->set('Male list');
$col->add('TSGrid')
->setReloadThis($c)
->dq
->where('gender','M');
$col=$c->addColumn();
$col->add('H3')->set('Female list');
$col->add('TSGrid')
->setReloadThis($c)
->dq
->where('gender','F');
}
}
In my database, I have made the "test" table with id, name, surname and gender fields.
When I click the "Change sex" button, I get this:
"Error in AJAXec response: SyntaxError: Unexpected token <"
The AJAX response from the server is:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Agile Toolkit</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="shortcut icon" href="./atk4/templates/shared/images/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" type="text/css" href="./atk4/templates/shared/css/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="./atk4/templates/shared/css/atk-main.css" />
<link rel="stylesheet" type="text/css" href="./atk4/templates/default/css/atk-custom.css" />
<script type="text/javascript" src="./atk4/templates/js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="./atk4/templates/js/start-atk4.js"></script>
<script type="text/javascript" src="./atk4/templates/js/jquery-ui-1.9.2.min.js"></script>
<script type="text/javascript" src="./atk4/templates/js/ui.atk4_loader.js"></script>
<script type="text/javascript" src="./atk4/templates/js/ui.atk4_notify.js"></script>
<script type="text/javascript" src="./atk4/templates/js/atk4_univ.js"></script>
<!--[if IE 8]>
<link rel="stylesheet" type="text/css" href="./atk4/templates/shared/css/ie8.css"/>
<script type="text/javascript" src="./atk4/templates/shared/css/ie8.js"></script>
<![endif]-->
<script type="text/javascript">
$(function(){
$.atk4.includeJS("./atk4/templates/js/atk4_univ.js");
$.atk4.includeJS("./atk4/templates/js/ui.atk4_notify.js");
$.atk4.includeJS("./atk4/templates/js/ui.atk4_grid.js");
$.atk4.includeJS("./atk4/templates/js/ui.atk4_grid.js");
$.atk4(function(){ $('#agiletoolkit_test_view_columns_view_columns_column_tsgrid').find('.button_chsex').button();
$('#agiletoolkit_test_view_columns_view_columns_column_tsgrid').atk4_grid([]);
$('#agiletoolkit_test_view_columns_view_columns_column_2_tsgrid').find('.button_chsex').button();
$('#agiletoolkit_test_view_columns_view_columns_column_2_tsgrid').atk4_grid([]);
; });
});
</script>
</head>
<body>
<div id="atk-layout" class="atk-wrapper">
<div id="header">
<div id="atk-logo" class="ui-widget-header float-left"><img src="./atk4/templates/shared/images/logo.png" /></div>
<div id="header-right">
<script>
$(document).ready(function(){
$('.atk-menu-horizontal>ul>li:first-child').addClass("ui-corner-left");
$('.atk-menu-horizontal>ul>li:last-child').addClass("ui-corner-right");
$('.atk-menu-vertical>ul>li:first-child').addClass("ui-corner-top");
$('.atk-menu-vertical>ul>li:last-child').addClass("ui-corner-bottom");
$('.atk-menu .ui-state-default').hover(function() {
$(this).addClass("ui-state-hover");
}, function() {
$(this).removeClass("ui-state-hover");
});
});
</script>
<div id="agiletoolkit_menu" class="atk-menu atk-menu-horizontal ui-widget">
<ul>
<li class="ui-state-default">Welcome</li>
<li class="ui-state-default">Test1</li>
<li class="ui-state-default">Test2</li>
<li class="ui-state-active">Test3</li>
<li class="ui-state-default">Logout</li>
</ul>
</div>
<div id="atk-version"><b>Agile Toolkit™</b><br/><i><div id="agiletoolkit_licensor_upgradechecker" class="" style="">4.2.4 unlicensed</div>
</i></div>
</div>
</div>
<div id="agiletoolkit_test" class="page_test">
<div id="agiletoolkit_test_view_columns" class="atk-flexy">
<div id="agiletoolkit_test_view_columns_view_columns_column" class="" style=";width:50%"><H3 id="agiletoolkit_test_view_columns_view_columns_column_h3" class="" style="">Male list</H3>
<div id="agiletoolkit_test_view_columns_view_columns_column_tsgrid" class="atk-grid ">
<div class="atk-grid-panel"></div>
<table width="100%">
<thead class="ui-widget-header"><tr>
<th id="" class="ui-widget-header" nowrap >Name</th>
<th id="" class="ui-widget-header" nowrap >Surname</th>
<th id="" class="ui-widget-header" nowrap >Gender</th>
<th id="" class="ui-widget-header" nowrap style="width: 40px; text-align: center">Change Sex</th>
</tr></thead>
<tbody class="grid_body">
<tr class="" data-id="0" rel="0">
<td style="white-space: nowrap">stef</td>
<td style="white-space: nowrap">stefanel</td>
<td style="white-space: nowrap">M</td>
<td style="white-space: nowrap"><button type="button" class="button_chsex" onclick="$(this).univ().ajaxec('/agiletoolkit/?page=test&chsex=0&agiletoolkit_test_view_columns_view_columns_column_tsgrid_chsex=0')">Change Sex</button></td>
</tr>
</tbody>
</table>
</div>
</div>
<div id="agiletoolkit_test_view_columns_view_columns_column_2" class="" style=";width:50%"><H3 id="agiletoolkit_test_view_columns_view_columns_column_2_h3" class="" style="">Female list</H3>
<div id="agiletoolkit_test_view_columns_view_columns_column_2_tsgrid" class="atk-grid ">
<div class="atk-grid-panel"></div>
<table width="100%">
<thead class="ui-widget-header"><tr>
<th id="" class="ui-widget-header" nowrap >Name</th>
<th id="" class="ui-widget-header" nowrap >Surname</th>
<th id="" class="ui-widget-header" nowrap >Gender</th>
<th id="" class="ui-widget-header" nowrap style="width: 40px; text-align: center">Change Sex</th>
</tr></thead>
<tbody class="grid_body">
<tr class="" data-id="0" rel="0">
<td style="white-space: nowrap">eu</td>
<td style="white-space: nowrap">eueu</td>
<td style="white-space: nowrap">F</td>
<td style="white-space: nowrap"><button type="button" class="button_chsex" onclick="$(this).univ().ajaxec('/agiletoolkit/?page=test&chsex=0&agiletoolkit_test_view_columns_view_columns_column_2_tsgrid_chsex=0')">Change Sex</button></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<div id="atk-footer-guard"></div>
</div>
<div id="footer" class="atk-wrapper">
This system is implemented using Agile Toolkit. © 1999–2012. See License
</div>
<div id="atk-growl-holder" class="atk-growl"></div>
</body>
</html>
Demo page is using older toolkit version, than in master branch. If you use example with master branch, you need following change:
$this->dq
->set('gender', $this->api->db->dsql()->expr('if(gender="M","F","M")'))
->where('id',$id)
->do_update();
this is due to change in dsql object.
here is working example with latest toolkit version

session variable not increment regularly

I am developing a smartphone web app that is a game of question answer using jquerymobile API.
when a user click on next button that is a anchor tag then i switch to other page and increment the $_SESSION['questionNo'] value. The problem is $_SESSION['questionNo'] value increment from 1 to 4 and then again became $_SESSION['questionNo'] is 1. why it's happening i don't know. Here is my code
<?php session_start();
include("connect.php");
include("header1.php");
$attemp=$_SESSION['questionNo'];
echo $attemp;
$sql = sprintf("select * from question order by pk_id ASC limit %s,%s",$attemp,1);
$result = mysql_query($sql) or die(mysql_error());
$result2=mysql_fetch_array($result);
?>
<div data-role="page" id="group">
<div class="main">
<div id="header2" class="clearfix">
<table border="0" width="100%" id="table">
<tr><td colspan="5"><hr></td></tr>
<tr>
<td colspan="2" id="menu_button1">
Reset
</td>
<td align="center">
Score : 50%
</td>
<td> </td>
<td id="menu_button2">
Next
</td>
</tr>
-------------
test.php page
-------------
<!DOCTYPE html>
<html>
<head>
<title>My Page</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="css/style.css" media="handheld, screen" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="../css/jquery.mobile-1.0a1.min.css"/>
<script src="jquery-1.4.3.min.js"></script>
<script src="jquery.mobile-1.0a2.min.js"></script>
<script src="jquery-1.8.2.min.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="header">
<h1>My Title</h1>
</div>
<div data-role="content">
<?php
++$_SESSION['questionNo'];
header('Location:startGame.php');
exit;
?>
</div><!-- /content -->
</div><!-- /page -->
</body>
can any one tell me why $_SESSION['questionNo'] not incrementing regularly???
Use session_start():
<?php
session_start();
++$_SESSION['questionNo'];
header('Location:startGame.php');
exit;
?>

Categories