PHP - Does Jquery Interfere With Php?

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?

I keep saying I'm going to have to learn javascript and then the library jQuery but find myself learning Swift now instead.    Short one today. I want these two functions to occur back to back. Second function only begins after the first function is complete. 

$(function() {
    $('.tlt').textillate();
})
$(function() {
  $('.tlt1').textillate();
})

If you can please help me with this not only in just code to make that happen but also an explanation of what you did I sure would appreciate it. I've read all morning on promises etc. but have yet to be successful in implementing this.    As you can tell I'm using the plug-in textillate to fade text out one letter at a time. Works great! But I have multiple paragraphs I'm wanting to apply this too so I can't make the div class .tlt since I then lose all paragraphs since it's strips it into spans. That would be ideal of course but I think I forced  into making different classes for each paragraph. This will become problematic in the future though since the content is generated dynamically and I will have no idea how many paragraphs that dynamic content will contain. So if there was a way to keep my <p> and </p> that would be even better.    Thanks!

Hello everyone, im make a website for my final school project.

My header is a image slider made in jQuery with a time interval to change to images.
At the moment when you press a link, the URL changes (example: index.php?page=contact). Then I use the $_GET to know what html file needs to be included, for this example: contact.html. The problem is when the URL changes (after clicking a link), the page refreshes and my jQuery header also refreshes to image[0].

Is there a way to include the right content when clicking on a link, without refreshing the page/header?

Thanks in advance

Gucco.

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>

      
    
 

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 am using jQuery to post the contents of a html form to a php file which process them then returns a result. jQuery then catches this result and either logs you in or displays an error.

This is working fine. It logs me in if i specify the right details and doesnt if i specify wrong details. However when i am redirectd to the home page I have a line which says welcome {username}. However username displays an undefined.

Here is the form(cut down)


<form name="login_form" id="login_form" method="post">
<input id="user_name" class="field" type="text" name="user_name_field" />
</form>


next is the jquery which posts the form data(cut down):


jQuery("#login_form").submit(function()
{
jQuery.post("./modules/login_process.php",{ 
user_name:jQuery("#user_name").val() } ,function(data)
{ 
if (data == 1)
{
document.location="./index.php";
}
else
{ 
}
});
});


then is the login_process.php


if (isset($_POST['user_name']))
{
$user_name = asf_escape(trim($_POST['user_name']));
$login_query = mysql_query("SELECT *
FROM ".TBL_PREFIX."members
WHERE user_username = '$user_name'
") or die (mysql_error());
$result = mysql_num_rows($login_query);

if ($result != 0)
{
$_SESSION['logged_in'] = 1;
$_SESSION['user_username'] = $user_name;

echo $result;
}
else
{
if(!empty($user_name))
{
$error .= "No Records Found for Username: $user_name ";
}
echo $error;
}


As I said it works fine logging in, the username is checked against the database but when i return the session which is equal to the posted username i get "undefined".

Anyone see where i am going wrong?

This topic has been moved to Ajax Help.

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

This topic has been moved to Ajax Help.

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

I am trying to create a webpage and I've added some jQuery to it but it is not working, can you help me out?   JS File:

$(document).ready(function() {
	$('#button').click(function() {
		var toAdd = $('input[name=add]').val();
		$('.message').append("<li>" + toAdd + "</li>")
	});
});

HTML:

<html>
<head>
<title>
Test page
</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<script type='text/javascript' src='script.js'></script>

</head>
<body>
<div class="top-section">
		<div class="top-back">
			<div class="tcontent">
				<div class="tcontent-body">
					<h1>Welcome to the Forum Pioneer Test Page</h1>
					<ul>
						<li>This will be a list of to do's.</li>
						<li>Add your own list below</li>
					</ul>
					<form>
						<input type="text" name="add" value="Type Here">
					</form>
					<div id="button">Add</div>
					<div id="message">d</div>
				</div>
			</div>
		</div>
	</div>

</body>
</html>

I've put only the elements that are affected. I try clicking the button, but the content isn't appended.
Edited by PrinceTaz, 13 December 2014 - 12:55 PM.

27.//file: selectBenefit.php
28.<?php
29.echo "value: " .$_POST['ss_num'] . "<br/>";
?>

16.// file: applicant_info.js
17.
18.function getApplicantInfo()
{  
 
19.  $("#divMainBenefitsProcessing").slideDown();
20. 
$.ajax({
 cache: false,
 url: 'selectedBenefit.php',
 type: 'GET',
 cache: false,
 success: function(response) {
console.log(response); 
21. $("#divMainBenefitsProcessing").html(response);
  
  
  $("#divMainBenefitsProcessing").slideDown();
22.var radioButton = $("input[name='arr_bnft_records']:checked");
            
            if (radioButton == null || radioButton.length < 1)
                alert("Please select a benefit record for processing.");
            else
     {
     $("#ss_id_other").val(radioButton.attr("data-ss-id-other"));
                $.post('selectedBenefit.php',{ss_num: $("#ss_id_other").val()});
23.    }
24. },
 
 beforeSend: function(){
25. },
 error: function(e) {
console.log(e.message);
 }
}); 
}

1.<!-- file: "benefits.htm" -->
2.?<!DOCTYPE html>
<html>
3.<head>
<title>Benefit Processing Page Social</title>
     <meta charset = "utf-8">
             <link rel = "stylesheet" type = "text/css" href = "css_files/divapplist.css">
4.<script src="js_files/jquery-1.11.1.min.js"></script>
5.                <script type = "text/javascript" src = "js_files/selectBenefit.js"></script>
6.                <script type = "text/javascript" src = "js_files/applicant_info.js"></script>
7.</head>
8.<table border="0" cellpadding="10" cellspacing="1" width="900" class="tblListForm">
<tr class="listheader">
<td></td>
<td>Social Security No.</td>
<td>Last Name</td>
<td>Other Name(s)</td>
<td>Date of Birth</td>
<td>Benefit Type</td>
9.</tr>
10. 
  <tr >
<td><input type="radio" name="arr_bnft_records"
 value="47" 
 data-app-id="37" 
 data-benefit-type="Funeral Grant" 
 data-ss-id-other="33333" 
 data-father-weeks=""
 data-funeral-qual="" 
 data-last-name="Lee" 
 data-other-names="Brenda" 
 data-dob="1965-04-04" 
 data-sex="F" 
  
></td>
<td>33333</td>
<td>Lee</td>
<td>Brenda</td>
<td>1965-04-04</td>
<td>Funeral Grant</td>
11.</tr>
12. 
13.<tr class="listheader">
<td colspan="6"><input type="button" id = "submit_btn2" value ="Select" onclick= "getApplicantInfo()"  /></td>
</tr>
</table>
14.

I have some data assigned in jQuery code that I need to send over to my PHP script and I am not quite sure how to do it. 




I have a main page "benefit.htm" which calls a JavaScript function "getApplicantInfo()" defined in the source file "applicant_info.js". The get Applicant function then calls "selectBenefit.js" and tries to pass the value

"$(#ss_id_other").val()" to the "selectBenefit.js" file as the variable "ss_num" within that file. How can this be accomplished?




Source code snippets are included

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 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?