JQuery Tab Events Triggers - php

I want to see tab No. 2 when "IF Condition" will meet the requirements. Here is my code. Please advice me how can I do this.
Thanks
Shahid
<?php
//Authorization / Security
session_start();
?>
<!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>Untitled Document</title>
<link type="text/css" href="../javascript/jquery/themes/ui-lightness/jquery.ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../javascript/jquery/jquery-1.4.2.js"></script>
<script type="text/javascript" src="../javascript/jquery/ui/jquery.ui.core.js"></script>
<script type="text/javascript" src="../javascript/jquery/ui/jquery.ui.widget.js"></script>
<script type="text/javascript" src="../javascript/jquery/ui/jquery.ui.tabs.js"></script>
<script type="text/javascript">
$(function() {
alert('main');
$("#container").tabs({
ajaxOptions: {
error: function(xhr, status, index, anchor) {
$(anchor.hash).html("Couldn't load this tab. We'll try to fix this as soon as possible. If this wouldn't be a demo.");
}
}
});
});
</script>
<?php
if($_GET['action'] == "add")
{
////////////////// Trigger Tab No. 2 ////////////////
///////////////// and ///////////////
//////////////// change url of Tab 3 ///////////////
}
?>
</head>
<body leftmargin="0" topmargin="0">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="2"><?php include("../includes/headerone.php");?></td>
</tr>
<tr>
<td width="15%"><?php include("../includes/leftbar.php");?></td>
<td width="83%" ><div id="container">
<ul class="tabs-nav">
<li><span>Add</span></li>
<li><span>Edit</span></li>
<li><span>View</span></li>
</ul>
</div></td>
</tr>
<tr>
<td colspan="2"><?php include("../includes/footer.php");?></td>
</tr>
</table>
</body>
</html>

Try your script tag like this, it adds javascript to do what you want by echoing it into the self calling anonymous function if the php condition is met
<script type="text/javascript">
$(function() {
alert('main');
$("#container").tabs({
ajaxOptions: {
error: function(xhr, status, index, anchor) {
$(anchor.hash).html("Couldn't load this tab. We'll try to fix this as soon as possible. If this wouldn't be a demo.");
}
}
});
<?php
if($_GET['action'] == "add"){
echo "$('.tabs-nav li a:eq(1)').trigger('click');";
echo "$('.tabs-nav li a:eq(2)').attr('href', 'newurl');";
}
?>
});
</script>

Related

Link URL to image or Title rather than echo link , retriving image,title and link from database in php

I am getting image, title and external URL from database, and display it on my page, code is working well, But i don't want to display URL, I want when I click image or title it should go direct to that URL in new window. My Code is
<?php
include_once("init.php");
$msg='';
$adDir ='./'.EDITORIALNEWS;
$qr = mysql_query("select * from " .enews) or die('Error in connection');
while($rs = mysql_fetch_array($qr))
{
$adv = '';
if($rs['adv']!='') {
$adv = '<img src="'.$adDir.$rs['adv'].'" style="width:60px; height:60px" > ';
}
$image = $adv;
$msg .='<tr>
<td>'.$image.'</td>
<td>'.$rs['title'].'</td>
<td>'.$rs['adv_url'].'</td>
</tr>';
}
?>
<!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>Editorialt News Lists</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="headerstyle.css" />
</head>
<body>
<div class="tabl">
<table width="95%" border="1" align="center" cellpadding="10">
<tr>
<td width="35%"><strong>File</strong></td>
<td width="30%"><strong>Title</strong></td>
<td width="30%"><strong>Link</strong></td>
</tr>
<?php echo $msg;?>
</table>
</body>
</html>
Image, Title, URL are adv, title and adv_url respectively.
I think the line added should be like
<img src="<?=VIDEO.$adv['adv']?>" width="98%" height="90" alt="">
but how and where to use it don't know. Being a student I have keen interest in learning PHP through projects.
You can do it like as follows:
Replace the following line of your code with my code:
if($rs['adv']!='') {
$adv = '<img src="'.$adDir.$rs['adv'].'" style="width:60px; height:60px" > ';
}
//My code
if($rs['adv']!='') {
$adv = '<img src="'.$adDir.$rs['adv'].'" style="width:60px; height:60px" > ';
}

bootstrap editable - how to transfer dropdown value to SQL table?

