Avatar billede tobiha Nybegynder
13. november 2008 - 19:00 Der er 3 kommentarer og
1 løsning

Table sortering

Jeg har lavet en tabel ud fra en xml fil. Jeg har manuelt lavet en header-row med en linkbutton i hver cell. Når man trykker på et link skal den så sortere tabellen. Hvordan sortere man nemmest en table manuelt?
Jeg bruger Asp.Net og C#
Avatar billede tjens Nybegynder
13. november 2008 - 20:41 #1
Hvis det må være client-side (sorteringen foretages direkte af browseren) kan du bruge XSLT på din XML-fil.

Demoer:
MSIE: http://tjens.dk/eksperten/xsl02/showvotesIE.html
Firefox: http://tjens.dk/eksperten/xsl02/showvotesFF.html
Avatar billede tobiha Nybegynder
13. november 2008 - 20:53 #2
orv hvad! Det er da lige det der jeg leder efter. Kan jeg få noget soucekode på det??
Avatar billede tjens Nybegynder
13. november 2008 - 21:01 #3
Browseren henter selv XML og XSL filerne, men de ser således ud:
XML: http://tjens.dk/eksperten/xsl02/votes.xml
XSL: http://tjens.dk/eksperten/xsl02/votes.xsl

HTML:

<html>
<head>
<title>XSL transform Demo</title>

<style type="text/css">
    body    {background-color: white; font-family : sans-serif;}
    table, th, tr, td        {border: 1px solid grey; border-collapse: collapse; padding: 2px 8px 2px 8px;}
    #hovered    {background : PapayaWhip;}
    tr.selected    {font-weight: bold; background-color: LemonChiffon;}
    #TD_hovered    {background : PeachPuff;cursor: pointer;}
    .minor {color : gray}
</style>

<script type="text/javascript">
var projectKeysString='dummy';
var ProjectsXML;
var xml;
var xsl = new ActiveXObject("Microsoft.XMLDOM");
xsl.async = false;
xsl.load("votes.xsl");
var sort=xsl.getElementsByTagName("xsl:sort");

function showMain(P_sort, type) {    // modify XSL

    var selected = sort[0].getAttribute('select');
    var order    = sort[0].getAttribute('order');
    document.getElementById(selected + "TH").innerText = ' ';
    var indicator = 'v';
    if (P_sort == selected && order == "ascending") {
        sort[0].setAttribute('order', 'descending');
        indicator = '^';
    }
    else {
        sort[0].setAttribute('order', 'ascending');
    }
    sort[0].setAttribute('select', P_sort);
    sort[0].setAttribute('data-type', type);
   
    document.getElementById("MainFrame").innerHTML=xml.transformNode(xsl);
    document.getElementById(P_sort + "TH").innerText = indicator;
}

function createXMLfromFile(f) {
    document.getElementById("MainFrame").innerHTML="Loading...";
    //resetSort();
    xml = new ActiveXObject("Microsoft.XMLDOM");
    xml.async = false;
    xml.load(f) ;// Load XML
    var count=xml.getElementsByTagName("kandidater");
    if (count.length < 1 )
        document.getElementById("MainFrame").innerHTML='<pre>' + f + '</pre> not found or not valid XML';
    else
        document.getElementById("MainFrame").innerHTML=xml.transformNode(xsl);   
    return count.length;

}

function resetSort() {
        sort[0].setAttribute('order', 'descending');
        sort[0].setAttribute('select', 'stemmer');
}

</script>

</head>

<body onload="createXMLfromFile('votes.xml') ;">
<div>
<p>
</p>
</div>

<div id="MainFrame">
Your browser does not support the scripts on this page
</div>
</body>
</html>
Avatar billede tobiha Nybegynder
13. november 2008 - 21:05 #4
takker
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
IT-kurser om Microsoft 365, sikkerhed, personlig vækst, udvikling, digital markedsføring, grafisk design, SAP og forretningsanalyse.

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester