PHP - Get Jquery Value Into Php Code

Alright guys, I have a bit of a problem here. I am deleting records using isset($_POST) on the current page but when it submits the records i deleted are still visible. I was thinking of echoing some jquery/ajax to re-load the div that displays the records. Has anyone ever done this before?

I dont want the entire page to re-load just that specific area.

Hey, I have a foreach loop displaying some data from my table, what i need to do is run a Jquery each function on the repeated element so it fadesIn each element one at a time. I am guessing i need to set somesort of interval for this to work. I have been messing with it for a good hour or so now and i cant seem to get it working. Has anyone done this before or seen it done else were?

Im wondering if i should use jQuery or Php. and how about i would go about doing this.

Code: [Select]

<?php
    print "<table border=\"0\" cellpadding=\"0\" width=\"100%\" height=\"100\"cellspacing=\"0\" style=\"border-collapse:collapse\"bordercolor=\"grey\" bgcolor=\"white\" valign=\"top\">
<td align=\"left\" width=\"100%\" onclick=\"I3.location.href='getuserdetail.php?prop=$ownerid'\"><b>Property Name</b></td><td><b>Tenant</b></td><td><b>Property Status</b></td><td>Rent Amount</td>";
        $connect = mysql_connect("localhost","root","");
        mysql_select_db("magic");
        $query = "SELECT * FROM props WHERE ownerid = '$ownerid' ORDER BY name ASC ";
        $result = mysql_query($query);
        while($row = mysql_fetch_assoc($result))
{
$propertyid     = $row['propid'];
$propertyname   = $row['name'];
$propertydesc = $row['description'];
$propertycity   = $row['city'];
$propertystate  = $row['state'];
$propertyzip    = $row['zip'];
$active = $row['active'];
$lease = $row['lease'];
$leaseamt = $row['leaseamt'];

if($active == "1"){
$propertystatus = "Active";
} else {
$propertystatys = "Unknown";
}





print"<tr  onMouseOver=\"this.bgColor = '#CEE3F6'\" onMouseOut =\"this.bgColor = '#FFFFFF'\">
<td align=\"left\" width=\"25%\" onclick=\"window.open('viewpropdetail.php?prop=$propertyid','mywindow','width=1200,height=600,scrollbars=1')\">$propertyname</td><td>$ownerfirstname $ownerlastname</td><td>$propertystatus</td><td>$$leaseamt</td>

";
  }


print"</td></table>";
                                                           
                                                           ?>

Basically i have a link under that is add property. it pops up a box. with a form you fill it out, and it inserts the record into database.

What I'm trying to do. is get it to "Refresh" the property list ( ex. code above).  so it shows the new property in the table.



i have never used jQuery. but was wondering if i could do that with php.  Is there a way to say if records are changed.. update?

Hi
I am in the process of teaching myself web development, coming from a vb and mssql background.

I am building a small page that will display my film library, I just want something quick and simple that gets things working.  I have three img tags on my page that display the film posters.  The current film and the one previous and next.

What I would like is a left and a right arrow that just scroll through the library.

I am thinking I need to read the sub folder of D:\movies and story the full path name into an array, and then when the user presses a arrow it moves forward or back.

Everything is local and I am unsure about how to handle the event of the left/arrow being pressed.  Does PHP handle that kind of event or would Jquery be more suitable or something else completely??

thanks for any pointers.

Hi All (Again)

I am looking to pick up variables in jquery from a string created:

function search_by() {
   var search_term = $('#search_for', $(this).attr('value'));
   alert(search_term);
}

I cant seem to get the value i am trying to into a "var".

This is the code on the page i am using a  onClick="search_by();"
i.e:
<a class="show_cats" search_cat="PDAs & Accessories" search_for="fire" onclick="search_by();" href="#">

I am trying to get the value inside the "search_for" field.
Any ideas????

Hi,   Have a look this menu   http://jsfiddle.net/GBkMB/6/   I want the same mune but with click function (its using hover function now)   Please help me with this 

Hi! Having a lot of fun dusting off the coding and putting together a site with PHP, CSS, and jQuery. I've run into one problem that I can't get past though. I implemented jQuery History to use hashtags to maintain browser back/forward buttons and linkability of the site (and not reload header and footer when updating content). The main purpose of the site is to showcase photography that's hosted on Flickr. I've got this working well using Slickr.

I have the Slickr code to load my galleries sets in a file called 'pictures.php' which is loaded fine into #page_content using a link to #pictures. The problem arises when I click on a gallery/set: I get taken back to the default view of the site without any hashtage because Slickr requires a link using parameters, so:

www.myexamplesite.com/#pictures

becomes

www.myexamplesite.com/index.php?id=72157626067797650&p=1

As you can see, since it loses the hashtag, I am no longer looking at the right page. Does anybody have any ideas on how I can specify both the hashtag and the parameter? Cheers!

I'm using jQuery webcam to capture a photo of the client. I need to send it to the server just when the form is submitted (It's a form with information, and I need to have the photo attached to it).

I have everything working except the part of saving the image encoded with base64 to the database like blob.

Here is what I have so far:

Code: [Select]
    <script type="text/javascript">
    var pos = 0;
    var ctx = null;
    var cam = null;
    var image = null;
   
    jQuery("#webcam").webcam({
   
    width: 320,
    height: 240,
    mode: "callback",
    swffile: "/../../js/jscam_canvas_only.swf",
   
    onTick: function(remain) {
   
    if (0 == remain) {
    jQuery("#status").text("Sorria!");
    } else {
    jQuery("#status").text(remain + " segundo(s) restante(s)...");
    }
    },
   
    onSave: function(data) {
   
        var col = data.split(";");
        var img = image;
   
        for(var i = 0; i < 320; i++) {
            var tmp = parseInt(col[i]);
            img.data[pos + 0] = (tmp >> 16) & 0xff;
            img.data[pos + 1] = (tmp >> 8) & 0xff;
            img.data[pos + 2] = tmp & 0xff;
            img.data[pos + 3] = 0xff;
            pos+= 4;
        }
   
        if (pos >= 4 * 320 * 240) {
            ctx.putImageData(img, 0, 0);
            var canvas = document.getElementById("canvas");
            var save_image = canvas.toDataURL("image/png");
            save_image = save_image.replace(/^data:image\/(png|jpeg);base64,/, ""); 
            $('input[name=save_image]').val(save_image);
            pos = 0;
        }
    },
   
    onCaptu function () {
               
    jQuery("#flash").css("display", "block");
    jQuery("#flash").fadeOut(100, function () {
    jQuery("#flash").css("opacity", 1);
    });
                    jQuery("#canvas").show();
                    webcam.save();
    },
   
    onLoad: function () {
               
    var cams = webcam.getCameraList();
    for(var i in cams) {
    jQuery("#cams").append("<li>" + cams[i] + "</li>");
    }
                    jQuery("#canvas").hide();
    }
    });
   
    function getPageSize() {
   
    var xScroll, yScroll;
   
    if (window.innerHeight && window.scrollMaxY) {
    xScroll = window.innerWidth + window.scrollMaxX;
    yScroll = window.innerHeight + window.scrollMaxY;
    } else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
    xScroll = document.body.scrollWidth;
    yScroll = document.body.scrollHeight;
    } else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
    xScroll = document.body.offsetWidth;
    yScroll = document.body.offsetHeight;
    }
   
    var windowWidth, windowHeight;
   
    if (self.innerHeight) { // all except Explorer
    if(document.documentElement.clientWidth){
    windowWidth = document.documentElement.clientWidth;
    } else {
    windowWidth = self.innerWidth;
    }
    windowHeight = self.innerHeight;
    } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
    windowWidth = document.documentElement.clientWidth;
    windowHeight = document.documentElement.clientHeight;
    } else if (document.body) { // other Explorers
    windowWidth = document.body.clientWidth;
    windowHeight = document.body.clientHeight;
    }
   
    // for small pages with total height less then height of the viewport
    if(yScroll < windowHeight){
    pageHeight = windowHeight;
    } else {
    pageHeight = yScroll;
    }
   
    // for small pages with total width less then width of the viewport
    if(xScroll < windowWidth){
    pageWidth = xScroll;
    } else {
    pageWidth = windowWidth;
    }
   
    return [pageWidth, pageHeight];
    }
   
    window.addEventListener("load", function() {
   
    jQuery("body").append("<div id=\"flash\"></div>");
   
    var canvas = document.getElementById("canvas");
   
    if (canvas.getContext) {
    ctx = document.getElementById("canvas").getContext("2d");
    ctx.clearRect(0, 0, 320, 240);
   
    var img = new Image();
    img.onload = function() {
    ctx.drawImage(img, 320, 240);
    }
    image = ctx.getImageData(0, 0, 320, 240);
    }
    var pageSize = getPageSize();
    jQuery("#flash").css({ height: pageSize[1] + "px" });
   
    }, false);
   
    window.addEventListener("resize", function() {
   
    var pageSize = getPageSize();
    jQuery("#flash").css({ height: pageSize[1] + "px" });
   
    }, false);
    </script>