I am currently working on a project that shows data from an SQL table using bootstrap editable for live editing.
It works fine - changes are transferred to the SQL table. What is already working?:
Showing current value from SQL table
Providing a drop-down for selection
Transferring changed values to SQL table
-> BUT Part 3 (transferring changed value) is only working for free-text input (class xedit).
What I am looking for is the code for: transferring chosen value of drop-down-list to SQL-Table
Here is the HTML-code:
<?php
include("connect.php");
?>
<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<meta charset="utf-8">
<link href="assets/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<link href="assets/css/custom.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="container">
<div style="text-align:center;width:100%;font-size:24px;margin-bottom:20px;color: #2875BB;">EDIT YOUR CHARACTERS</div>
<div class="row">
<table class= "table table-striped table-bordered table-hover">
<thead>
<tr>
<th colspan="1" rowspan="1" style="width: 180px;" tabindex="0">NAME</th>
<th colspan="1" rowspan="1" style="width: 220px;" tabindex="0">ROLE</th>
<th colspan="1" rowspan="1" style="width: 288px;" tabindex="0">SECOND ROLE</th>
</tr>
</thead>
<tbody>
<?php
$query = mysql_query("SELECT * FROM characters");
$i=0;
while($fetch = mysql_fetch_array($query))
{
if($i%2==0) $class = 'even'; else $class = 'odd';
echo'<tr class="'.$class.'">
<td class="xedit" id="'.$fetch['id'].'" key="name">'.$fetch['name'].'</td>
<td class="xedit" id="'.$fetch['id'].'" key="role">'.$fetch['role'].'</td>
<td class="xedit2" id="'.$fetch['id'].'" key="secondrole">'.$fetch['secondrole'].' </td>
</td>
</tr>';
}
?>
</tbody>
</table>
</div>
</div>
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<script src="assets/js/bootstrap-editable.js" type="text/javascript"></script>
<script>
$(function(){
$('.rolestatus').editable({
source: [
{value: 1, text: 'DD'},
{value: 2, text: 'HEAL'},
{value: 3, text: 'TANK'}
]
});
});
</script>
<script type="text/javascript">
jQuery(document).ready(function() {
$.fn.editable.defaults.mode = 'popup';
$('.xedit').editable();
$(document).on('click','.editable-submit',function(){
var key = $(this).closest('.editable-container').prev().attr('key');
var x = $(this).closest('.editable-container').prev().attr('id');
var y = $('.input-sm').val();
var z = $(this).closest('.editable-container').prev().text(y);
$.ajax({
url: "process.php?id="+x+"&data="+y+'&key='+key,
type: 'GET',
success: function(s){
if(s == 'status'){
$(z).html(y);}
if(s == 'error') {
alert('Error Processing your Request!');}
},
error: function(e){
alert('Error Processing your Request!!');
}
});
});
});
</script>
</div>
</body>
</html>
Here is the process.php code
<?php
include("connect.php");
if($_GET['id'] and $_GET['data'])
{
$id = $_GET['id'];
$data = $_GET['data'];
$key = $_GET['key'];
if(mysql_query("update characters set $key='$data' where id='$id'"))
echo 'success';
}
?>
So does anybody know how I can transfer the chosen dropdown-value (class -> xedit2) to SQL table?
Hope you can help!
Not sure exacly how x-editable works
But in first look i think that the type of your ajax should be "POST" if you want to update some data. And in my opinion you have syntax error in your sql query near "$key"

DataTables Dropdown Menu that pulls multiple columns from MySQL Database

