Displaying database value without reloading the page using Jquery: Not working

Question

I am trying to show information from database without reloading the page. I have a dropdown select option in my view, when I select any value, the dropdown only shows the table titles, but not the data from database. I tried hard to figure out the problem, but I failed.

And when users choose <option value="">Select a person:</option>, I want the jquery to send data to this controller- (test/index), but I don't know how to do this.

Would you please kindly help me to solve these problems? Below is my jQuery, markup, and CodeIgniter code.

Inside Head:

<script type="text/javascript" src="<?php echo base_url(); ?>support/js/jquery-1.6.2.min.js"></script>
<script type="text/javascript">

    $(document).ready(function() {

        $("select[name='users']").attr("selectedIndex", 1);

        $("select[name='users']").change(function() {
            var str = $(this).val();
            if( str == "" ) {
                $("#txtHint").html("");
            }
            else {
                $.get("<?php echo base_url(); ?>test/query/str", function(data) { $("#txtHint").html(data) });
            }
       }).change();
    });
</script>

Inside Body:

<form>
    <select name="users" >
        <option value="">Select a person:</option>
        <option value="11080101">Sumon</option>
        <option value="11080102">Donno</option>
    </select>
</form>
<br />
<div id="txtHint"><b>Person info will be listed here.</b></div>

My Controller :

function query($id){

    $sql="SELECT * FROM attendancein WHERE attendeeid = '$id'";

    $result = mysql_query($sql);

    echo "<table border='1'>
        <tr>
            <th>date</th>
            <th>In Time</th>
            <th>In Status</th>
            <th>Class Start Time</th>
        </tr>";

    while($row = mysql_fetch_array($result))
    {
        echo "<tr>";
        echo "<td>" . $row['date'] . "</td>";
        echo "<td>" . $row['intime'] . "</td>";
        echo "<td>" . $row['instatus'] . "</td>";
        echo "<td>" . $row['classstarttime'] . "</td>";
        echo "</tr>";
    }

    echo "</table>";
}

Jesper · Accepted Answer · 2011-11-01 20:02:26Z

1

As you probably understood, you're not returning any data because the controller isn't getting any arguments.

I'm not completely familiar with routing in CodeIgniter, but it seems to be some flavour of REST. This is nice, but jQuery plays a little bit nicer with query strings than standard RESTful routing.

But don't worry. That only means that you have merge your query data into the url, instead of having jQuery send it using a query string.

I think you want to do a jQuery get() like this:

$.get(
  "<?php echo base_url(); ?>test/query/" + str,
  function(data) {
    $("#txtHint").html(data);
  }
);

This is assuming you have a route similar to this:

$route['test/query/(:num)'] = yourController:

edited Nov 1, 2011 at 20:02

answered Nov 1, 2011 at 18:23

Jesper

4,5552 gold badges25 silver badges34 bronze badges

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

2 Comments

black_belt Over a year ago

Thank you very much Jesper, I just replaced $.get("<?php echo base_url(); ?>test/query/str", with $.get("<?php echo base_url(); ?>test/query/"+ str, And it is working exactly how I wanted. :)

black_belt Over a year ago

I am sorry, I reposted your answer. I just wanted to show the exact solution to the problem. However, I have deleted my post and marked your answer as accepted. :) thanks

Collectives™ on Stack Overflow

Displaying database value without reloading the page using Jquery: Not working

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related