Sorttable

Hello.

I am using sorrtable javascript code for sort table data.

But while using Ajax to fetch mysql data , this is not working.
I found solution on the website , but U am really beginner in javascript code , so I dont know hot to implement it.

You have to manually call the function sorttable.makeSortable() passing it the table you just got back from AJAX. The simplest way to do this is to give your table an ID and then use:

sorttable.makeSortable(document.getElementById('the_table_id'));

Could anyone help me out?

Then, when we have a way to experience the non-working way that things are going for you, we can help you to get it going.

Ahh, there’s some confusion here.

We want to be able to have a look at your ajax code that’s having the trouble. As there are many different ways to do ajax code, there are many possible solutions. Once we know what you’re working with, we can suggest a solution that will help you.

word sorttable was linked above , but if you dont see here it is :

http://www.kryogenix.org/code/browser/sorttable/

This is not working with onload events. I mean :

Select form with some options , after selecting any of option data is fetched , but sorttable not working.

Otherwise without selecting form works well. So probably function have to be called again after fetching data with ajax.

What then?

Typically the problem is not with the vendor, especially when they claim, and provide examples of, how to achieve the end result.

What will be more instructive is for us to investigate a working example of your non-working web page.

Can you provide a link to the site, or some sample code?

We cannot help you with this until we know about the ajax calls that you are making, which update the table.

Already tried it , but unfortunately with no effect at all.

Could you look at this sorttable javascript code?
Cause maybe it’s wrong called , or anything else.

http://www.kryogenix.org/code/browser/sorttable/sorttable.js

Okay, here is the code you were asked to add.


sorttable.makeSortable(document.getElementById('the_table_id'));

If txtHint contains the table to be sorted, you can combine it with the above code, like this:


xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    sorttable.makeSortable(document.getElementById('txtHint'));
    }
  }

Thanks anyway.

Here I uploaded some examples :

test/test123

With onload content using ajax
http://tsp.nstrefa.pl/sorttable/

And normal fetching data.
http://tsp.nstrefa.pl/sorttable/getuser.php

Ajax code is so simple , getting by element id

<script type="text/javascript">
function showUser(str)
{
if (str=="")
  {
  document.getElementById("txtHint").innerHTML="";

  return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","js.php?q="+str,true);
xmlhttp.send();

}

</script>

and html form :

<form>
<select name="users" onchange="showUser(this.value)">
<option value="">Select a person:</option>
<option value="Olympa" >Olympa</option>
</select>
</form>
<br />
<div id="txtHint" class='sortable'><b>Person info will be listed here.</b></div>