I was wondering if it is possible for me to add a dropdown into the Associated Floor Plans section of the table. In this dropdown I'd like to add other URL's that are stored in the database. Would I be creating a new column in the database to call the additional URL's that are stored in Google Drive and how would I go about creating a dropdown showing all the files associated with that floor.
It's an extremely particular question seeing as it would be calling additional items from the database into what in essence is the same column.
Thank you for your instance. Also, feel free to critique the methods I've used in my code.
<?php
$con = mysql_connect("localhost", "root", "root");
if(!$con){
die("Error: ".mysql_error());
}
mysql_select_db("Test_Data", $con);
$result = mysql_query("SELECT * FROM Test_DataSet");
?>
<html>
<head>
<title>TEST TABLE</title>
<meta http-equiv="Content-Type" content="text/hmtl; charset=UTF-8">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script src="DataTables-1.10.1/media/js/jquery.js" type="text/javascript"></script>
<script src="DataTables-1.10.1/media/js/jquery.DataTables.js" type="text/javascript"></script>
<script type="text/javascript" src="fancybox/lib/jquery.mousewheel-3.0.6.pack.js"></script>
<link rel="stylesheet" href="fancybox/source/jquery.fancybox.css" type="text/css" media="screen" />
<script type="text/javascript" src="fancybox/source/jquery.fancybox.pack.js"></script>
<link rel="stylesheet" href="fancybox/source/helpers/jquery.fancybox-buttons.css" type="text/css" media="screen" />
<script type="text/javascript" src="fancybox/source/helpers/jquery.fancybox-buttons.js"></script>
<script type="text/javascript" src="fancybox/source/helpers/jquery.fancybox-media.js"></script>
<link rel="stylesheet" href="/fancybox/source/helpers/jquery.fancybox-thumbs.css" type="text/css" media="screen" />
<script type="text/javascript" src="/fancybox/source/helpers/jquery.fancybox-thumbs.js"></script>
<style type="text/css">
#import "DataTables-1.10.1/media/css/jquery.dataTables.css";
</style>
<style type="text/css">
#import "DataTables-1.10.1/examples/resources/bootstrap/3/dataTables.bootstrap.css";
</style>
<script type="text/javascript" charset="UTF-8">
$(document).ready(function(){
$('#datatables').dataTable();
})
</script>
<script type="text/javascript">
$(document).ready(function() {
$(".fancybox").fancybox();
});
</script>
<script>
$(document).ready(function() {
$(".various").fancybox({
maxWidth : 1600,
maxHeight : 1200,
fitToView : true,
width : '100%',
height : '100%',
autoSize : true,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
});
</script>
<script>
jQuery(document).ready(function () {
$('a.modalGeneric').fancybox({
type: 'iframe',
fitToView: true,
autoSize: true,
openEffect: 'fade',
openSpeed: 'slow'
});
});
</script>
<style> iframe{border: none; width: 20}</style>
</head>
<body>
<div>
<table id="datatables" class="hover" cellspacing="0" width="100%">
<thead>
<tr>
<th>Building</th>
<th>Floor</th>
<th>Number of AP</th>
<th>Associated Floor Plans</th>
<th>View on WebPage</th>
</tr>
</thead>
<tbody>
<?php
while($row = mysql_fetch_assoc($result)){
?>
<tr class ="odd gradeX">
<td><?php echo $row['Building']; ?></td>
<td><?php echo $row['Floor']; ?></td>
<td><?php echo $row['Number_Of_AP']; ?></td>
<td><?php echo '<a class="various fancybox.iframe” href="'.$row['Associated_Floor_Plans'].'" target="_blank">'.$row['Associated_Floor_Plans'].'</a>';?></td>
<td><?php echo '<a class="various fancybox.iframe” href="'.$row['View_On_Webpage'].'" target="_blank">View in AMP<'.$row['View_On_Webpage'].'</a>';?></td>
</tr>
<?php
}
?>
</tbody>
</table>
</div>
</body>
</html>

Passing a href value inside a php function on same page

$disply_storage variable has list of value, now what i want call storage_facility_id in php myfunction() i cant understand how to get storage_facility_id values in myfunction()
<?php
function myfunction(){
$x=$_POST['storage_facility_id'];
}
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<?php include('include/admin-header.php');
$disply_storage=edit_storage_facility();
?>
<script language="javascript" type="text/javascript">
function ILovePHP() {
b = "<?=myfunction();?>";
alert(b);
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
</head>
<body>
<form action="" method="post">
<?php
for ($i = 0 ;$i<count($disply_storage);$i++){?>
<tr class="light-gray-bg">
<td align="center"><?php echo $disply_storage[$i]['add_facility_name'];?></td>
<td align="center"><a href="storage_mapping.php?id=<?php echo $disply_storage[$i]['storage_facility_id'];?>"><img src="images/edit.png" border="0" /></td>
<td align="center"><a onClick="javascript:return confirm_delete()" href="delete_facility.php?id=<?php echo $disply_storage[$i]['storage_facility_id'];?>"><img src="images/delete.png" border="0" /></td>
<td><a href="javascript:ChangeStatus(<?php echo $disply_storage[$i]['storage_facility_id'];?>)" title="<?=($rec['is_active']==1)?'Turn off':'Turn on'?>">
<?=($disply_storage[$i]['is_active']==1)?'<img src="images/active.gif" border="0">':'<img src="images/inactive.gif" border="0">'?>
</a></td>
</tr>
<?php }?>
</form><p>
</body>
</html>
I really don't get what you are doing here but I will take a stab at it.
First off, myfunction pretty much does nothing. I guess you want...
function myfunction(){
return $_POST['storage_facility_id'];
}
which makes to no sense to me as you can just echo the $_POST var inline any time. However the data is only going to be there the page was posted to.

How to refresh contents of div after link is clicked

I have a form which contains a dropdown box, when the value is changed the form uses jQuery and ajax to produce a table. The table contains data based on the value of the dropdown box and also links.
My initial script which is where the dropdown box is and where the table is added is:
<?php require_once('/connections/db.php');
mysql_select_db($database_db, $db);
$query_weeks = "SELECT WeekNo, WeekName FROM tbl_weeks ORDER BY WeekNo ASC";
$weeks = mysql_query($query_weeks, $db) or die(mysql_error());
$row_weeks = mysql_fetch_assoc($weeks);
$totalRows_weeks = mysql_num_rows($weeks);
?>
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>
<body>
<form name="form1" method="post" action="">
<select id="weekselect" name="week">
<?php
do {
?>
<option value="<?php echo $row_weeks['WeekNo']?>"><?php echo $row_weeks['WeekName']?></option>
<?php
} while ($row_weeks = mysql_fetch_assoc($weeks));
$rows = mysql_num_rows($weeks);
if($rows > 0) {
mysql_data_seek($weeks, 0);
$row_weeks = mysql_fetch_assoc($weeks);
}
?>
</select>
</form>
<div id="mydata"></div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function (){
// listen to change in monthselect
$('#weekselect').change(function(){
var week= $('#weekselect option:selected').val();
//pass val to php
$.post('test2.php',{week: week}, function(data) {
//do something with the data
$('div#mydata').html(data);
});
});
});
</script>
</body>
</html>
The script produces the dropdown from the mysql db and creates a listener for it, when the select is changed the value of the select is passed to the test2.php using jquery. the data returned is added to div #mydata
Test2 which produces the table is as follows
<?php
if (!isset($_SESSION)) {session_start();}
include('session.php');
require_once('Connections/dbc.php');
$open_week=$_SESSION['MM_OpenWeek'];
$week_selected=$_POST['week'];
$season=$_SESSION['MM_Season'];
?>
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>
<body>
<?php
echo '<p>Week selected: '.$week_selected .'<p>';
echo '<p>Open Week: '.$open_week .'<p>';
if ($week_selected>=$open_week) {
echo '<p>Week Open<p>';
} else {
echo '<p>Week Closed<p>';
}
//create recordset of fixtures for the week selected
$sql="SELECT * FROM q_games_stats WHERE WeekNo =".$week_selected . " and Season=". $season ." and at='Home' ORDER BY WeekNo ASC";
$rec_games=mysqli_query($dbc,$sql);
//create table using the recordset
?>
<div id="data_table">
<table class="table" align="center">
<th class="th" width="80px">Match Date</th>
<th class="th" width="150px">Home Team</th>
<th class="th" width="40px">Score</th>
<th class="th" width="150px">Away Team</th>
<th class="th" width="150px">Link</th>
<?php
while ($row=mysqli_fetch_array($rec_games))
{
?>
<tr class="tr">
<td class="td"><?php echo $row['MatchDate']?></td>
<td class="td"><?php echo $row['TeamName']?></td>
<td class="td"><?php echo $row['Score']?></td>
<td class="td"><?php echo $row['OppName']?></td>
<td class="td">Link</td>
</tr>
<?php
}
?>
</table>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function (){
// listen to change in monthselect
$('#data_table a').click(function(){
alert("link clicked");
});
});
</script>
</body>
</html>
This produces the table, which includes links. There is an event listener of the links in the table, which when I click produces an alert.
What I want to do is instead of an alert being produced when clicking a link is for the table to reproduce, the reason for this is when the user clicks a link it will run a script which will change the underlying data in the table and therefore the table will need to be refreshed.
Is there I way I can do this, or is there a better way to do what I want to do?

Categories