jQuery, Ajax, SQL Pagination, problems with SESSION - javascript

This is my first time doing pagination with jQuery ajax.
I do it like this:
I include file 'GetAllMessages.php' into a div, only if i'm logged in.[works]
I include file 'GetMessages.php' again only if im logged in which tells me how many messages are in database.[works]
When I click on my 'messages' link I open a popup and I get my first four messages from 'GetAllMessages.php'.[works]
At the end of this div i have pages like [1,2,3...] and then with jquery $.ajax function (post method) i go again into 'GetAllMessages.php' but this time I tell the file which page I clicked so it gives me the messages I want next.[doesnt work]
It's like SESSION does not exsist, but if I add 'SESSION_START' at start in 'GetAllMesasages.php' it says its already started on my initial 'GetAllMessages.php' load, but when I click on page link[1,2,3...] the error goes away and it all works.
GetAllMessages.php
<?php
if(isset($_SESSION["uname"])){
include ('config.php');
include ('getMessages.php');
$pages=$messageCount/$messagesPerPage;
if(isset($_POST["page"])){
$page=$_POST["page"];
}else{
$page=1;
}
$startQuery=($page-1)*$messagesPerPage;
$getMessagesQuery = "SELECT * from messages ORDER BY id DESC LIMIT ".$startQuery.",".$messagesPerPage."";
$result = $conn->query($getMessagesQuery);
if($result->num_rows>0){
while($row=$result->fetch_assoc()){
$mId=$row["id"];
$mName=$row["name"];
$mEmail=$row["email"];
$mMessage=$row["message"];
$mDate=$row["messageDate"];
$mIsRead=$row["seen"];
$mIsAnswered=$row["answered"];
if($mIsRead==0){
$messageStatus="unread";
$markReadButton="<button class='button1'>Mark as read</button>";
}else if($mIsAnswered==1){
$markReadButton="";
$messageStatus="answered";
}else{
$markReadButton="";
$messageStatus="";
}
echo "
<div class='message ".$messageStatus."' data-messageid='".$mId."'>
<p class='date'>".$mDate."</p>
<p class='sender'>".$mName." - ".$mEmail."</p>
<p class='messageContent'>".$mMessage."</p>
<span class='buttons'>
<button class='reply'>Reply</button>
".$markReadButton."
</span>
</div>";
}
}
}else die();
?>

Related

pass js variable to external php page

i have a file main.js where every step pass selected variable to php page, i need pass some variable to another one php page.
this is piece of code of main.js, i tryed to get 'optionsContent' variable and put in a index.php page in a 'div id="rip" with 'document.getElementById("rip").innerHTML = optionsContent;' but tryed to pass this variable with 'href' in new.php page and not work
if( selectedOptions.length == 0 ) {
optionsContent = '<li><p style="color:#FF0000">Nessuna Riparazione Selezionata</p></li>';
} else {
selectedOptions.each(function(){
optionsContent +='<li><p>RIPARAZIONE '+$(this).find('.searchText1').text()+'</p>'+' - '+'<p style="color:#0012ff">' +$(this).find('.price').text()+'</p></li>';
//optionsContent +='<li><p>'+$(this).find('p').text()+'</p></li>';
//document.getElementById("new").innerHTML = optionsContent;
document.getElementById("rip").innerHTML = optionsContent;
});
}
self.summary.find('.summary-accessories').children('li').remove().end().append($(optionsContent));
}
});
index.php page
<div id="rip">** HERE GET 'optionsContent' VAR CORRECTLY **</div>
<li class="next nav-item">
<ul>
<li class="visible">Modello</li>
<li>Colore</li>
<li>Riparazione</li>
<li>Sommario</li>
<li class="buy">Prenota</li>
</ul>
</li>
in new.php page
<?php
$riparation = $_GET['riparation'];
?>
<input name="riparation"><?php echo $riparation; ?></input>
but doesnt work
any help?
You can use cookies or data storage API for saving data between pages.
index.html:
<?php
// set the cookies:
setcookie("riparation", "myDataFromApp");
// Render the page:
echo "<h1>This works!</h1>"
?>
Another page (jQuery cookie plugin required):
var riparation = $.cookie("riparation"); // riparation = "myDataFromApp"

