+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: Archived Discussions (https://forum.codeigniter.com/forumdisplay.php?fid=20)
+--- Forum: Archived Development & Programming (https://forum.codeigniter.com/forumdisplay.php?fid=23)
+--- Thread: CI and jQuery help (/showthread.php?tid=8542)
Pages:
1
2
CI and jQuery help - El Forum - 05-21-2008
[eluser]Sceneshift[/eluser]
Bit of a broad question here, I've read through pretty much all the jQuery threads on this forum and can't really find any answers.
I have a form which I would like to return some results from a database dynamically using jQuery. Kind of like an auto complete, but with a submit button since auto completes are pretty intensive.
I was wondering if anyone could link me to any information, or perhaps show me some snippets of code to get me started.
Thanks
CI and jQuery help - El Forum - 05-21-2008
[eluser]MCrittenden[/eluser]
Do you mean that you want to submit the form and get the results dynamically, or do you mean you want data from the db to be used to populate the form before you submit? If you're talking about the first one, the jQuery Form plugin should do the trick. There are examples on the site, but basically you bind the function to the form using something like:
Code:
// wait for the DOM to be loaded
$(document).ready(function() {
// bind 'myForm' and provide a simple callback function
$('#myForm').ajaxForm(function() {
alert("Thank you for your comment!");
});
});That will trigger an alert after the form is submitted. To get a little more useful, you can add the $data parameter to the callback function, and whatever the page that the form is sent to returns will be passed into the function. Something like this:
Code:
// wait for the DOM to be loaded
$(document).ready(function() {
// bind 'myForm' and provide a simple callback function
$('#myForm').ajaxForm(function(data) {
alert(data);
});
});That will trigger an alert whose contents are whatever data the outside page sends back to your page. For a little more in depth example, I wrote a blog about making an AJAX contact form which displays a message depending on if the email was successfully sent or not. Check it out if you need to: http://capsizedesigns.com/blog/2008/04/an-ultra-slick-ajax-contact-form-with-jquery/
Hope that helps, and I apologize if I misunderstood your question!
CI and jQuery help - El Forum - 05-22-2008
[eluser]Sceneshift[/eluser]
Thanks a lot for the help, really useful.
Is there a way to get AJAX to call a model, so I can do all my database logic within CI using the active record class? That'd be really awesome.
CI and jQuery help - El Forum - 05-22-2008
[eluser]Crimp[/eluser]
You always call a controller, which of course can call a model in turn and return the result of your queries, done by AR in the model if you want.
CI and jQuery help - El Forum - 05-22-2008
[eluser]Sceneshift[/eluser]
So in a nutshell, I create a method in a controller which handles retrieving data from a database (via a model or whatever) and then passes that data back to the AJAX somehow to be displayed on the fly?
Seems pretty straight forward, although I am unsure of how to get a controller to return data.
CI and jQuery help - El Forum - 05-22-2008
[eluser]MCrittenden[/eluser]
[quote author="Sceneshift" date="1211482191"]I am unsure of how to get a controller to return data.[/quote]
The easiest way for me is to simply echo what you want to return in the controller, so anything echoed will be passed into the "data" parameter in my example instead of actually being echoed onto the page. You might also try a return statement in the controller...seems like that's the more obvious way to do it, but I've never tried it.
CI and jQuery help - El Forum - 05-22-2008
[eluser]Sceneshift[/eluser]
So I have a view setup like so:
Code:
<form name="catch_edit" method="POST" action="<?=site_url("catches/do_edit/")?>">
<input type="text" name="tbLocation" />
<input type="submit" name="submit" value="Find" />
</form>And the catches/do_edit function of my controller looks like so:
Code:
function do_edit()
{
//$user_data = $this->User->check_user(true);
// $this->load->model('catch_data', 'Catch');
//$results = $this->Catch->get_location(1); //get the record from the database
echo "hi";
}For some reason, when I submit the form, it just returns the entire pages source code, any ideas why this is happening? Sorry for being such an ignorant git.
CI and jQuery help - El Forum - 05-22-2008
[eluser]MCrittenden[/eluser]
No worries! Your view and method look fine. Try posting your jQuery code maybe. Does it leave the page when you click submit or does it return the source code you were talking about to the form page without leaving?
CI and jQuery help - El Forum - 05-22-2008
[eluser]Sceneshift[/eluser]
Code:
$(document).ready(function(){
$('#catch_edit').ajaxForm(function(data) {
alert(data);
});
});Is all I am doing, I was just expecting it to alert "Hi"
It doesn't leave the page though, so I assume JQuery is doing it's thing correctly.
CI and jQuery help - El Forum - 05-22-2008
[eluser]MCrittenden[/eluser]
The code you posted assumes that catch_edit is the ID of the form, when it's really the name, so it's not binding it to the function because it can't find it. However, the fact that it's not leaving the page is weird...like it's still finding it somehow. Anyway, I guess the next step is to try giving the form id="catch_edit" and see if that changes anything. Sorry this isn't going well for you!