Then I have just a normal form that the customer has to fill it in, followed by this:

Code: [Select]
    <div id="webcam">
    </div>
    <p style="width:250px;text-align:center; "><input type="button" value="Tirar Fotografia" onclick="webcam.capture(3);void(0);"/></p></td><td><p><canvas id="canvas" height="200" width="200"></canvas></p>
in php i have:

Code: [Select]
$image=file_get_contents(base64_decode($_POST['save_image']));

I have a while loop fucntion displaying a list of records, each while records contains a hidden div with additional infomation and a button that will call JQuery slideToggle() function. each button on each record toggles alll the hidden divs. Does anyone have any ideas on how to sort this issue?

Hi, I am working on a project to help me learn more about JSON and JQuery and how they interact. I am able to pull in my JSON data fine and it displays in an HTML table. What isn't working is I want the tables rows to be striped, and normally this works, but I didn't know if it isn't working b/c it is AJAX or if I have something wrong with my JQuery. Also, I was hoping to add a reference to an image path in the JSON file as well, but wasn't sure how that is done or if it could be done at the JSON level.   Here is my code that I am working on:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>JSON Presidents</title>
	<style type="text/css">
        
        body{
            font-family:arial, helvetica, sans-serif;
        text-align:center;
            width:100%;
            margin:200px 0 0 0;
        }
        
	#PresidentInfo{
	width:75%;
	margin:0 auto;
       
        
	}
        
        table#data{
            width:100%;
        }
        
        table#data th{
            background:#333;
            color:#fff;
            text-align:center;
            text-shadow:1px 1px 1px rgba(0,0,0,1);
            padding:5px;
        }
        
        table#data td{
            border:1px solid #333;
            border-collapse:collapse;
            padding:10px;
            margin:0 5px 0 5px;
            text-align:center;
        }
        
        .odd {
   background: #ccc;
}
            
	

	
	
	</style>
</head>
<body>
        
    <div id="PresidentInfo">
  
    </div>

    <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
	   <script>
           (function ($) {
$(document).ready (function(){
   $("tr:odd").addClass("odd");
    });
});
})(jQuery);
</script>
    <script>
  $.getJSON('data.json', function(data) {
        var output="<table id='data'><tr><th>First Name:</th><th>Last Name:</th><th>Month of Inauguration:</th><th>Year of Inauguration:</th></tr>";
        for (var i in data.Presidents) {
            output+="<tr><td>" + data.Presidents[i].firstName + "</td><td>" + data.Presidents[i].lastName + "</td><td>" + data.Presidents[i].YearInauguratedPresident.month +  "</td><td>" + data.Presidents[i].YearInauguratedPresident.year + "</td></tr>";
        }

        output+="</tr></table>";
        document.getElementById("PresidentInfo").innerHTML=output;
  });
    </script>
 
