Welcome Guest, Not a member yet? Register   Sign In
POST data from ajax-for-codeigniter
#1

[eluser]shane_[/eluser]
I'm trying to use the ajax-for-codeigniter from the wiki. My familiarity with the prototype library is limited. But I can successfully send a request to the server and return some output which updates a div element. But it seems the POST data is not being sent.

Code:
$data = array(    'title' => 'Home',
                  'button' => $this->ajax->submit_to_remote('send', 'Send', array('url'=> '/controller/function', 'update' => 'div'))
             );

which give the following output from the view
Code:
<form name="some_form" method="POST">
<input type="text" name="some_form_element" size="24" />
<input type="button" onclick="new Ajax.Updater('div','/controller/function',{evalScripts:true})" name="send" value ="Send" />
</form>
<div id="the_div_for_the_returned_output"></div

this controller function that gets called does not work

Code:
function the_function() {
    
        return $this->output->set_output($this->input->post('some_form_element');
    }

but this will work

Code:
function the_function() {
    
        return $this->output->set_output('this_works');
    }


the div will be updated with "this_works"
#2

[eluser]Pascal Kriete[/eluser]
You're not passing anything to the controller. Your final script should have
Code:
parameters: *something*
in it.
#3

[eluser]shane_[/eluser]
That makes sense. For some reason I was thinking it was handled like a regular form submit. I couldn't see anything that said any different in any of the documentation. Thanks.
#4

[eluser]MMCCQQ[/eluser]
hi!
inparo, can you write an example how-to?
#5

[eluser]Pascal Kriete[/eluser]
I'm not very familiar with the ci library in question. I also very much dislike inline javascript. Here's what I would do (not using the ci library, just general prototype):

Here's the form:
Code:
&lt;form action="path/to/non-ajax/function" id="the_name_form" method="post"&gt;
&lt;input type="text" id="my_name" /&gt;
&lt;input type="button" id="submit"  /&gt;
&lt;/form&gt;
<div id='ajax_answer'></div>

In the html &lt;head&gt; somewhere:
Code:
&lt;script src="prototype.js" type="text/javascript" charset="utf-8"&gt;&lt;/script&gt;
&lt;script type="text/javascript" charset="utf-8"&gt;
&lt;!--
init = function() {
    $('the_name_form').observe('submit', sendIt);
}

sendIt = function(event) {
    event.stop();
    var url = 'path/to/ajax/function';
    new Ajax.Request(url, {
        parameters: { name: $F('my_name') },
        method: 'post',
        onComplete: function(truck) {
            $('ajax_answer').update("Form sent!");
        }
    });
}

document.observe("dom:loaded", init);
//--&gt;
&lt;/script&gt;

The advantage here is that the form is still usable (provided you have a backend function to handle it) when javascript is disabled.
Hope that helps.

EDIT: Mwahaha, made the forum display the tags. Just for completeness - in the backend you treat it like a normal form submit, but echo what you want your ajax response to be. You can get that response from truck.responseText (I like using truck - don't ask).
#6

[eluser]papanyaraka[/eluser]
Hi, Summer Student...
Can u give me a code example of submit_to_remote function that already work well on CI, please?

I Copy Paste your code but it doesn't give any output at all.

Tks.
#7

[eluser]Unknown[/eluser]
[quote author="shane_" date="1202265763"]I'm trying to use the ajax-for-codeigniter from the wiki. My familiarity with the prototype library is limited. But I can successfully send a request to the server and return some output which updates a div element. But it seems the POST data is not being sent.

Code:
$data = array(    'title' => 'Home',
                  'button' => $this->ajax->submit_to_remote('send', 'Send', array('url'=> '/controller/function', 'update' => 'div'))
             );
[/quote]


dear,
You Must use this code :
Code:
$data = array('title' => 'Home',
              'button' => $this->ajax->submit_to_remote('send', 'Send', array('url'=> '/controller/function', 'update' => 'div', 'with'=>'')));

add 'with'=>'' to Options, this parameter add "parameters:Form.serialize(this.form)" to form.
#8

[eluser]blaff[/eluser]
Hi!

I have managed to produce this code

Code:
[removed]
    //&lt;![CDATA[
    init = function() {
        $('album_filter').album.observe('change', sendIt);
    }
    sendIt = function(event) {
        var url = '/ajax/get_album_photos/' + $('album_filter').album.value;
        new Ajax.Request(url, {
            method: 'get',
            onComplete: function(truck) {
                alert(truck.responseText);
                document.getElementById('selection_list')[removed] = truck.responseText;
            }
        });
    }
    document.observe("dom:loaded", init);
    //]]>
    [removed]

However, it doesnt work in IE7 (works fine in firefox), it sais that "the object doesnt support that property or method" and points to the code below
Code:
$('album_filter').album.observe('change', sendIt);
#9

[eluser]Unknown[/eluser]
[quote author="razzaghis" date="1220085868"]
add 'with'=>'' to Options, this parameter add "parameters:Form.serialize(this.form)" to form.[/quote]

After messing around with this for hours I still don't get it...

When I'm using the code with the 'with' option, the send button is inactive - it does plain nothing. Without the 'with' option, the button works, but the called page doesn't receive any $_POST data. Sad

What am I doing wrong?
#10

[eluser]qirk petrucci[/eluser]
Quote:add ‘with’=>’‘ to Options, this parameter add “parameters:Form.serialize(this.form)” to form.

i ran into this problem too.
the $_POST was not there after submit.

i don't know what's happening in the background, but using this "with" fix my problem.
thx a lot.




Theme © iAndrew 2016 - Forum software by © MyBB