Loading data from form using jquery to php file returns null

Question

When ever I pass a value from a form using submit to a php file using load, $.get or post and try to receive data or load it in general as shown below, I just get ruturned a null or undefined value. Anyone know what im doing wrong ?

iNDEX.HTML `

<script type = "text/javascript">
    $(document).ready(function(){

        $("#NewOrgForm").submit(function(){
            var name = $("#companyname").val();  
            $(".content").load("NewEntry.php",{Name: name});
        });
    });
</script>


<form id="NewOrgForm">
<p> Name: <input type="text" id="companyname" value="" /> </p>
<p> <input type="submit" value="Submit New Entry" id="submit" /> </p>
</form>

NEWENTRY.PHP

<?php

$companyname = $_POST['Name'];
echo $companyname;

?>

`

Check if var_dump($_REQUEST) doesn't give some interesting facts away. — BalusC
– BalusC, Commented Jul 25, 2010 at 17:36

Swizec Teller · Accepted Answer · 2010-07-25 17:54:43Z

1

From some of the comments you posted it looks to me like you are incorrectly collecting data from the form. Have you tried making an alert to see if the name variable is actually set? Also try using firebug or something to see the exact URL you're loading.

Perhaps try using a directly passed event reference to the function and fetch the fields from there instead of using an absolute selector. Might help.

answered Jul 25, 2010 at 17:54

Swizec Teller

2,3221 gold badge19 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Gebsbo Over a year ago

Yes i have made an alert to see if the name variable is actually set and it does output what I typed in.

Gebsbo Over a year ago

Resolved: Just resorted to good old method and post, a bit dissapointed by this but o well. If anyone finds the time and manages to get this working, please feel free to post your suggestions on here, thanks for all the help!

malonso · Accepted Answer · 2010-07-25 20:50:20Z

1

Is there actually an element in your HTML that has the class "content"?

Try making use of the callback function so that you are aware that the load actually ran:

$('#result').load('ajax/test.html', function() {
  alert('Load was performed.');
});

The above code is taken from the jquery site (http://api.jquery.com/load/)

UPDATE: The more I look at this, the more I think that you are probably better going w/.post (http://api.jquery.com/jQuery.post/)

UPDATE2: What happens if you try this:

$(document).ready(function(){
  runOnLoad('content');
});

function runOnLoad(className){

  var name="peter";
  var ajaxData = {"Name": name};
  var url="NewEntry.php";
  var contentToReturn="";

  $.ajax({
     type: "POST",
     url: url,
     data: ajaxData,
     datatype: "html",
     success: function(html) {
       contentToReturn="Success! It returned "+html+"<br>";
       $('div.'+className).html(contentToReturn);
     },
     error: function(html) {
       contentToReturn="Failure! It returned "+html+"<br>";
       $('div.'+className).html(contentToReturn);
     }

  });
  return;
}

edited Jul 25, 2010 at 20:50

answered Jul 25, 2010 at 17:38

malonso

2,3031 gold badge21 silver badges33 bronze badges

7 Comments

Gebsbo Over a year ago

Yes there is an element with the class "content", it is a div class. all that happends is the page refreshes and it outputs Load was performed.

Gebsbo Over a year ago

The strange thing is if I run the document like this, $(document).ready(function(){ var name="peter"; $(".content").load("NewEntry.php",{Name: name}); It works just fine!

Gebsbo Over a year ago

Even if i use $.post("NewEntry.php",{Name: name},function(data){ alert("data received is " + data); }); I still receive null data back. If you would test this out yourself, it would be helpful.

malonso Over a year ago

What happens if you do something like in my "UPDATE2" above?

Gebsbo Over a year ago

Well the code you posted above doesnt do anything when I run it. I could easily do the same thing with <script type = "text/javascript"> $(document).ready(function(){ alert("Looking for Peter"); var name = "Peter"; $.post("NewEntry2.php",{Name: name},function(data) { alert(data); },"json"); }); </script> which works but i dont think that is the problem. Im guessing the problem is reading the data from the form / posting the form data.

|

ZagNut · Accepted Answer · 2010-07-25 17:38:14Z

0

If you're just doing a POST, it should look something like:

<script type = "text/javascript">
    $(document).ready(function(){

        $("#NewOrgForm").attr({
            "method": "POST",
            "action": "NewEntry.php"
            }).submit();
    });
</script>

although why even use jquery for this, then...just set method and action attribs on your form element...

answered Jul 25, 2010 at 17:38

ZagNut

1,45115 silver badges21 bronze badges

1 Comment

Gebsbo Over a year ago

hmm yes I might use method and action attribs. Its strange because on my other document I use onclick(data) from a submit input and pass the 1 set of data to a function and do the exact same code above and it works. Not sure why extracting it using jquery and passing along does not work.

Collectives™ on Stack Overflow

Loading data from form using jquery to php file returns null

3 Answers 3

2 Comments

7 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

7 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related