Hover Event in Javascript/PHP/Codeigniter

To give some Background information: I've got a php-function "showSystems" which extracts data from our CMDB and shows it in a Dropdown generated by the Codeigniter form helper "form_dropdown". So the dropdown contains the names of all our servers and when clicking on one, some other unrelevant functions show different kinds of information about that particular system.
What I want to achieve now is, when hovering over a system listed in the dropdown, that the description of that system is shown in a label under the list. When nothing is hovered, the label is hidden.
Something like:
Dropdown:
Server1
Server2 <-- hover over this
Server3
Label --> shows Description of Server2
How can I handle the mosehover-event in this generated dropdown using php/javascript?
Edit: So I give some more background-information, as it seems to have something to do with my technical setup.
The function, which produces the dropdown with the received data is written in a model of Codeigniter:
<?php
echo '<select class="minipanel" id="selectminipanel" size="25" style="width: 100%" onchange="window.location = \''.site_url(CONTROLLER.'/showItem').'/\' + this.value;">';
foreach($tmp as $key => $value):
if ($active == $key){
echo '<option onmouseover="displayDescription(this)" onmouseout="hideLabel()" value="'.$key.'" server-description="'.$value[1].'" selected>'.$value[0].'</option>';
} else {
echo '<option onmouseover="displayDescription(this)" onmouseout="hideLabel()" value="'.$key.'" server-description="'.$value[1].'">'.$value[0].'</option>';
}
endforeach;
echo '</select>';
?>
The modul is loaded in a template via a view(which loads the model). The label is defined right after the codeigniter call:
<?php $this->load->view("V".$this->name."/vMinipanel"); ?>
<label id="description"></label>
The script is also written in this template's head section:
<script language="JavaScript">
function displayDescription($ele) {
var server_data = ele.server-description;
document.getElementById('description').innerHTML = server_data;
}
function hideLabel() {
document.getElementById('description').innerHTML ='';
}
</script>
So, why are the functions displayDescription and hideLabel not called?
Please check and run below code:
server 1<br>
server 2<br>
server 3
If you are using bootstrap
server 1
server 2
server 3
just these lines of codes will work fine for you .
trigger an event on mouse over, and use the element's data-description to show the details:
<option onmouseover="displayDescription(this)" onmouseout="hideLabel()" data-server-description="your_description" id='1'>
Server1
</option>
<script>
function displayDescription(ele)
{
// You can use the data-server-description attribute to catch the description
var server_data = ele.data-server-description;
// you can also use the ID to fetch the description if not embadded in as an html attribute
var server_id = ele.id;
document.getElementById('your_label_id').innerHTML = server_data;
}
function hideLabel()
{
document.getElementById('your_label_id').innerHTML ='';
}
</script>

Confirm Deletion Dialog Box