</body>
</html>

{"Presidents":[
        {
            "firstName":"Barack",
            "lastName":"Obama",
            "YearInauguratedPresident": {
                "month":"January",
                "day":20,
                "year":2009
            }
        },
        {
            "firstName":"George W",
            "lastName":"Bush",
            "YearInauguratedPresident": {
                "month":"January",
                "day":20,
                "year":2001
				}
            },
			     {
            "firstName":"Bill",
            "lastName":"Clinton",
            "YearInauguratedPresident": {
                "month":"January",
                "day":20,
                "year":1993
				}
            },
			     {
            "firstName":"George",
            "lastName":"H.W Bush",
            "YearInauguratedPresident": {
                "month":"January",
                "day":20,
                "year":1989
            }
        }
]}

I am using this to open contents into a modal window, but in the process I am passing it through loop.php to check if the page exists and then load. Is there a way to completely skip the loop.php file and load my clicked link?

$(document).ready(function(){

///////LINK in a Modal Window//////// 
$('#all').delegate('a.pop-lnk', 'click', function(){
var page = $(this).attr('id');
$('#gr-out').css({ opacity: 0.7, 'width':$(document).width(),'height':$(document).height()}).show();
$('#popup').css({'display': 'block'});
$('#popup').load("../help-file/loop.php?page="+ page);
});
});

The id attr I am getting from this code is my page's name but I need to add the .php extension if is possible so I can load the page.
Edited by Pavlos1316, 18 November 2014 - 03:04 PM.

i have two scripts i am using in one file.  one is for an image slider and the other is a drop-down menu.  both jquery driven.  one seems to break the other.  if i remove the first line of code from one script (

jQuery.noConflict()

), it seems to fix the problem and both scripts work.  can someone explain to me what is going on?  :/   fyi, i tried renaming variables for one script, hoping their was a naming conflict but that didnt work for me either. 

<!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 name="viewport" content="initial-scale=1" /> <!-- Apple mobiles -->
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta name="keywords" content = "<?php echo $keywords; ?>" />
    <meta name="description" content="<?php echo $description; ?>" />
    
    <title><?php echo $page_title; ?></title>
    
    <link rel="icon" href="favicon.ico" type="image/x-icon" />
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />

    <link rel="stylesheet" type="text/css" href="bmw_styles.css" />
    
    <link href='http://fonts.googleapis.com/css?family=Raleway' rel='stylesheet' type='text/css'>
    
    <link rel="stylesheet" type="text/css" href="css/flexdropdown.css" />
    
    <!-- homepage slider -->
    <link rel="stylesheet" type="text/css" href="slider/css/default.css" />
    <link rel="stylesheet" type="text/css" href="slider/css/component.css" />
      
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <!--<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>-->
    
    <script type="text/javascript" src="scripts/global.js"></script>
    
    <!-- navigation -->
    <script type="text/javascript" src="scripts/flexdropdown.js"></script>

    <!-- homepage slider -->
    <script src="slider/js/modernizr.custom.js"></script>  
    <script src="slider/js/jquery.cbpFWSlider.js"></script>
    
    <!--  initialize jquery when the DOM is ready -->
    <script type="text/javascript">
        $( function() {
            $( '#cbp-fwslider' ).cbpFWSlider();
            $( '#cbp-fwslider' ).cbpFWSlider('interval');
        } );
    </script>
</head>

