[ASP4.0] ListBox SelectedIndexChanged ClientSide afhandelen*

[PdeBie]

Ik heb een listbox in mijn formulier welke serverside gevuld wordt met data. (ter info: selectionmode > single)
Als de gebruiker een van de items aanklik, wil ik wat additionele info van de keuze tonen maar zonder een postback te doen. Ik wil alles dus ClientSide afhandelen verder.

Hoe kan ik nu het OnSelectedIndexChanged event op de client afhandelen? Ik heb uiteraard autopostback op false gezet.

Ik dacht simpelweg een javascript functie aan te roepen door onderstaande code te gebruiken, maar dat pikt hij niet.

HTML:

<asp:ListBox ID="ListBox1" runat="server" SelectionMode="Single" AutoPostBack="false" OnSelectedIndexChanged="javascript:ListBox1_Change()">
</asp:ListBox>

[PdeBie]

Heb even met JQuery gepuzzeld en kwam op het volgende uit.

JavaScript:

$(document).ready(function () { 
    $('#<%= ListBox1.ClientID %>').change(function()
            { alert($('#<%= ListBox1.ClientID %>').val()); }
        );
    });

Het werkt. Maar is dit de juiste methode?

[RobIII]

Welke versie van ASP.net gebruik je? Kijk hier/hier/hier eens als je 4.0 gebruikt.

[Voor 35% gewijzigd door RobIII op 01-06-2011 15:21]

[PdeBie]

ja ik gebruik 4.0. Wat je nu aangeeft zal ik eens bekijken.
Maar als we naast het ID eens kijken naar het koppelen van het event. Dat is wel de juiste methode?

[PdeBie]

Wil ik ook meteen even inspringen op het volgende issue.

De additionele info (zie 1e post) wil ik clientside oproepen. Ik zat eraan te denken om hiervoor een key-value pair te gebruiken.
De values van de items in de listbox zijn namelijk ID's. Dit ID kan ik als Key gebruiken.
Als de key voorkomt in de key-value pair, kan ik de value van de key-value gebruiken als additionele info.

Maar ik weet niet of er iets bestaat als een keyvalue pair in javascript.

[BtM909]

Wil je er ff op letten dat je niet dubbele posts achter elkaar plaatst binnen 24 uur? Je kan dan de knop gebruiken

[RobIII]

pdebie schreef op woensdag 01 juni 2011 @ 15:36:
Maar ik weet niet of er iets bestaat als een keyvalue pair in javascript.

Rocket science...

[PdeBie]

key-value pair 'probleem' opgelost met een array in de vorm van:

JavaScript:

var ListRemarks = {"1" : "opmerking bij 1", "4" : "opmerking bij 4" };

Deze wordt vanuit de code-behind gevuld.

Dit levert uiteindelijk het volgende op:

JavaScript:

$(document).ready(function () {
            var ListRemarks = <%= Remarks %>;
            $('#<%= ListBox1.ClientID %>').change(function () { 
                if(ListRemarks[$('#<%= ListBox1.ClientID %>').val()] != undefined)
                    $('#<%= lbl1.ClientID %>').text(ListRemarks[$('#<%= ListBox1.ClientID %>').val()]);                    
                else
                    $('#<%= lbl1.ClientID %>').text('');
            } );
        });

Nu enkel nog kijken naar de oplossing van RobIII met betrekking tot de ID's van de controls binnen de javascript.