• 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Jquery & Submitting a form

#1
[eluser]downah[/eluser]
Hi guys, finally codeigniter seems to make a little sense when I gave it another go making a simple project and learning individual things to get there as opposed to just following the "blog tutorial".. However I am trying to submit a form and do it through ajax/jquery so that the other page doesn't show and everything happens in one page.

This is from my view where the form and jquery is:
jquery:
Code:
[removed]
   $(function(){
       $("#form-signin").submit(function(){
         dataString = $("#form-signin").serialize();

         $.ajax({
           type: "POST",
           url: "<?php echo base_url(); ?>index.php/welcome/addmovie",
           data: dataString,

           success: function(data){
               alert('Successful!');
           }

         });

         return false;  //stop the actual form post !important!

      });
   });
[removed]

form:

Code:
<form class="form-signin" method="post" id="form-signin">
        <h4 class="form-signin-heading">Add a Movie</h4>
        &lt;input type="text" class="input-block-level" placeholder="Movie Title"&gt;
        &lt;input type="text" class="input-block-level" placeholder="URL"&gt;
        &lt;input type="number" class="" min="1" max="100" placeholder="Jamies Score"&gt;
        &lt;input type="number" class="" min="1" max="100" placeholder="Kellys Score"&gt;
        <button class="btn btn-large btn-primary" type="submit">Add</button>
      &lt;/form&gt;

It seems nothing happens when you click the submit button and I've put the script at the bottom of the page just before &lt;/body&gt; as it seems when I put it under the form it doesn't load the rest of the code below it? I am very new with jquery so please be kind.

I don't have anything in the script which the jquery should load (public function addmovie in the welcome controller) so it should return successfully I think?

I hope someone can help me out!


PS Using this tutorial: http://optimiseblog.co.uk/posting-form-d...-and-ajax/

#2
[eluser]downah[/eluser]
Got the jquery to work! seemed to be missing the url helper for the base_url I think so I added the full url and voila! form seems to work correctly as in submitting and jquery, although two things: it doesn't seem to take the information through as it keeps adding 0, 0, 0, 0 as opposed to the things I submit in the form. and next it doesn't refresh the page afterwards? probably something jquery missing?

insert function in model:

Code:
function entry_insert(){
    $this->load->helper('form');
    $this->load->helper('html');
    $this->load->database();
    $data = array(
              'title'=>$this->input->post('title'),
              'url'=>$this->input->post('url'),
          'jscore'=>$this->input->post('jscore'),
          'kscore'=>$this->input->post('kscore')
            );
    $this->db->insert('movies',$data);
  }

this is the controller function which gets called by the jquery loading the model:
Code:
public function addmovie()
{
        $this->load->model('Movie_model', '', TRUE);
        $this->Movie_model->entry_insert();
        return true;


}
html form inside view:
Code:
&lt;form class="form-signin" method="post" id="form-signin"&gt;
    <h4 class="form-signin-heading">Add a Movie</h4>
    &lt;input type="text" class="input-block-level" placeholder="Movie Title" id="title"&gt;
    &lt;input type="text" class="input-block-level" placeholder="URL" id="url"&gt;
    &lt;input type="number" class="" min="1" max="100" placeholder="Jamies Score" id="jscore"&gt;
    &lt;input type="number" class="" min="1" max="100" placeholder="Kellys Score" id="kscore"&gt;
    <button class="btn btn-large btn-primary" type="submit">Add</button>
  &lt;/form&gt;

and finally jquery:

Code:
[removed]
$(function(){
   $("#form-signin").submit(function(){
     dataString = $("#form-signin").serialize();

     $.ajax({
       type: "POST",
       url: "http://domain.com/xx/index.php/welcome/addmovie",
       data: dataString,

       success: function(data){
           alert('Successful!');
       }

     });

     return false;  //stop the actual form post !important!

  });
});
[removed]

can anyone spot what I am doing wrong? and maybe help my jquery refresh?

#3
[eluser]downah[/eluser]
and again resolved!

was missing name attributes in my form incase anyone is experiencing similar problems!

&lt;input placeholder="Kellys Score" id="kscore"&gt;
to
&lt;input placeholder="Kellys Score" name="kscore" id="kscore"&gt;

edit:

location.reload(); added to jquery to make it reload!


Digg   Delicious   Reddit   Facebook   Twitter   StumbleUpon  


  Theme © 2014 iAndrew  
Powered By MyBB, © 2002-2019 MyBB Group.