jQuery AJAX form not sending

Question

Why isn't this data being sent to my controller? No sign of jsonForm in firebug. No success alert.

JS

$('form').submit(function() {

  var title = $('#title:input').val();

  alert(title);

  var urlsStr = $("#links").val();
  var urls = urlsStr.match(/\bhttps?:\/\/[^\s]+/gi);
  var formData = {
    "title": title,
    "urls": urls
  }
  var jsonForm = JSON.stringify(formData);                

  $.ajax({
    type: 'GET',
    dataType: 'json',
    cache: false,
    data: { jsonForm: jsonForm },
    url: 'publishlinks/publish',
    success:
      function(response) {
        alert('winrar');
      }
    })
})

Controller

function publish() {

  $form = $this->input->get('jsonForm');

  echo json_decode($form);

  $data = array(

  'movieid' => $this->input->post('id')

  );

  $this->load->model('publish_model');
  $this->publish_model->add_record($data);
  $this->load->model('NewsFeed_model');
  $feed['queryMovies'] = $this->NewsFeed_model->getPublications();        
  $this->load->view('news_feed_view', $feed);     

}

Didn't you meant to do: url: '/publishlinks/publish', with a relative path? Also you can add a failure callback to the ajax function: api.jquery.com/jQuery.ajax — PeeHaa
– PeeHaa, Commented Aug 14, 2011 at 13:40

jk. · Accepted Answer · 2011-08-14 14:21:23Z

1

Don't forget semicolons. They can be important. And, dataType in the ajax request refers to the data coming back from the request not the data being sent by the request.

Start with modifying your ajax:

$('form').submit(function(e) {
    e.preventDefault();

    var title = $('#title:input').val();

    alert(title);

    var urlsStr = $("#links").val();
    var urls = urlsStr.match(/\bhttps?:\/\/[^\s]+/gi);
    var formData = {
       title: title,
        urls: urls
    };                

  $.ajax({
    type: 'GET',
    cache: false,
    data: formData,
    url: 'publishlinks/publish',
    success:
      function(response) {
        alert('winrar');
      }
   });
});

Your data will be attached as query string which your controller can then pick up. From the documentation:

The data option can contain either a query string of the form key1=value1&key2=value2, or a map of the form {key1: 'value1', key2: 'value2'}. If the latter form is used, the data is converted into a query string using jQuery.param() before it is sent.

Modify your controller to pick up the query string vars.

Here is a fiddle: http://jsfiddle.net/jensbits/2F4kN/

answered Aug 14, 2011 at 14:21

jk.

14.4k4 gold badges45 silver badges58 bronze badges

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

1 Comment

jk. Over a year ago

@amiawizard json isn't doesn't seem to be a factor. You were decoding json in the controller because you thought that is what you were getting back (I think - not sure why were decoding json there). Now your controller can just grab the query string vars $_GET I believe in php and go from there. publish() in your controller appears to create feed on some kind but doesn't appear to use the data returned from the ajax.

PeeHaa · Accepted Answer · 2011-08-14 13:42:58Z

0

Didn't you meant to do: url: '/publishlinks/publish', with a relative path? Also you can add a failure callback to the ajax function: http://api.jquery.com/jQuery.ajax/

Also you should really add a return false; add the end of the $('form').submit(function() { function to prevent the form from being submitted the 'normal' way.

Or use:

$('form').submit(function(e)

e.preventDefault();
e.stopPropagtion();

answered Aug 14, 2011 at 13:42

PeeHaa

73.1k60 gold badges195 silver badges264 bronze badges

1 Comment

el_pup_le Over a year ago

without e.stopPropagtion(); it sends data but doesn't load my news feed view.

Collectives™ on Stack Overflow

jQuery AJAX form not sending

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related