Hello all, So I found this html and jquery example online. Works great if I just copy the below code in a file call test.html and run it from the browser, however if I create a PHP project in netbeans and create a file called index.php and put the same code and the jquery.min.js in the same directory, for some reason it doesn't work. The java script portion give strange behavor. I am new to all these, can someone please help?   <!DOCTYPE html>
<!--Code by Chris Youderian, ContactMetrics.com, http://contactmetric...act-form-jquery, Code released under an MIT license, http://opensource.org/licenses/MIT -->
<html lang="en">
    <head>
        <script type='text/javascript' src='jquery.min.js'></script>
    </head>
    
    <!-- Styles -->
    <style>
        #contact label{
            display: inline-block;
            width: 100px;
            text-align: right;
        }
        #contact_submit{
            padding-left: 100px;
        }
        #contact div{
            margin-top: 1em;
        }
        textarea{
            vertical-align: top;
            height: 5em;
        }
            
        .error{
            display: none;
            margin-left: 10px;
        }        
        
        .error_show{
            color: red;
            margin-left: 10px;
        }
        
        input.invalid, textarea.invalid{
            border: 2px solid red;
        }
        
        input.valid, textarea.valid{
            border: 2px solid green;
        }
    </style>
    
    <!-- JavaScript Code -->
    <script>
        $(document).ready(function() {
            <!-- Real-time Validation -->
                <!--Name can't be blank-->
                $('#contact_name').on('input', function() {
                    var input=$(this);
                    var is_name=input.val();
                    if(is_name){input.removeClass("invalid").addClass("valid");}
                    else{input.removeClass("valid").addClass("invalid");}
                });
                
                <!--Email must be an email -->
                $('#contact_email').on('input', function() {
                    var input=$(this);
                    var re = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/;
                    var is_email=re.test(input.val());
                    if(is_email){input.removeClass("invalid").addClass("valid");}
                    else{input.removeClass("valid").addClass("invalid");}
                });
                
                <!--Website must be a website -->
                $('#contact_website').on('input', function() {
                    var input=$(this);
                    if (input.val().substring(0,4)=='www.'){input.val('http://www.' input.v...substring(4));}
                    var re = /(http|ftp|https):\/\/[\w-]+(\.[\w-]+)+([\w.,@?^=%&amp;:\/~+#-]*[\w@?^=%&amp;\/~+#-])?/;
                    var is_url=re.test(input.val());
                    if(is_url){input.removeClass("invalid").addClass("valid");}
                    else{input.removeClass("valid").addClass("invalid");}
                });
                
                <!--Message can't be blank -->
                $('#contact_message').keyup(function(event) {
                    var input=$(this);
                    var message=$(this).val();
                    console.log(message);
                    if(message){input.removeClass("invalid").addClass("valid");}
                    else{input.removeClass("valid").addClass("invalid");}    
                });
        
            <!-- After Form Submitted Validation-->
            $("#contact_submit button").click(function(event){
                var form_data=$("#contact").serializeArray();
                var error_free=true;
                for (var input in form_data){
                    var element=$("#contact_"+form_data[input]['name']);
                    var valid=element.hasClass("valid");
                    var error_element=$("span", element.parent());
                    if (!valid){error_element.removeClass("error").addClass("error_show"); error_free=false;}
                    else{error_element.removeClass("error_show").addClass("error");}
                }
                if (!error_free){
                    event.preventDefault();
                }
                else{
                    alert('No errors: Form will be submitted');
                }
            });
            
            
            
        });
    </script>
    
    <body>
        <form id="contact" method="post" action="">
            <!-- Name -->
            <div>
                <label for="contact_name">Name:</label>
                <input type="text" id="contact_name" name="name"></input>
                <span class="error">This field is required</span>
            </div>
            <!-- Email -->
            <div>
                <label for="contact_email">Email:</label>
                <input type="email" id="contact_email" name="email"></input>
                <span class="error">A valid email address is required</span>                
            </div>                        
            <!--Website -->
            <div>
                <label for="contact_website">Website:</label>
                <input type="url" id="contact_website" name="website"></input>
                <span class="error">A valid url is required</span>                                
            </div>                        
            <!-- Message -->
            <div>
                <label for="contact_message">Message:</label>
                <textarea id="contact_message" name="message"></textarea>
                <span class="error">This field is required</span>                                                
            </div>                    
            <!-- Submit Button -->
            <div id="contact_submit">                
                <button type="submit">Submit</button>
            </div>
        </form>
    </body>
</html>

      
    
 

This topic has been moved to Ajax Help.

http://www.phpfreaks.com/forums/index.php?topic=316223.0