[RESOLVED] Dynamically created controls not accessible with client javascript

[Fuga]

Hi,

I´ve tried creating checkboxes, literalcontrols and textboxes.

I need to generate checkboxes dynamically, depending on how many types of <whatever> the user has put in. I know how to do this (I think), but the problem is the controls don´t work as they should.

If I create server controls, then for some reason I can´t change the value with javascript. If I create client controls, then something appears to happen with the id so the server can´t fetch the value (it doesn´t recognize the id, allthough it´s there in the html)

I can´t use a regular checkbox with autopostback because there is to much happening at page load.

On other pages on the site, this works, but on those pages the controls are not created dynamically.

Thanks.

Fuga.

[gep13]

Hello Fuga,

In order to best help you with this, we are really going to need to see the code that you are currently using.

Is it possible that you can share this with us?

Gary

[rjv_rnjn]

Look at the Id values on the rendered HTML page. Are they what you expect them to be?

And then post the offending code, as Gary suggested.

[Fuga]

Hi guys,
Thanks for answering!

yes of course

Look at the Id values on the rendered HTML page. Are they what you expect them to be?

yes, in the html. But in the runtime asp code (below) they turn up as nothing, which means I can´t get to them in the code.


The creation of controls, this is page load:

            Me.comCalc.Controls.Add(New LiteralControl("<input type=""checkbox"" onclick=""cl('" & pivrw.Item("SalID") & "')"" id=""" & pivrw.Item("SalID") & """ /><label id=""lb" & i & """ title=""" & pivrw.Item("SalID") & """ class=""comlabel"" type=""text"" style=""width:100px;color:black""/>" & Trim(pivrw.Item("SalTitle")) & "</label><div style=""clear:both""></div>"))
            Me.comCalc.Controls.Add(New TextBox() With {.ID = "txb" & pivrw.Item("SalID"), .Text = Trim(pivrw.Item("SalID")), .CssClass = "cbtext"})
            Me.comCalc.Controls.Add(New LiteralControl("<input id=""cp" & pivrw.Item("SalID") & """  type=""text"" value=""1"" runat=""server"" />"))

and then the fetching. it´s a button event (this gives id=nothing. it finds the controls and recognises them as literalcontrols):

                        For Each ctl As Control In Me.comCalc.Controls
                If TypeOf ctl Is LiteralControl Then
                    If Left(ctl.ID, 2) = "cp" Then
                        Dim icp As New HtmlInputText
                        icp = ctl
                        Checkboxes(ctli) = CInt(icp.Value)
                        ctli = ctli + 1
                    End If
                    ctlindex = ctlindex + 1
                End If

            Next

and the javascript (this works, in that it changes the value from 1 to 0 and vice versa, allthough not in the html, but I guess that´s not surprising)

function cl(salid) {
    if (document.getElementById("cp" + salid).value == "0") {
        document.getElementById("cp" + salid).value = "1"
    }
    else {
        document.getElementById("cp" + salid).value = "0"
    }
}

edit: it´s the "cp"-control I need to use the value of when I press the button.

Thanks again
Fuga.

[gep13]

Hello,

The problem here is that you are not accessing the controls that had been created when the page first loads, you are accessing "new" controls when the page is posted back.

Using dynamically created controls can be tricky, and you need to make sure that you use the right event handlers for accessing existing controls.

I would highly recommend that you read through this article:

http://www.4guysfromrolla.com/articles/092904-1.aspx

Hope that helps!

Gary

[Lightning]

You can get the "real" ID of a dynamicly created control using control.ClientID.

[Fuga]

Hi again,
and thanks guys for answering.

Gary, thanks for the tip on the article. I´ve read it, and then put the code in the init event handler instead of the load event handler, and so far it works. Thanks!

I´m marking it resolved.
Fuga

[gep13]

Great, glad to hear that you got it working!

Gary