user1777711
user1777711

Reputation: 1744

JQuery with AJAX can't get content from php page

JQuery with AJAX can't get content from php page

I try press the submit button, nothing change. Not sure why

Heres my 2 pages

Jquery.php

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

<script>
    $(document).ready(function(){

    $("#input").click(function(){

$.ajax({
    url: 'jquery2.php?keyword='+$("#fname").val(),
    type: 'GET',
    success: function (data) {$("#newhtml").val(data);}
});

    })


    });

    </script>

</head>
<body>
First name: <input type="text" id="fname" name="fname"><br>
<input type="button" id="input" value="Search Data">
<div id="newhtml"></div>
</body>
</html>

Jquery2.php

<?php
    $advert = array(
        'ajax' => 'Hello world!',
        'advert' => $row['adverts'],
     );
    echo json_encode($advert);
?>

Is there anythign wrong with my code?

Upvotes: 0

Views: 1861

Answers (4)

Gurminder Singh
Gurminder Singh

Reputation: 1755

This

$("#newhtml").val(data);

should be

$("#newhtml").html(data);
// OR
$("#newhtml").append(data);

You might also have to add

dataType: "json",
contentType: "application/json"

properties to your ajax method before success callback.

UPDATE

Overall, your code in your head tag should be like this

<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

<script type="text/javascript">
  $(document).ready(function() {
     $("#input").click(function(){
        $.ajax({
          url: 'jquery2.php?keyword='+$("#fname").val(),
          type: 'GET',
          dataType: "json",
          contentType: "application/json",
          success: function (data) {
            $("#newhtml").html(data);
          }
        });
    });
 });

</script>

</head>

Upvotes: 1

Lionel
Lionel

Reputation: 2029

Jquery2.php throws an error: "Notice: Undefined variable: row in [...]/Jquery2.php on line 4"

$row['adverts'] is not defined.

Also, change following:

$("#newhtml").val(data);

to

$("#newhtml").html(data);

Upvotes: 0

Chaitanya Moganti
Chaitanya Moganti

Reputation: 11

Do not use multiple jquery sources. Use only one among those two you referenced.

For non INPUT tags u have to use .html() or .text()

Upvotes: 0

iJade
iJade

Reputation: 23791

Try changing

success: function (data) {$("#newhtml").val(data);}

to

success: function (data) {$("#newhtml").html(data);}

Upvotes: 0

Related Questions