I have the following line of code
$product_list="$product_list $id - $product_name - $date_added <a href='inventory_edit.php?pid=$id'>edit</a> • <a href='inventory_list.php?deleteid=$id'>delete</a><br/>"
and
if(isset($_GET['deleteid']))
{
echo 'Do you really want to delete this item with ID of '.$_GET['deleteid']. '? Yes | No';
exit();
}
How can I make it appear as a dialog box and do you think using a dialog box instead of going to the confirmation page will be a good option?
UPDATE
I tried the following but when ever deleteid gets set it creates another new delete link how can I make the existing delete link show the confirm box?
if(isset($_GET['deleteid']))
{
echo 'Delete';
}
UPDATED try
$product_list="$product_list $id - $product_name - $date_added <a href='inventory_edit.php?pid=$id'>edit</a> • <a href='inventory_list.php?deleteid=$_GET[deleteid]' onClick='return confirm(\'Do you want to delete?\');'>Delete</a><br/>"
Doesn't seem to be working.
<script>
var el = document.getElementById('deleteLink');
el.onclick = reallyDelete();
function reallyDelete(){
var verifyDelete = confirm("Really wanna delete?");
if (verifyDelete == false) {
e.preventDefault();
}
}
</script>
Then you'd of course have to add the ID (deleteLink) to the A link, and this will also only work if there is one link to "delete" otherwise you might need to use onClick, but I would recommend googling around for a tutorial on how to achieve the best solution for you.
(There is also still Bootstrap)
UPDATE
Replace
<a href='inventory_list.php?deleteid=$id'>delete</a>
with
Delete
And delete this:
if(isset($_GET['deleteid']))
{
echo 'Delete';
}

How To Fade Out Function With No Unique ID/Class

I don't normally post my server side code but I guess I can post abit to solve this issue,I have a staff page that loops through in a database as I am going to use the database to do other things like deleting/demoting the staff if they did anything wrong and to make the site neater. (don't like demoting staff but in a case I need to)
Anyway I am looping it through with a box what I want now is when one of the boxes are clicked I want it to go to a php page (via a ajax request to delete the user from the database) then hide or fade way by using the hide or fade function.
But the only issue is how can I do this when it's looping through? because the div does not have it's own class or id and I don't think jquery can connect to a database to get a unique id (since it's client side)
Here's some of my code to help
while($staff_info = mysqli_fetch_array($select_staff)) {
$account_name = $staff_info['account_name'];
$position = $staff_info['position'];
$description = $staff_info['description'];
echo "
<div id='staff_boxes'> <text style='float:right;'> <a href='#' class='delete_button'> X </a> </text>";
echo"
<h2>$account_name</h2>
$position
<p>$description</p>
</div> ";
}
Hoping to get some help and this I search Google but can't find nothing I might be doing it wrong for this type of system
Thanks!
You can give each box a unique id like this with your code:
while($staff_info = mysqli_fetch_array($select_staff)) {
$id = $staff_info['id']; // assuming you have an id field in your DB
$account_name = $staff_info['account_name'];
$position = $staff_info['position'];
$description = $staff_info['description'];
echo "
<div id='staff_boxes_$id'> <text style='float:right;'> <a href='#' class='delete_button'> X </a> </text>";
echo"
<h2>$account_name</h2>
$position
<p>$description</p>
</div> ";
}
Alternatively, you can give all the divs the same class (e.g. <div class="staff_box"> ... </div> then use jQuery like this:
$('.staff_box').each(function(index) {
var box = $(this);
box.children('.delete_button').click(function(event) {
event.stopPropagation();
box.hide();
})
});

how to disable href depending on session

i m stuck in a position where i cant find any solution
i have a link and button here is the code im saving the page in db so i cannot create a server control as it will not render it
<div id="DivCMS" runat="server"></div>// i use this in server side
//this code is saved in db table CMS_Pages//////begin
<a href="User/Register.aspx" id="alinkRegister" >
<img src="App_Themes/White/Images/getstarted.png" style="padding-left: 117px;" />
</a>
//this code is saved in db table CMS_Pages//////end
on page load i fill div with data from db
if (!IsPostBack){
var cp = new CMS_Pages();//Data Access block
cp.LoadByPrimaryKey(12);// load data
LiteralControl Ref = new LiteralControl(cp.PageHeader);
Page.Header.Controls.Add(Ref);
DivCMS.InnerHtml = cp.PageHtml;}
how can i disable href according to session in javascript ie
if (session["UserId"] !=null) then href=# <br>
else href="User/register.aspx"
You can just replace it to # if has a session
if (session["UserId"] != null)
{
cp.PageHtml=cp.PageHtml.Replace("User/Register.aspx","#");
}

Categories